:root{
  --bg:#f1f1ec;
  --ink:#11110f;
  --muted:#6f6f68;
  --line:#c9c9c1;
  --panel:#e8e8e1;
  --accent:#ff5a1f;
  --max:1440px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;overflow-x:hidden}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
button{font:inherit}
.shell{width:min(calc(100% - 48px),var(--max));margin:0 auto}
.mono{font-family:"SFMono-Regular",Consolas,"Liberation Mono",monospace;letter-spacing:.06em;text-transform:uppercase}
.noise{position:fixed;inset:0;pointer-events:none;opacity:.06;z-index:99;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='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.8'/%3E%3C/svg%3E")}
.site-header{height:82px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);position:relative;z-index:10}
.brand{display:flex;align-items:center;gap:12px;font-size:13px;font-weight:800;letter-spacing:.08em}
.brand img{width:30px;height:30px;object-fit:contain;filter:grayscale(1) contrast(1.5)}
nav{display:flex;gap:34px;font-size:13px}
nav a{position:relative}
nav a:after{content:"";position:absolute;left:0;right:100%;bottom:-5px;height:1px;background:var(--ink);transition:.25s}
nav a:hover:after{right:0}
.hero{padding:26px 0 78px}
.hero-meta{display:flex;justify-content:space-between;color:var(--muted);font-size:10px;padding-bottom:34px}
.hero h1{font-size:clamp(72px,11.5vw,178px);line-height:.82;letter-spacing:-.075em;font-weight:600;margin:0;padding:28px 0 54px;border-top:1px solid var(--line)}
.hero h1 span{display:block}
.hero h1 span:last-child{text-align:right}
.hero-bottom{display:grid;grid-template-columns:1.3fr .7fr;gap:40px;align-items:end;margin-bottom:54px}
.hero-copy{max-width:680px;font-size:22px;line-height:1.45;margin:0;letter-spacing:-.02em}
.hero-copy strong{font-weight:700}
.text-link{justify-self:end;font-family:monospace;font-size:13px;border-bottom:1px solid var(--ink);padding:0 0 7px;display:flex;gap:32px}
.technical-frame{border:1px solid var(--ink);position:relative;background:#dcdcd5;padding:26px 12px 12px}
.frame-label{position:absolute;top:8px;left:12px;font-size:9px;color:var(--muted)}
.hero-visual{background:#151513;padding:38px 24px 24px;overflow:hidden}
.hero-visual img{width:100%;border:1px solid #343430;filter:saturate(.55) contrast(1.02)}
.corner{position:absolute;width:10px;height:10px;border-color:var(--accent)}
.c1{top:-1px;left:-1px;border-top:2px solid var(--accent);border-left:2px solid var(--accent)}
.c2{top:-1px;right:-1px;border-top:2px solid var(--accent);border-right:2px solid var(--accent)}
.c3{bottom:-1px;left:-1px;border-bottom:2px solid var(--accent);border-left:2px solid var(--accent)}
.c4{bottom:-1px;right:-1px;border-bottom:2px solid var(--accent);border-right:2px solid var(--accent)}
.grid-section{display:grid;grid-template-columns:260px 1fr;border-top:1px solid var(--line);padding:92px 0 108px}
.section-index{font-size:10px;color:var(--muted);padding-top:10px}
.statement-body,.workflow-body,.local-body{max-width:1080px}
.eyebrow{font-size:10px;color:var(--muted);margin:0 0 22px}
h2{font-size:clamp(52px,6.8vw,104px);line-height:.94;letter-spacing:-.055em;font-weight:520;margin:0}
h2 em{font-style:normal;color:var(--muted)}
.lead{font-size:20px;line-height:1.55;max-width:790px;margin:42px 0 0;color:#33332f;letter-spacing:-.015em}
.principles{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line);border-left:1px solid var(--line);margin-bottom:116px}
.principles article{min-height:360px;padding:22px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);display:flex;flex-direction:column}
.num{font-size:10px;color:var(--muted)}
.principles h3{font-size:34px;line-height:1.02;letter-spacing:-.04em;font-weight:560;margin:auto 0 22px}
.principles p{font-size:14px;line-height:1.6;color:var(--muted);margin:0;max-width:240px}
.workflow{background:var(--ink);color:var(--bg);width:100%;max-width:none;padding-left:max(24px,calc((100vw - var(--max))/2));padding-right:max(24px,calc((100vw - var(--max))/2));border-color:#383833}
.workflow .section-index,.workflow .eyebrow{color:#82827b}
.workflow .lead{color:#bdbdb5}
.workflow-body{max-width:none}
.workflow-copy{display:grid;grid-template-columns:1fr 1fr;column-gap:64px}
.workflow-copy .eyebrow{grid-column:1/-1}
.workflow-copy .lead{margin:8px 0 0}
.pipeline{margin-top:74px;background:#161613;border-color:#4e4e47;padding:50px 24px 20px}
.pipeline-row{display:grid;grid-template-columns:1fr auto 1fr auto 1fr auto 1fr auto 1fr;align-items:center;gap:12px;min-height:240px}
.node{border:1px solid #55554f;background:#1d1d19;padding:18px;min-height:108px;display:flex;flex-direction:column;justify-content:flex-end;position:relative}
.node-dot{position:absolute;right:12px;top:12px;width:7px;height:7px;border-radius:50%;background:#77776f}
.node.active{border-color:var(--accent)}
.node.active .node-dot{background:var(--accent);box-shadow:0 0 0 4px rgba(255,90,31,.12)}
.node small{font-family:monospace;color:#83837c;font-size:9px;margin-bottom:8px}
.node strong{font-size:16px;font-weight:500}
.connector{color:#6f6f68;font-family:monospace}
.status-line{border-top:1px solid #383833;padding-top:16px;display:flex;justify-content:space-between;font-size:9px;color:#77776f}
.running{color:var(--accent)}
.proof{display:grid;grid-template-columns:.72fr 1.28fr;gap:64px;padding:116px 0;border-bottom:1px solid var(--line)}
.proof h2{font-size:clamp(48px,5vw,78px);margin:30px 0}
.proof-copy p{font-size:16px;line-height:1.7;color:var(--muted);max-width:470px}
.proof-image{align-self:center}
.proof-image img{width:100%;border:1px solid #b5b5ae}
.local-grid{display:grid;grid-template-columns:1fr 1fr;gap:70px;margin-top:54px}
.local-grid>p{font-size:19px;line-height:1.6;margin:0;color:#3c3c37}
.spec{border-top:1px solid var(--ink)}
.spec div{display:flex;justify-content:space-between;padding:14px 0;border-bottom:1px solid var(--line);font-size:10px}
.spec b{font-weight:600;color:var(--accent)}
.install{padding:90px 0 110px;border-top:1px solid var(--ink)}
.install-top{display:flex;justify-content:space-between;font-size:10px;color:var(--muted);margin-bottom:70px}
.install h2{font-size:clamp(68px,10vw,154px);line-height:.86}
.install>p{font-size:20px;margin:36px 0 44px;color:var(--muted)}
.terminal{border:1px solid var(--ink);background:#121210;color:#ecece6}
.terminal-head{display:flex;justify-content:space-between;padding:12px 16px;border-bottom:1px solid #343430;font-size:9px;color:#878780}
.command-row{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:25px 18px}
.command-row code{font-size:14px;white-space:nowrap;overflow:auto;color:#ecece6}
.copy-btn{border:1px solid #5c5c55;background:transparent;color:#fff;padding:9px 15px;cursor:pointer;font-family:monospace;font-size:10px;transition:.2s}
.copy-btn:hover,.copy-btn.copied{background:var(--accent);border-color:var(--accent);color:#111}
.install-actions{display:flex;gap:10px;margin-top:20px}
.primary,.secondary{padding:14px 19px;border:1px solid var(--ink);font-size:13px}
.primary{background:var(--ink);color:var(--bg)}
.secondary:hover{background:#dddcd5}
.site-footer{border-top:1px solid var(--ink);padding:64px 0 38px}
.footer-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:40px}
.footer-heading strong{font-size:38px;letter-spacing:-.045em;font-weight:600}
.footer-heading p{margin:12px 0 0;color:var(--muted);font-size:15px}
.footer-language{display:flex;align-items:center;gap:12px;font-family:"SFMono-Regular",Consolas,monospace;font-size:10px;text-transform:uppercase;letter-spacing:.06em}
.footer-language label{color:var(--muted)}
.footer-language select{appearance:none;border:1px solid var(--ink);border-radius:0;background:transparent;color:var(--ink);padding:10px 38px 10px 12px;font:inherit;cursor:pointer;background-image:linear-gradient(45deg,transparent 50%,var(--ink) 50%),linear-gradient(135deg,var(--ink) 50%,transparent 50%);background-position:calc(100% - 15px) 50%,calc(100% - 10px) 50%;background-size:5px 5px,5px 5px;background-repeat:no-repeat}
.footer-socials{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line);border-left:1px solid var(--line);margin-top:48px}
.footer-socials a{min-height:94px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);display:flex;align-items:center;gap:13px;padding:18px 20px;transition:background .2s,color .2s}
.footer-socials img{width:24px;height:24px;object-fit:contain;filter:grayscale(1) contrast(1.4)}
.footer-socials .patreon-icon{filter:grayscale(1) contrast(2)}
.footer-socials span{font-size:17px;font-weight:560}
.footer-socials b{margin-left:auto;font:400 13px/1 monospace}
.footer-socials a:hover{background:var(--ink);color:var(--bg)}
.footer-socials a:hover img{filter:grayscale(1) invert(1) contrast(1.5)}
.footer-bottom{padding-top:24px;display:flex;justify-content:space-between;font-size:9px;color:var(--muted)}
.reveal{opacity:0;transform:translateY(24px);transition:opacity .65s ease,transform .65s ease}.reveal.in{opacity:1;transform:none}
@media(max-width:900px){
  .shell{width:min(calc(100% - 28px),var(--max))}
  nav a:not(:last-child){display:none}
  .hero{padding-top:18px}
  .hero-meta span:last-child{display:none}
  .hero h1{font-size:clamp(62px,20vw,120px);padding:32px 0 42px}
  .hero h1 span:last-child{text-align:left}
  .hero-bottom,.grid-section,.proof,.workflow-copy,.local-grid{grid-template-columns:1fr}
  .text-link{justify-self:start;margin-top:16px}
  .grid-section{gap:40px;padding:70px 0 80px}
  .principles{grid-template-columns:1fr 1fr}
  .principles article{min-height:290px}
  .workflow{padding-left:14px;padding-right:14px}
  .workflow-body,.workflow-copy,.pipeline{min-width:0;max-width:100%}
  .pipeline{overflow-x:auto}
  .pipeline-row{min-width:920px}
  .proof{gap:42px;padding:80px 0}
  .command-row{align-items:stretch;flex-direction:column}
  .copy-btn{align-self:flex-start}
}
@media(max-width:560px){
  .site-header{height:68px}
  .brand span{font-size:11px}
  nav{gap:0}
  .hero h1{font-size:20vw;letter-spacing:-.07em}
  .hero-copy{font-size:18px}
  .hero-visual{padding:30px 8px 8px}
  h2{font-size:15vw}
  .principles{grid-template-columns:1fr}
  .principles article{min-height:245px}
  .workflow{padding-top:70px;padding-bottom:80px}
  .status-line{gap:14px;overflow:auto;justify-content:flex-start}
  .proof h2{font-size:14vw}
  .install h2{font-size:19vw}
  .install-actions{flex-direction:column}
  .footer-heading{flex-direction:column}
  .footer-socials{grid-template-columns:1fr 1fr}
  .footer-bottom{gap:16px;flex-direction:column}
}
