@font-face {
  font-family: "Inter";
  src: url("assets/fonts/InterLatinVariable.woff2") format("woff2-variations");
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}

:root {
  --ink: #09080d; --ink-raised: #111018; --paper: #f5f4f7; --white: #fff;
  --text: #f7f5fb; --text-soft: #aaa5b4; --light-ink: #19171d; --light-soft: #68636e;
  --line-dark: rgba(242,237,255,.14); --line-light: rgba(28,23,35,.14);
  --violet: #9c7cff; --violet-bright: #b9a4ff; --violet-deep: #6e4ddb;
  --max: 1380px; --gutter: clamp(22px,4vw,64px); --section-pad: clamp(104px,11vw,164px);
  --ease: cubic-bezier(.2,.8,.2,1);
}
*,*::before,*::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 90px; }
body { margin: 0; color: var(--text); background: var(--ink); font-family: "Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; font-optical-sizing: auto; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
a { color: inherit; text-decoration: none; }
button,input,textarea,select { font: inherit; }
button { color: inherit; }
button:disabled { cursor: wait; opacity: .68; }
h1,h2,h3,p { margin-top: 0; }
code { font-family: "SFMono-Regular",Consolas,"Liberation Mono",monospace; font-size: .88em; }

.skip-link { position: fixed; z-index: 300; top: 10px; left: 10px; padding: 11px 15px; color: var(--light-ink); background: var(--white); transform: translateY(-180%); transition: transform 150ms ease; }
.skip-link:focus { transform: none; }
.site-header { position: fixed; z-index: 100; top: 18px; left: 50%; width: min(calc(100% - 36px),var(--max)); min-height: 60px; display: flex; align-items: center; justify-content: space-between; gap: 28px; padding: 9px 10px 9px 16px; border: 1px solid transparent; border-radius: 15px; transform: translateX(-50%); transition: background 200ms ease,border-color 200ms ease,box-shadow 200ms ease,backdrop-filter 200ms ease; }
.site-header.is-scrolled { border-color: rgba(255,255,255,.16); background: rgba(9,8,13,.96); box-shadow: 0 18px 48px rgba(0,0,0,.28); }
.wordmark { display: inline-flex; align-items: center; gap: 15px; width: max-content; }
.brand-logo { width: auto; height: 30px; display: block; }
.wordmark small { margin-left: 5px; padding-left: 14px; border-left: 1px solid var(--line-dark); color: #a9a3b0; font-size: 10px; font-weight: 560; letter-spacing: 0; }
.header-actions,.site-header nav { display: flex; align-items: center; }
.header-actions { gap: 26px; }
.site-header nav { gap: 27px; color: #ded9e4; font-size: 14px; font-weight: 600; }
.site-header nav a { padding: 12px 0; transition: color 160ms ease; }
.header-cta { min-height: 40px; display: inline-flex; align-items: center; gap: 9px; padding: 0 15px; border: 1px solid rgba(255,255,255,.2); border-radius: 10px; color: #17131f; background: #f7f4ff; font-size: 12px; font-weight: 680; transition: transform 140ms ease,background 160ms ease; }
.header-cta span { font-size: 14px; line-height: 1; }

.hero { position: relative; min-height: 1180px; padding: clamp(154px,17vh,194px) var(--gutter) 110px; overflow: hidden; background: radial-gradient(ellipse 44% 28% at 50% 9%,rgba(111,77,219,.22),transparent 72%),linear-gradient(180deg,#0b0910 0%,#09080d 58%,#0b0910 100%); }
.hero::before { content: ""; position: absolute; top: -190px; left: 50%; width: 900px; height: 520px; border-radius: 50%; background: rgba(132,99,238,.08); filter: blur(90px); transform: translateX(-50%); pointer-events: none; }
.hero-copy { position: relative; z-index: 3; width: 100%; max-width: 1120px; display: grid; justify-items: center; margin: 0 auto; text-align: center; }
.eyebrow { display: flex; justify-content: center; align-items: center; gap: 9px; margin-bottom: 26px; color: #c1bac9; font-size: 13px; font-weight: 560; }
.eyebrow span { width: 7px; height: 7px; border-radius: 50%; background: var(--violet); box-shadow: 0 0 0 4px rgba(156,124,255,.1); }
.hero h1 { width: 100%; max-width: 1050px; margin: 0 auto 28px; text-align: center; font-size: clamp(64px,7.1vw,104px); font-weight: 610; line-height: .96; letter-spacing: -.07em; text-wrap: balance; }
.hero-support { max-width: 660px; margin: 0 auto; color: #c4becb; font-size: clamp(19px,1.8vw,25px); line-height: 1.42; letter-spacing: -.025em; text-wrap: balance; }
.hero-description { max-width: 720px; margin: 20px auto 0; color: #918a99; font-size: 14px; line-height: 1.68; text-wrap: balance; }
.hero-actions { display: flex; justify-content: center; align-items: center; gap: 12px; margin-top: 34px; }
.button { min-height: 52px; display: inline-flex; align-items: center; justify-content: center; gap: 26px; padding: 0 21px; border: 1px solid transparent; border-radius: 11px; font-size: 13px; font-weight: 680; cursor: pointer; transition: transform 140ms ease,background 180ms ease,box-shadow 180ms ease; }
.button:active,.header-cta:active { transform: scale(.98); }
.button-primary { color: #130f1c; background: #f7f4ff; box-shadow: inset 0 -1px 0 rgba(44,25,79,.2),0 12px 30px rgba(97,66,174,.14); }
.reassurance { max-width: 600px; margin: 19px auto 0; color: #837d8b; font-size: 12px; line-height: 1.55; }

.repair-trace { position: relative; z-index: 2; width: min(1240px,100%); margin: 94px auto 0; border: 1px solid rgba(255,255,255,.13); border-radius: 24px; overflow: hidden; background: #100e15; box-shadow: 0 42px 110px rgba(0,0,0,.38); }
.repair-trace::after { content: ""; position: absolute; z-index: 8; inset: -1px; border-radius: inherit; background: rgba(76,52,112,.14); backdrop-filter: blur(13px) saturate(.82); opacity: 0; pointer-events: none; transition: opacity 1300ms cubic-bezier(.4,0,.2,1); will-change: opacity; }
.has-js .repair-trace:not(.is-focused)::after { opacity: 1; }
.diagnostic-stage { position: relative; display: flex; flex-direction: column; gap: 30px; padding: 68px 6.5% 56px; background: #100e15; }
.issue-card,.diagnosis-card { border-radius: 18px; }
.issue-card { position: relative; z-index: 1; width: 66%; align-self: flex-start; padding: 31px 34px 35px; border: 1px solid rgba(185,164,255,.2); border-radius: 28px 28px 28px 8px; color: #f9f6ff; background: #211a2c; box-shadow: 0 20px 54px rgba(0,0,0,.26); transform-origin: left bottom; transition: transform 1600ms cubic-bezier(.4,0,.2,1),opacity 1100ms ease; }
.message-author { display: flex; align-items: center; gap: 12px; }
.message-author>span { width: 33px; height: 33px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 10px; color: #efeaff; background: #30283f; font-size: 12px; font-weight: 720; }
.message-author p { display: grid; gap: 3px; margin: 0; }
.message-author strong { font-size: 13px; font-weight: 660; }
.message-author small { color: #817989; font-size: 10px; }
.issue-card blockquote { max-width: 660px; margin: 28px 0 0; color: #f9f7fc; font-size: clamp(28px,3.2vw,44px); font-weight: 560; line-height: 1.1; letter-spacing: -.048em; }
.diagnosis-card { position: relative; z-index: 2; width: 61%; min-height: 0; align-self: flex-end; margin: 0; padding: 29px 32px 31px; border-radius: 28px 28px 8px 28px; color: var(--light-ink); background: #f7f5fa; box-shadow: 0 24px 62px rgba(0,0,0,.32); transform-origin: right top; transition: transform 1680ms cubic-bezier(.4,0,.2,1),opacity 1180ms ease; }
.diagnosis-card .message-author>span { color: #fff; background: var(--violet-deep); }
.diagnosis-card .message-author small { color: #89828d; }
.diagnosis-body { opacity: 1; filter: none; }
.diagnosis-body>p:first-child { margin: 31px 0 0; color: #27232c; font-size: clamp(16px,1.5vw,21px); line-height: 1.48; letter-spacing: -.02em; }
.diagnosis-body code { color: #503890; background: #ece7f8; border-radius: 4px; padding: 2px 4px; }
.diagnosis-next { display: grid; gap: 6px; margin: 24px 0 0; padding-top: 18px; border-top: 1px solid rgba(29,23,36,.14); color: #28232e; font-size: 12px; line-height: 1.5; }
.diagnosis-next span { color: #776b86; font-size: 10px; }
.has-js .repair-trace:not(.is-focused) .issue-card { opacity: .78; transform: translate3d(-62px,16px,0) scale(.97) rotate(-.5deg); }
.has-js .repair-trace:not(.is-focused) .diagnosis-card { opacity: .78; transform: translate3d(62px,-11px,0) scale(.97) rotate(.5deg); }
.repair-trace.is-focused::after { opacity: 0; }
.repair-trace.is-focused .issue-card,.repair-trace.is-focused .diagnosis-card { opacity: 1; transform: none; }
.repair-trace.is-focused .diagnosis-card { box-shadow: 0 32px 74px rgba(0,0,0,.38); transition-delay: 160ms; }

[data-reveal] { opacity: 0; transform: translateY(18px); transition: opacity 620ms var(--ease),transform 620ms var(--ease); }
[data-reveal].is-visible { opacity: 1; transform: none; }
:focus-visible { outline: 3px solid var(--violet); outline-offset: 4px; }
@media (max-width:1080px) {
  .site-header nav { display: none; }
  .issue-card { width: 72%; }
  .diagnosis-card { width: 66%; }
}
@media (max-width:820px) {
  .wordmark small { display: none; }
  .hero { min-height: auto; padding-top: 132px; }
  .hero h1 { font-size: clamp(48px,12vw,72px); }
  .hero-actions { width: 100%; max-width: 420px; flex-direction: column; }
  .hero-actions .button { width: 100%; }
  .repair-trace { margin-top: 70px; }
  .diagnostic-stage { padding: 48px 24px 42px; }
  .issue-card { width: 88%; padding: 30px 28px 34px; }
  .issue-card blockquote { font-size: clamp(30px,6vw,44px); }
  .diagnosis-card { width: 82%; }
}
@media (max-width:560px) {
  .site-header { top: 10px; width: calc(100% - 20px); min-height: 54px; }
  .header-cta { min-height: 38px; padding-inline: 12px; }
  .hero { padding-inline: 16px; }
  .hero h1 { letter-spacing: -.06em; }
  .diagnostic-stage { padding: 36px 18px 34px; }
  .issue-card { width: 94%; padding: 26px 22px 30px; }
  .issue-card blockquote { margin-top: 26px; font-size: 31px; }
  .diagnosis-card { width: 94%; padding: 25px 22px; }
}
@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior: auto; }
  *,*::before,*::after { animation-duration: .01ms!important; animation-iteration-count: 1!important; transition-duration: .01ms!important; }
  [data-reveal] { opacity: 1; transform: none; }
}