:root {
  color-scheme: dark;
  --bg: #080808;
  --surface: #121212;
  --text: #F4EFE6;
  --muted: #aaa59b;
  --gold: #D7B27C;
  --line: rgba(226, 216, 202, .12);
  --sans: 'Geist', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --mono: 'JetBrains Mono', ui-monospace, monospace;
  --ease: cubic-bezier(.22, .68, 0, 1);
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 120px; overflow-x: clip; }
body { margin: 0; background: var(--bg); color: var(--text); font: 400 16px/1.6 var(--sans); overflow-x: clip; -webkit-font-smoothing: antialiased; }
a { color: inherit; text-decoration: none; }
button { font: inherit; cursor: pointer; }
img, svg { max-width: 100%; }
h1, h2, h3, h4, p { margin-top: 0; }
em { color: var(--gold); font-style: normal; }
::selection { background: var(--gold); color: var(--bg); }
:focus-visible { outline: 2px solid var(--gold); outline-offset: 5px; }
[hidden] { display: none !important; }
.wrap { width: min(100% - 64px, 1216px); margin-inline: auto; }
section { padding: clamp(80px, 9vw, 136px) 0; position: relative; }
.eyebrow { color: var(--gold); font: 500 11px/1.5 var(--mono); letter-spacing: .13em; text-transform: uppercase; }
.dot { display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: var(--gold); flex: 0 0 auto; }
.section { font-size: clamp(32px, 4vw, 52px); line-height: 1.12; font-weight: 600; letter-spacing: -.045em; margin-bottom: 22px; }
.lead { color: var(--muted); font-size: 17px; line-height: 1.75; }
.section-head { max-width: 670px; margin-bottom: 48px; }
.section-head.centered { margin-inline: auto; text-align: center; }
.liquid-glass { position: relative; border: 1px solid transparent; background: linear-gradient(135deg, rgba(34, 33, 31, .83), rgba(15, 15, 14, .9)) padding-box, linear-gradient(135deg, rgba(250, 233, 207, .28), rgba(230, 218, 200, .04) 50%, rgba(225, 211, 186, .16)) border-box; backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); box-shadow: inset 0 1px 0 rgba(245, 250, 244, .04), 0 20px 70px rgba(0, 0, 0, .13); }
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 14px; min-height: 48px; padding: 12px 23px; border: 1px solid transparent; border-radius: 999px; font-size: 14px; font-weight: 600; transition: transform 200ms var(--ease), background-color 200ms; }
.btn:hover { transform: translateY(-2px); }
.btn:active { transform: translateY(1px); }
.btn-primary { background: var(--gold); color: #18130c; }
.btn-primary:hover { background: #c8a36f; }
.btn-ghost { color: var(--text); }
.arr { font-size: 18px; font-weight: 400; }
.cta-row { display: flex; flex-wrap: wrap; gap: 12px; }
.skip-link { position: fixed; top: -100px; left: 24px; z-index: 200; padding: 12px 24px; color: var(--bg); background: var(--gold); border-radius: 99px; }
.skip-link:focus { top: 16px; }
.svg-defs { position: absolute; width: 0; height: 0; overflow: hidden; }
.nav { position: fixed; top: 22px; left: 0; right: 0; z-index: 100; }
.nav .row { width: min(100% - 48px, 1010px); display: flex; align-items: center; gap: 40px; min-height: 68px; padding: 10px 12px 10px 24px; border-radius: 999px; }
.brand { display: inline-flex; gap: 9px; align-items: center; }
.brand-mark { width: 32px; height: 32px; background: url('assets/logo-mark.png') center/contain no-repeat; filter: grayscale(1) brightness(1.8); }
.brand-name { font-size: 20px; font-weight: 600; letter-spacing: -.045em; }
.brand-wordmark { display: flex; flex-direction: column; gap: 3px; line-height: 1; white-space: nowrap; }
.brand-byline { color: var(--muted); font-size: 9px; font-weight: 500; letter-spacing: .06em; }
.menu { display: flex; margin: 0 auto; padding: 0; gap: 30px; list-style: none; }
.menu a { color: #c8c2b9; font-size: 13px; }
.menu a:hover, .menu a[aria-current], .foot-col a:hover { color: var(--gold); }
.btn-small { min-height: 43px; padding: 10px 23px; font-size: 13px; }
.nav-toggle { display: none; border: 1px solid var(--line); background: transparent; width: 44px; height: 44px; border-radius: 50%; color: var(--text); }
.nav-toggle span, .nav-toggle span::after { display: block; width: 16px; height: 1px; background: currentColor; margin: auto; position: relative; }
.nav-toggle span::after { content: ''; position: absolute; top: 6px; }
.mobile-menu { position: fixed; z-index: 100; top: 100px; left: 24px; right: 24px; padding: 18px 24px; border-radius: 24px; }
.mobile-menu > a { display: block; padding: 13px 0; border-bottom: 1px solid var(--line); }
.mobile-actions { padding-top: 18px; }
.scroll-margin { position: fixed; top: 0; left: 0; right: 0; height: 2px; z-index: 100; pointer-events: none; }
.scroll-margin .fill { height: 100%; background: var(--gold); transform: scaleX(0); transform-origin: left; }
.hero { position: relative; min-height: min(100dvh, 1000px); padding: 160px 0 0; display: flex; flex-direction: column; justify-content: center; isolation: isolate; }
.hero-light { position: absolute; inset: 0; z-index: -1; background: radial-gradient(ellipse at 78% 49%, rgba(126, 101, 65, .18), transparent 36%), radial-gradient(ellipse at 100% 25%, rgba(95, 85, 66, .23), transparent 52%); }
.hero::after { content: ''; position: absolute; inset: 0; z-index: -1; opacity: .13; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%239c9aab' filter='url(%23n)' opacity='.35' d='M0 0h180v180H0z'/%3E%3C/svg%3E"); pointer-events: none; }
.hero-grid { display: grid; grid-template-columns: 1.05fr 1fr; gap: 20px; align-items: center; }
.announcement { display: inline-flex; align-items: center; gap: 10px; border-radius: 999px; padding: 8px 13px; font-size: 11px; color: #d0c7b9; margin-bottom: 25px; }
.display { font-size: clamp(44px, 4.9vw, 68px); line-height: 1.09; font-weight: 600; letter-spacing: -.057em; margin-bottom: 25px; }
.hero-copy .lead { max-width: 45ch; margin-bottom: 30px; }
@property --balance-angle { syntax: '<angle>'; inherits: true; initial-value: 0deg; }
.hero-art { position: relative; height: 550px; animation: balance-sway 8s ease-in-out infinite; }
@keyframes balance-sway { 0%, 100% { --balance-angle: -7deg; } 50% { --balance-angle: 7deg; } }
.hero-scale { position: absolute; width: 115%; max-width: none; left: -6%; top: -3%; height: 100%; transform: translateY(var(--hero-shift, 0px)); }
.scale-assembly { transform-origin: 300px 150px; transform: rotate(var(--balance-angle, 0deg)); }
.scale-pan { transform: rotate(calc(-1 * var(--balance-angle, 0deg))); }
.pan-left { transform-origin: 140px 149px; }
.pan-right { transform-origin: 460px 149px; }
.scale-glint { animation: glass-reflection 6s ease-in-out infinite; }
.pan-right .scale-glint { animation-delay: -3s; }
@keyframes glass-reflection { 0%, 100% { opacity: .2; } 50% { opacity: .85; } }
.hero-orbit { position: absolute; width: 104%; height: 64%; border: 1px solid rgba(210, 181, 142, .09); border-radius: 50%; top: 12%; left: -2%; transform: rotate(-26deg); }
.orbit-two { width: 95%; height: 70%; left: 2%; top: 10%; transform: rotate(24deg); border-color: rgba(199, 173, 132, .12); }
.hero-bottom { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 35px 0 24px; color: #8c857b; font: 9px var(--mono); letter-spacing: .12em; }
.scroll-hint { display: flex; gap: 11px; align-items: center; letter-spacing: 0; font: 12px var(--sans); color: #c7c1b9; }
.scroll-hint span { display: grid; place-items: center; width: 30px; height: 36px; border: 1px solid var(--line); border-radius: 99px; color: var(--gold); }
.scrolly { background: radial-gradient(ellipse at 90% 40%, rgba(67, 62, 54, .09), transparent 38%); padding-bottom: 90px; }
.scrolly .intro { max-width: 800px; text-align: center; margin: 0 auto 55px; }
.intro .section { margin: 18px 0; }
.intro .lead { max-width: 65ch; margin: 0 auto; }
.scrolly-stage { display: grid; grid-template-columns: 1fr 1fr; gap: 72px; position: relative; }
.scrolly-left { position: relative; }
.stage-item { min-height: 85dvh; display: flex; flex-direction: column; justify-content: center; padding: 70px 0 70px 26px; }
.stage-num { color: var(--gold); font: 10px/1.6 var(--mono); letter-spacing: .035em; margin-bottom: 22px; }
.stage-item h3 { font-size: clamp(30px, 3.3vw, 44px); line-height: 1.16; letter-spacing: -.04em; font-weight: 500; margin-bottom: 20px; }
.stage-item p { color: var(--muted); font-size: 16px; line-height: 1.8; max-width: 43ch; margin-bottom: 0; }
.stage-path { position: absolute; left: 0; top: 0; bottom: 0; width: 1px; background: var(--line); }
.stage-path .fill { position: absolute; inset: 0; background: var(--gold); transform: scaleY(0); transform-origin: top; }
.stage-path .node { position: absolute; width: 7px; height: 7px; left: -3px; border-radius: 50%; background: #35312b; border: 1px solid #60584b; }
.stage-path .node.active { background: var(--gold); border-color: var(--gold); }
.scrolly-right { position: sticky; top: max(105px, calc((100dvh - 640px) / 2)); height: min(640px, calc(100dvh - 125px)); align-self: start; display: grid; grid-template-rows: minmax(0, 1fr); place-items: center; isolation: isolate; }
.justice-story { width: 110%; max-width: none; height: 100%; min-height: 0; overflow: visible; }
.pan-document { opacity: var(--pan-load, 1); }
.question-sheet { opacity: var(--question-opacity, 1); transform: translateY(var(--question-fall, 0px)); }
.research-connections { opacity: var(--connection-opacity, 0); }
.review-sweep { opacity: var(--review-opacity, 0); transform-origin: 320px 360px; transform: rotate(var(--review-turn, 0deg)); }
.evidence-page { opacity: 0; }
.scale-story-scene, .judgment-scene { transform-origin: 320px 470px; transition: opacity .3s ease, transform .7s cubic-bezier(.2,.7,.3,1); }
.judgment-scene { opacity: 0; transform: translateY(22px) scale(.94); transition: opacity .45s .16s ease, transform .7s .12s cubic-bezier(.2,.7,.3,1); }
.scrolly-right[data-chapter="7"] .scale-story-scene { opacity: 0; transform: translateY(12px) scale(.94); }
.scrolly-right[data-chapter="7"] .judgment-scene { opacity: 1; transform: none; }
@property --gavel-angle { syntax: '<angle>'; inherits: true; initial-value: 0deg; }
.judgment-gavel { transform-origin: 468.4px 445px; transform: translateY(32px) rotate(var(--gavel-angle)); }
.judgment-shadow {
  transform-origin: 244px 535px;
  /* Project the head's centre onto the block from the same angle as the strike. */
  transform: translateX(calc(224.4px * (1 - cos(var(--gavel-angle))) + 22px * sin(var(--gavel-angle)))) scaleX(calc(1 + .55 * sin(var(--gavel-angle)))) scaleY(calc(1 + .7 * sin(var(--gavel-angle))));
  opacity: calc(.6 - .8 * sin(var(--gavel-angle)));
  filter: blur(calc(.7px + 5px * sin(var(--gavel-angle))));
}
.judgment-active .judgment-scene { animation: judgment-strike 1.8s .2s both; }
.judgment-active .judgment-block { animation: judgment-contact .35s 1.208s both; }
@keyframes judgment-strike {
  0% { --gavel-angle: 12deg; animation-timing-function: cubic-bezier(.2,.7,.3,1); }
  26% { --gavel-angle: 36deg; animation-timing-function: ease-in-out; }
  43% { --gavel-angle: 36deg; animation-timing-function: cubic-bezier(.7,0,.9,.5); }
  56% { --gavel-angle: 0deg; animation-timing-function: cubic-bezier(.1,.8,.3,1); }
  64% { --gavel-angle: 3deg; animation-timing-function: ease-in; }
  77% { --gavel-angle: 0deg; animation-timing-function: ease-out; }
  100% { --gavel-angle: 0deg; }
}
@keyframes judgment-contact {
  0%, 100% { transform: translateY(0); }
  28% { transform: translateY(2px); }
}
#who { border-top: 1px solid var(--line); background: radial-gradient(ellipse at 20% 65%, rgba(120, 98, 77, .1), transparent 60%); }
#who .wrap { display: grid; grid-template-columns: .9fr 1.1fr; gap: 80px; align-items: center; }
#who .section-head { text-align: left; margin: 0; }
.usecases { display: flex; flex-direction: column; gap: 14px; }
.usecase { display: grid; grid-template-columns: 46px 1fr; column-gap: 20px; border-radius: 24px; padding: 25px; }
.uc-icon { grid-row: span 2; width: 44px; height: 44px; border: 1px solid rgba(215, 178, 124, .18); background: rgba(215, 178, 124, .04); color: var(--gold); border-radius: 14px; display: grid; place-items: center; }
.uc-icon svg { width: 22px; height: 22px; }
.usecase h4 { font-size: 17px; font-weight: 500; letter-spacing: -.02em; margin-bottom: 5px; }
.usecase p { margin: 0; font-size: 13px; color: var(--muted); }
.pilot { background: radial-gradient(ellipse at 50% 55%, rgba(180, 146, 103, .075), transparent 60%); }
.plans { display: grid; grid-template-columns: 1fr 1.16fr 1fr; gap: 20px; align-items: stretch; }
.plan { padding: 32px; border-radius: 28px; display: flex; flex-direction: column; }
.plan.featured { background: linear-gradient(145deg, rgba(51, 43, 34, .72), rgba(17, 17, 16, .93)) padding-box, linear-gradient(135deg, rgba(215, 178, 124, .65), rgba(215, 178, 124, .14)) border-box; }
.plan-name { color: #c5beb3; font-size: 13px; margin-bottom: 23px; }
.plan-price { font-size: 48px; font-weight: 500; line-height: 1.15; letter-spacing: -.055em; }
.rupee { font-size: 28px; color: #bdb19c; margin-right: 4px; font-weight: 400; }
.plan-tagline { font-size: 13px; color: var(--muted); margin: 20px 0; min-height: 63px; }
.plan-features { list-style: none; padding: 20px 0 28px; margin: 0; border-top: 1px solid var(--line); flex: 1; }
.plan-features li { font-size: 13px; color: #cbc4b9; margin-bottom: 13px; padding-left: 22px; position: relative; }
.plan-features li::before { content: '✓'; position: absolute; left: 0; color: var(--gold); }
.plan-cta { min-height: 46px; border: 1px solid var(--line); color: var(--text); background: rgba(232, 222, 205, .035); border-radius: 99px; font-size: 13px; transition: transform 200ms, background-color 200ms; }
.plan-cta:hover { background: rgba(232, 222, 205, .07); transform: translateY(-2px); }
.featured .plan-cta { background: var(--gold); color: #18130c; border-color: var(--gold); }
#faq .wrap { display: grid; grid-template-columns: .75fr 1.25fr; gap: 80px; }
#faq .section-head { text-align: left; margin: 0; position: sticky; top: 140px; height: fit-content; }
.faq-list { display: flex; flex-direction: column; gap: 10px; }
.faq-item { border-radius: 18px; padding: 0 22px; }
.faq-item summary { display: flex; align-items: center; justify-content: space-between; gap: 20px; list-style: none; cursor: pointer; padding: 21px 0; font-size: 14px; line-height: 1.5; }
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary::after { content: '+'; font-size: 20px; color: var(--gold); font-weight: 400; }
.faq-item[open] summary::after { content: '−'; }
.faq-body { padding: 0 0 22px; font-size: 13px; line-height: 1.8; color: var(--muted); }
.faq-body p { margin: 0; }
.faq-body strong { font-weight: 500; color: var(--text); }
.final { text-align: center; background: radial-gradient(ellipse at 50% 35%, rgba(132, 107, 82, .13), transparent 55%), radial-gradient(ellipse at 80% 60%, rgba(129, 107, 60, .08), transparent 55%); padding-top: 50px; }
.scale-svg { width: 180px; height: 160px; display: block; margin: 0 auto 20px; }
.final .section { margin: 24px auto; max-width: 20ch; font-size: clamp(40px, 4.8vw, 64px); }
.final .lead { max-width: 45ch; margin: 0 auto 30px; }
.final .cta-row { justify-content: center; }
footer { border-top: 1px solid var(--line); padding: 64px 0 30px; background: #0b0b0b; }
.foot-grid { display: grid; grid-template-columns: 1.6fr repeat(3, .65fr); gap: 55px; margin-bottom: 50px; }
.foot-brand p { font-size: 13px; color: #9f9587; max-width: 37ch; margin: 16px 0 0; }
.foot-col h4 { font-weight: 500; font-size: 12px; margin: 7px 0 20px; color: #d6cfc3; }
.foot-col ul { list-style: none; padding: 0; margin: 0; }
.foot-col li { margin-bottom: 10px; font-size: 12px; color: #a1998c; }
.foot-bottom { display: flex; justify-content: space-between; gap: 48px; border-top: 1px solid var(--line); padding-top: 25px; }
.foot-tag { color: #b3a99a; font-size: 10px; }
.disclaimer { color: #918879; max-width: 59ch; font-size: 10px; line-height: 1.7; }
/* Content stays visible when JavaScript is unavailable. */
.js-motion .reveal { opacity: 0; transform: translateY(16px); transition: opacity 540ms var(--ease), transform 540ms var(--ease); }
.js-motion .reveal.in-view { opacity: 1; transform: translateY(0); }
@media (max-width: 1100px) {
  .hero-art { height: 470px; }
  .display { font-size: clamp(44px, 5.3vw, 60px); }
  .scrolly-stage { gap: 40px; }
  #who .wrap, #faq .wrap { gap: 45px; }
  .plan { padding: 26px; }
}
@media (max-width: 767px) {
  .wrap { width: calc(100% - 40px); }
  section { padding: 76px 0; }
  .nav { top: 14px; }
  .nav .row { width: calc(100% - 28px); min-height: 62px; padding: 8px 10px 8px 18px; gap: 10px; }
  .brand-name { font-size: 18px; }
  .menu { display: none; }
  .nav .actions { margin-left: auto; }
  .nav .btn-small { min-height: 40px; padding: 8px 16px; }
  .nav .arr { display: none; }
  .nav-toggle { display: block; flex-shrink: 0; }
  .mobile-menu { left: 14px; right: 14px; top: 87px; }
  .hero { padding: 132px 0 0; min-height: 100dvh; }
  .hero-grid { grid-template-columns: 1fr; gap: 24px; }
  .hero-copy { text-align: center; }
  .display { font-size: clamp(40px, 8.6vw, 62px); }
  .announcement { font-size: 10px; padding: 8px 11px; margin-bottom: 24px; }
  .hero-copy .lead { margin-inline: auto; font-size: 15px; max-width: 42ch; }
  .hero-copy .cta-row { justify-content: center; gap: 9px; }
  .btn { padding: 12px 18px; font-size: 12px; }
  .hero-art { height: 370px; width: min(100%, 440px); margin: 0 auto; }
  .hero-scale { width: 110%; left: -5%; }
  .hero-orbit { width: 96%; left: 2%; }
  .hero-bottom { justify-content: center; padding-top: 20px; }
  .scrolly .intro { margin-bottom: 38px; }
  .intro .lead { font-size: 15px; }
  .scrolly-stage { display: flex; flex-direction: column; gap: 24px; }
  .scrolly-right { order: -1; top: 88px; height: min(36dvh, 300px); width: 100%; z-index: 3; background: var(--bg); }
  .justice-story { width: 100%; max-width: 390px; }
  .stage-item { min-height: calc(100dvh - 88px - min(36dvh, 300px)); padding: 35px 0 35px 23px; scroll-margin-top: calc(88px + min(36dvh, 300px)); }
  .stage-item h3 { font-size: 29px; max-width: 20ch; }
  .stage-item p { font-size: 14px; max-width: 44ch; }
  .stage-num { font-size: 9px; margin-bottom: 16px; }
  #who .wrap, #faq .wrap { display: block; }
  #who .section-head, #faq .section-head { position: static; text-align: center; margin: 0 auto 35px; }
  .usecase { padding: 22px; column-gap: 15px; }
  .usecase h4 { font-size: 15px; }
  .usecase p { font-size: 12px; }
  .plans { grid-template-columns: 1fr; max-width: 480px; margin: 0 auto; gap: 15px; }
  .plan { padding: 30px; }
  .plan-tagline { min-height: 0; }
  .plan-features { padding-bottom: 15px; }
  .faq-item summary { font-size: 13px; padding: 18px 0; }
  .final { padding-top: 30px; }
  .final .lead { font-size: 15px; }
  .foot-grid { grid-template-columns: repeat(3, 1fr); gap: 24px; }
  .foot-brand { grid-column: 1 / -1; }
  .foot-bottom { display: block; }
  .disclaimer { margin-top: 17px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition: none !important; }
  .js-motion .reveal { opacity: 1; transform: none; }
  .hero-scale { transform: none; }
  .scale-assembly, .scale-pan, .question-sheet, .review-sweep { transform: none; }
}
