:root { --bg:#181818; --text:#f0ece4; --muted:#c8c4bc; --muted2:#96918a; --line:rgba(255,255,255,.14); --blue:#4a9eff; --yellow:#ffd84a; --red:#ff4a4a; --page:max(24px,calc((100vw - 1120px) / 2)); --font:'Wix Madefor Display',ui-sans-serif,system-ui,sans-serif; }
* { box-sizing:border-box; }
html { background:var(--bg); scroll-behavior:smooth; }
body { margin:0; background:var(--bg); color:var(--text); font:400 16px/1.58 var(--font); }
button { font:inherit; }
button:focus-visible,a:focus-visible,summary:focus-visible { outline:2px solid var(--yellow); outline-offset:4px; }
#ls-particle-canvas { position:fixed; inset:0; z-index:0; width:100%; height:100%; opacity:.38; pointer-events:none; }
.page-shell { position:relative; z-index:1; width:min(100% - 40px,1120px); margin:0 auto; padding:124px 0 92px; }
.eyebrow { margin:0; color:var(--blue); font-size:11px; font-weight:750; letter-spacing:.17em; text-transform:uppercase; }
.eyebrow-yellow { color:var(--yellow); }.eyebrow-red { color:var(--red); }
h1,h2,h3,h4,p { margin-top:0; } h1,h2,h3 { letter-spacing:-.06em; line-height:.99; text-wrap:balance; }
h1 { max-width:850px; margin:15px 0 22px; font-size:clamp(43px,6vw,72px); font-weight:650; } h1 span { color:transparent; background:linear-gradient(90deg,var(--blue),var(--yellow),var(--red)); background-size:200% auto; -webkit-background-clip:text; background-clip:text; animation:brand-flow 8s ease infinite; }
h2 { margin:14px 0; font-size:clamp(30px,4.1vw,49px); font-weight:650; } h3 { margin:0 0 13px; font-size:clamp(28px,3.5vw,43px); font-weight:650; } h4 { margin:0 0 10px; font-size:12px; letter-spacing:.1em; text-transform:uppercase; }
.hero { max-width:960px; padding:32px 0 88px; }.lede { max-width:710px; margin:0; color:var(--muted); font-size:clamp(17px,2vw,20px); line-height:1.45; text-wrap:pretty; }
.trail-button,.secondary-button { display:inline-flex; align-items:center; justify-content:center; min-height:46px; border:1px solid var(--line); border-radius:999px; padding:11px 18px; color:var(--text); background:rgba(255,255,255,.03); font-size:12px; font-weight:750; letter-spacing:.07em; text-decoration:none; text-transform:uppercase; cursor:pointer; transition:transform .18s ease,background .18s ease; }.trail-button:hover,.secondary-button:hover { transform:translateY(-2px); background:rgba(255,255,255,.08); }.trail-button b { margin-left:10px; font-size:17px; line-height:1; }.hero-action { margin-top:30px; }
.hero-note { max-width:630px; margin-top:24px; padding:14px 0 0 18px; border-left:2px solid var(--blue); color:var(--muted2); font-size:14px; line-height:1.5; }.hero-note strong { color:var(--text); }
.entry { padding:44px 0 88px; border-top:1px solid var(--line); }.section-lede { max-width:650px; margin-bottom:27px; color:var(--muted); }
.entry-choices { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }.entry-choice { display:grid; gap:8px; min-height:138px; padding:21px 22px; border:1px solid var(--line); border-radius:14px; background:rgba(255,255,255,.025); color:var(--text); text-align:left; cursor:pointer; transition:background .18s ease,border-color .18s ease,transform .18s ease; }.entry-choice:hover { border-color:rgba(255,255,255,.36); background:rgba(255,255,255,.065); transform:translateY(-2px); }.entry-choice b { max-width:430px; font-size:20px; letter-spacing:-.035em; line-height:1.1; }.entry-choice span { color:var(--muted); font-size:14px; }
.guide { display:grid; grid-template-columns:minmax(250px,.55fr) minmax(0,1.45fr); gap:clamp(36px,7vw,106px); align-items:start; padding:32px 0 92px; border-top:1px solid var(--line); }.guide-nav { position:sticky; top:108px; }.guide-nav h2 { font-size:clamp(28px,3vw,38px); }.guide-nav ol { display:grid; gap:2px; margin:27px 0 0; padding:0; list-style:none; }.guide-nav a { display:block; padding:8px 0 8px 16px; border-left:1px solid var(--line); color:var(--muted2); font-size:14px; text-decoration:none; transition:color .18s ease,border-color .18s ease; }.guide-nav a:hover,.guide-nav a.is-active { border-left-color:var(--yellow); color:var(--text); }
.route { position:relative; padding-bottom:2px; }.route::before { content:''; position:absolute; top:15px; bottom:33px; left:13px; width:1px; background:linear-gradient(var(--blue),var(--yellow),var(--red),var(--blue)); }.route-stop { position:relative; display:grid; grid-template-columns:52px minmax(0,1fr); gap:24px; padding:0 0 72px; scroll-margin-top:112px; }.route-stop:last-child { padding-bottom:0; }.stop-marker { position:relative; z-index:1; display:grid; place-items:center; width:27px; height:27px; margin-top:3px; border-radius:50%; background:var(--bg); border:1px solid currentColor; color:var(--blue); }.stop-marker span { color:var(--text); font-size:9px; font-weight:750; }.is-yellow .stop-marker { color:var(--yellow); }.is-red .stop-marker { color:var(--red); }.stop-content { padding-bottom:2px; }.stop-label { margin-bottom:8px; color:var(--muted2); font-size:11px; font-weight:750; letter-spacing:.12em; text-transform:uppercase; }.mini-label { margin:0 0 6px; color:var(--blue); font-size:11px; font-weight:750; letter-spacing:.11em; text-transform:uppercase; }.is-yellow .mini-label { color:var(--yellow); }.is-red .mini-label { color:var(--red); }.framing { margin-bottom:22px; color:var(--muted); font-size:18px; line-height:1.52; }.reflection { margin:0 0 18px; padding:18px 20px; border-left:2px solid var(--blue); background:rgba(74,158,255,.06); }.is-yellow .reflection { border-left-color:var(--yellow); background:rgba(255,216,74,.055); }.is-red .reflection { border-left-color:var(--red); background:rgba(255,74,74,.055); }.reflection ul { margin:0; padding-left:20px; color:var(--text); }.reflection li+li { margin-top:8px; }.starting-point { margin:0; color:var(--muted2); font-size:15px; }.starting-point b { color:var(--text); }
.ai-support { display:grid; grid-template-columns:minmax(0,.9fr) minmax(300px,1.1fr); gap:clamp(30px,7vw,88px); align-items:start; padding:45px 0; border-top:1px solid var(--line); }.ai-support > div > p:not(.eyebrow) { max-width:500px; color:var(--muted); font-size:17px; }.prompt-panel { padding:24px; border:1px solid var(--line); border-radius:16px; background:rgba(255,255,255,.035); }.prompt-label { color:var(--yellow)!important; font-size:11px!important; font-weight:750; letter-spacing:.12em; text-transform:uppercase; }.prompt-panel > p:not(.prompt-label) { margin-bottom:20px; color:var(--muted)!important; font-size:14px!important; line-height:1.55; }.copy-status { margin-left:10px; color:var(--yellow); font-size:12px; }
.guide-context { max-width:780px; padding:68px 0 56px; }.guide-context p:not(.eyebrow) { max-width:730px; color:var(--muted); font-size:18px; }.guide-context p + p { margin-top:17px; }
.faq { max-width:850px; padding:35px 0 8px; border-top:1px solid var(--line); }.faq details { border-top:1px solid var(--line); }.faq details:last-child { border-bottom:1px solid var(--line); }.faq summary { position:relative; padding:18px 34px 18px 0; color:var(--text); font-weight:650; cursor:pointer; list-style:none; }.faq summary::-webkit-details-marker { display:none; }.faq summary::after { content:'+'; position:absolute; right:4px; color:var(--yellow); font-size:23px; line-height:1; }.faq details[open] summary::after { content:'−'; }.faq details p { max-width:700px; margin:0 0 19px; color:var(--muted); }
.noscript-nav { display:flex; gap:15px; padding:20px; background:#222; }.noscript-nav a { color:var(--text); }
@keyframes brand-flow { 0%,100% { background-position:0% 50%; } 50% { background-position:100% 50%; } }
@media (max-width:800px) { .page-shell { width:min(100% - 36px,680px); padding-top:98px; }.hero { padding-bottom:66px; }.entry { padding-bottom:66px; }.entry-choices { grid-template-columns:1fr; }.guide { grid-template-columns:1fr; gap:38px; padding-bottom:68px; }.guide-nav { position:static; }.guide-nav ol { grid-template-columns:repeat(2,minmax(0,1fr)); gap:4px 15px; }.guide-nav a { font-size:13px; }.route-stop { grid-template-columns:40px minmax(0,1fr); gap:16px; padding-bottom:56px; }.route::before { left:13px; }.framing { font-size:17px; }.ai-support { grid-template-columns:1fr; padding:40px 0; }.guide-context { padding:55px 0 42px; } }
@media (max-width:460px) { h1 { font-size:clamp(41px,12.5vw,57px); }.entry-choice { min-height:122px; }.guide-nav ol { grid-template-columns:1fr; }.route-stop { grid-template-columns:32px minmax(0,1fr); gap:14px; }.reflection { padding:16px; }.prompt-panel { padding:19px; } }
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { animation-duration:.01ms!important; animation-iteration-count:1!important; scroll-behavior:auto!important; transition-duration:.01ms!important; } #ls-particle-canvas { display:none; } }
