/*
 * SOLYTEC Experience System 1.0
 * Geometry authority: one container, one 12/8/4-column logic.
 * Scope: new SOLYTEC v3 experience primitives + HOME.
 */
:root {
    --header-h: 76px;
    --sx-canvas: #f3f1eb;
    --sx-canvas-hi: #fbfaf6;
    --sx-ink: #0b1217;
    --sx-ink-2: #182128;
    --sx-muted: #69747b;
    --sx-dark: #070b0e;
    --sx-dark-2: #0b1115;
    --sx-inverse: #f3f6f3;
    --sx-inverse-muted: #9aa8ae;
    --sx-line: rgba(11, 18, 23, .16);
    --sx-line-strong: rgba(11, 18, 23, .28);
    --sx-line-dark: rgba(238, 245, 244, .14);
    --sx-cyan: #55d7de;
    --sx-spring: #b8ef6a;
    --sx-warm: #e5b875;
    --sx-max: 1296px;
    --sx-gutter: clamp(20px, 5vw, 72px);
    --sx-section: clamp(88px, 9vw, 144px);
    --sx-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
    --sx-sans: Manrope, "Avenir Next", Avenir, "Helvetica Neue", Helvetica, Arial, system-ui, sans-serif;
    --sx-ease: cubic-bezier(.2,.8,.2,1);
}

body { background: var(--sx-canvas); color: var(--sx-ink); }
.shell { width: min(var(--sx-max), calc(100% - (var(--sx-gutter) * 2))); }
.sx-grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: 24px; }

/* Header geometry is shared with the new 1296px authority. */
.site-header { height: 76px; background: rgba(7,11,14,.82); border-bottom-color: rgba(255,255,255,.09); }
.site-header.is-scrolled { background: rgba(7,11,14,.96); }
.header-inner { gap: 32px; }
.brand-name { letter-spacing: .19em; }
.desktop-nav { gap: clamp(20px, 2.4vw, 34px); }
.desktop-nav a { font-size: 12px; letter-spacing: .035em; }
.nav-cta { border-radius: 2px; padding: 10px 13px; }

/* Shared primitives */
.sx-kicker { margin: 0 0 20px; color: var(--sx-cyan); font: 750 11px/1.2 var(--sx-mono); letter-spacing: .14em; text-transform: uppercase; }
.sx-section { padding-block: var(--sx-section); background: var(--sx-canvas); }
.sx-section-head { display:flex; justify-content:space-between; gap:24px; padding-bottom:16px; margin-bottom:clamp(48px,6vw,80px); border-bottom:1px solid var(--sx-line); color:var(--sx-muted); font:700 10px/1.2 var(--sx-mono); letter-spacing:.13em; text-transform:uppercase; }
.sx-section-head p { margin:0; color:inherit; font:inherit; letter-spacing:inherit; }
.sx-section-head p span { margin-right:16px; color:var(--sx-ink); }
.sx-section-head-dark { border-color:var(--sx-line-dark); color:var(--sx-inverse-muted); }
.sx-section-head-dark p span { color:var(--sx-inverse); }
.sx-link { display:inline-flex; align-items:center; gap:10px; color:var(--sx-ink); font-size:13px; font-weight:780; text-decoration:none; }
.sx-link span { transition:transform .2s var(--sx-ease); }
.sx-link:hover span, .sx-link:focus-visible span { transform:translateX(4px); }
.sx-link-inverse { color:var(--sx-inverse); }
.sx-button { display:inline-flex; min-height:48px; align-items:center; justify-content:center; gap:10px; padding:11px 15px; border:1px solid transparent; border-radius:2px; font-size:13px; font-weight:800; text-decoration:none; transition:background-color .2s ease,color .2s ease,border-color .2s ease,transform .2s var(--sx-ease); }
.sx-button-primary { background:var(--sx-inverse); color:var(--sx-dark); }
.sx-button-primary:hover, .sx-button-primary:focus-visible { background:var(--sx-spring); transform:translateY(-2px); }
.sx-button:focus-visible,.sx-link:focus-visible,.sx-capability:focus-visible,.sx-project:focus-visible { outline:3px solid rgba(184,239,106,.48); outline-offset:4px; }

/* 00 — Identity / hero */
.sx-hero { position:relative; overflow:hidden; min-height:780px; padding:calc(var(--chrome-h) + clamp(64px,7vw,104px)) 0 clamp(72px,7vw,104px); background:var(--sx-dark); color:var(--sx-inverse); }
.sx-hero::after { content:""; position:absolute; inset:var(--chrome-h) 0 auto; height:1px; background:linear-gradient(90deg,transparent,rgba(255,255,255,.08) 15%,rgba(255,255,255,.08) 85%,transparent); }
.sx-hero-grid { position:absolute; inset:0; opacity:.34; pointer-events:none; background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px); background-size:72px 72px; mask-image:linear-gradient(to bottom,black 0%,black 68%,transparent 100%); }
.sx-hero-layout { position:relative; z-index:1; align-items:center; row-gap:64px; }
.sx-hero-copy { grid-column:1 / span 7; min-width:0; }
.sx-register-line { display:flex; justify-content:space-between; gap:16px; width:100%; padding-bottom:13px; margin-bottom:56px; border-bottom:1px solid var(--sx-line-dark); color:var(--sx-inverse-muted); font:700 9px/1.2 var(--sx-mono); letter-spacing:.13em; text-transform:uppercase; }
.sx-hero h1 { max-width:720px; margin:0 0 28px; color:var(--sx-inverse); font-size:clamp(46px,4.45vw,64px); line-height:1.015; letter-spacing:-.045em; font-weight:650; text-wrap:balance; }
.sx-hero h1 em { color:#a9b5ba; font-style:normal; font-weight:430; }
.sx-hero-lead { max-width:650px; margin:0 0 34px; color:#aeb9be; font-size:clamp(17px,1.45vw,20px); line-height:1.62; }
.sx-actions { display:flex; align-items:center; flex-wrap:wrap; gap:20px; }
.sx-state-line { display:flex; flex-wrap:wrap; gap:22px; margin-top:70px; color:#829096; font:700 9px/1.2 var(--sx-mono); letter-spacing:.12em; }
.sx-state-line span { color:#c8d2d5; }
.sx-state-line i { display:inline-block; width:6px; height:6px; margin-right:8px; border-radius:50%; background:var(--sx-spring); box-shadow:0 0 18px rgba(184,239,106,.42); }
.sx-state-line a { color:inherit; text-decoration:none; }
.sx-state-line a:hover { color:var(--sx-cyan); }

.sx-field { grid-column:8 / -1; position:relative; min-width:0; aspect-ratio:1; border:1px solid var(--sx-line-dark); background:linear-gradient(145deg,rgba(255,255,255,.018),rgba(255,255,255,.004)); overflow:hidden; isolation:isolate; }
.sx-field::before { content:""; position:absolute; inset:0; background:radial-gradient(circle at 68% 32%,rgba(85,215,222,.08),transparent 35%); pointer-events:none; }
.sx-field-head { position:absolute; z-index:4; top:0; left:0; right:0; display:flex; justify-content:space-between; gap:16px; padding:14px 16px; border-bottom:1px solid var(--sx-line-dark); color:#7f8d93; font:700 8px/1.2 var(--sx-mono); letter-spacing:.12em; }
.sx-field-graph { position:absolute; z-index:1; inset:48px 0 0; width:100%; height:calc(100% - 48px); }
.sx-field-gridlines path { fill:none; stroke:rgba(255,255,255,.035); stroke-width:1; vector-effect:non-scaling-stroke; }
.sx-field-planes path { fill:none; stroke:rgba(255,255,255,.085); stroke-width:1; vector-effect:non-scaling-stroke; }
.sx-signal-path { fill:none; stroke:url(#sxSignal); stroke-width:1.6; vector-effect:non-scaling-stroke; stroke-dasharray:2 8; animation:sx-dash 14s linear infinite; }
.sx-field-nodes circle { fill:var(--sx-dark); stroke:var(--sx-cyan); stroke-width:1.5; vector-effect:non-scaling-stroke; }
.sx-field-nodes .sx-node-live { stroke:var(--sx-spring); }
.sx-field-pulses circle { fill:var(--sx-cyan); }
.sx-field-pulses circle:last-child { fill:var(--sx-spring); }
@keyframes sx-dash { to { stroke-dashoffset:-100; } }
.sx-field-steps { position:absolute; z-index:3; inset:73px 14px auto; display:grid; grid-template-columns:repeat(5,1fr); gap:4px; margin:0; padding:0; list-style:none; }
.sx-field-steps li { min-width:0; padding-top:9px; border-top:1px solid rgba(255,255,255,.11); }
.sx-field-steps span { display:block; margin-bottom:3px; color:#617078; font:700 7px/1 var(--sx-mono); }
.sx-field-steps strong { display:block; overflow:hidden; color:#97a5aa; font:700 7px/1 var(--sx-mono); letter-spacing:.06em; text-overflow:ellipsis; }
.sx-field-core { position:absolute; z-index:4; left:50%; top:52%; width:112px; aspect-ratio:1; transform:translate(-50%,-50%); display:grid; place-items:center; align-content:center; border:1px solid rgba(85,215,222,.28); border-radius:50%; background:rgba(7,11,14,.86); box-shadow:0 0 0 28px rgba(85,215,222,.018),0 0 0 58px rgba(85,215,222,.012); }
.sx-field-core span,.sx-field-core small { color:#718087; font:700 7px/1 var(--sx-mono); letter-spacing:.12em; }
.sx-field-core strong { margin:5px 0; color:var(--sx-inverse); font-size:28px; line-height:1; }
.sx-field-readout { position:absolute; z-index:4; left:16px; right:16px; bottom:14px; display:flex; justify-content:space-between; color:#75848a; font:700 8px/1 var(--sx-mono); letter-spacing:.09em; }
.sx-field-readout b { color:var(--sx-spring); font-weight:700; }

/* 01 — capabilities */
.sx-statement { align-items:start; margin-bottom:clamp(56px,7vw,96px); }
.sx-statement h2 { grid-column:1 / span 7; max-width:760px; margin:0; color:var(--sx-ink); font-size:clamp(36px,3.8vw,52px); line-height:1.04; letter-spacing:-.045em; font-weight:630; }
.sx-statement h2 em { color:var(--sx-muted); font-style:normal; font-weight:430; }
.sx-statement>p { grid-column:9 / -1; max-width:410px; margin:7px 0 0; color:var(--sx-muted); font-size:16px; line-height:1.7; }
.sx-capability-rails { border-top:1px solid var(--sx-line); }
.sx-capability { position:relative; display:grid; grid-template-columns:64px minmax(230px,1fr) minmax(280px,.9fr) 110px 34px; align-items:center; gap:24px; min-height:154px; border-bottom:1px solid var(--sx-line); color:var(--sx-ink); text-decoration:none; transition:background-color .22s ease,padding .22s var(--sx-ease); }
.sx-capability:hover { padding-inline:14px; background:rgba(255,255,255,.36); }
.sx-capability .sx-index { align-self:start; padding-top:31px; color:var(--sx-muted); font:700 10px/1 var(--sx-mono); }
.sx-capability small { display:block; margin-bottom:7px; color:#2c6770; font:750 9px/1.2 var(--sx-mono); letter-spacing:.12em; }
.sx-capability h3 { margin:0; font-size:clamp(24px,2.4vw,34px); line-height:1.05; letter-spacing:-.04em; }
.sx-capability p { margin:0; color:var(--sx-muted); font-size:14px; line-height:1.62; }
.sx-capability i { display:block; height:1px; background:linear-gradient(90deg,var(--sx-line-strong),transparent); }
.sx-capability b { font-size:22px; font-weight:400; }
.sx-noetaris-signal { display:grid; grid-template-columns:1fr 1fr auto; align-items:end; gap:32px; padding:32px 0 0; margin-top:32px; }
.sx-noetaris-signal div { display:flex; flex-direction:column; gap:8px; }
.sx-noetaris-signal span { color:var(--sx-muted); font:700 8px/1 var(--sx-mono); letter-spacing:.12em; }
.sx-noetaris-signal strong { font-size:21px; letter-spacing:.12em; }
.sx-noetaris-signal p { margin:0; color:var(--sx-muted); font-size:13px; }

/* 02 — method */
.sx-method { background:var(--sx-dark); color:var(--sx-inverse); }
.sx-method-intro { align-items:start; margin-bottom:72px; }
.sx-method-intro h2 { grid-column:1 / span 7; max-width:760px; margin:0; color:var(--sx-inverse); font-size:clamp(38px,4vw,56px); line-height:1.02; letter-spacing:-.045em; }
.sx-method-intro>p { grid-column:9 / -1; margin:6px 0 0; color:var(--sx-inverse-muted); font-size:16px; line-height:1.7; }
.sx-process { display:grid; grid-template-columns:repeat(5,1fr); margin:0; padding:0; border-top:1px solid var(--sx-line-dark); border-bottom:1px solid var(--sx-line-dark); list-style:none; }
.sx-process li { position:relative; min-height:200px; padding:24px 20px; border-right:1px solid var(--sx-line-dark); display:flex; flex-direction:column; }
.sx-process li:first-child { border-left:1px solid var(--sx-line-dark); }
.sx-process span { color:#67767c; font:700 9px/1 var(--sx-mono); }
.sx-process strong { margin:auto 0 9px; font-size:12px; letter-spacing:.09em; }
.sx-process small { color:var(--sx-inverse-muted); font-size:11px; line-height:1.45; }
.sx-process li::after { content:""; position:absolute; left:20px; top:62px; width:24px; height:1px; background:var(--sx-cyan); box-shadow:0 0 14px rgba(85,215,222,.35); }
.sx-process li:last-child::after { background:var(--sx-spring); }

/* 03 — evidence */
.sx-evidence-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:32px; margin-bottom:54px; }
.sx-evidence-heading h2 { max-width:760px; margin:0; font-size:clamp(38px,4vw,56px); line-height:1.02; letter-spacing:-.045em; }
.sx-project-list { border-top:1px solid var(--sx-line); }
.sx-project { display:grid; grid-template-columns:180px minmax(300px,1fr) 310px 34px; align-items:center; gap:32px; min-height:196px; padding:28px 0; border-bottom:1px solid var(--sx-line); color:var(--sx-ink); text-decoration:none; }
.sx-project-dark { margin-inline:calc(var(--sx-gutter) * -.45); padding-inline:calc(var(--sx-gutter) * .45); background:var(--sx-dark-2); color:var(--sx-inverse); border-color:var(--sx-dark-2); }
.sx-project-meta { align-self:stretch; display:flex; flex-direction:column; justify-content:space-between; color:var(--sx-muted); font:700 9px/1.35 var(--sx-mono); letter-spacing:.08em; }
.sx-project-dark .sx-project-meta { color:var(--sx-inverse-muted); }
.sx-project h3 { margin:0 0 10px; font-size:clamp(29px,3vw,42px); line-height:1; letter-spacing:-.04em; }
.sx-project p { max-width:520px; margin:0; color:var(--sx-muted); font-size:14px; }
.sx-project-dark p { color:var(--sx-inverse-muted); }
.sx-project>b { font-size:22px; font-weight:400; }
.sx-project-signal { position:relative; min-height:112px; border:1px solid var(--sx-line); display:grid; place-items:center; overflow:hidden; }
.sx-project-dark .sx-project-signal { border-color:var(--sx-line-dark); }
.sx-project-signal i { position:absolute; inset:auto 10%; height:1px; background:var(--sx-line-strong); }
.sx-project-signal i:nth-child(1) { top:28%; transform:rotate(8deg); }
.sx-project-signal i:nth-child(2) { top:52%; transform:rotate(-5deg); }
.sx-project-signal i:nth-child(3) { top:72%; transform:rotate(3deg); }
.sx-project-signal strong { z-index:2; padding:8px 10px; background:var(--sx-canvas-hi); border:1px solid var(--sx-line); font:800 9px/1 var(--sx-mono); letter-spacing:.12em; }
.sx-project-dark .sx-project-signal strong { background:var(--sx-dark); border-color:var(--sx-line-dark); }
.sx-project-signal-linear { display:flex; justify-content:center; gap:10px; color:var(--sx-inverse-muted); font:700 8px/1 var(--sx-mono); }
.sx-project-signal-linear i { position:relative; inset:auto; width:34px; background:var(--sx-cyan); }
.sx-project-signal-stack { display:flex; align-items:center; justify-content:center; gap:0; }
.sx-project-signal-stack span { padding:8px 9px; margin-left:-1px; border:1px solid var(--sx-line); color:var(--sx-muted); font:700 8px/1 var(--sx-mono); }

/* 04 — entry */
.sx-entry { padding-block:clamp(84px,8vw,120px); background:var(--sx-dark); color:var(--sx-inverse); border-top:1px solid var(--sx-line-dark); }
.sx-entry .shell>div:first-child { grid-column:1 / span 7; }
.sx-entry h2 { max-width:760px; margin:0; color:var(--sx-inverse); font-size:clamp(44px,4.8vw,64px); line-height:1; letter-spacing:-.045em; }
.sx-entry-copy { grid-column:9 / -1; }
.sx-entry-copy p { margin:0 0 28px; color:var(--sx-inverse-muted); font-size:16px; line-height:1.7; }

/* Footer refinement */
.site-footer { background:#05080a; }
.footer-top,.footer-system,.footer-bottom { width:min(var(--sx-max),calc(100% - (var(--sx-gutter) * 2))); }

@media (max-width:1080px) {
    .sx-grid { grid-template-columns:repeat(8,minmax(0,1fr)); column-gap:20px; }
    .sx-hero { min-height:auto; }
    .sx-hero-copy { grid-column:1 / span 8; }
    .sx-field { grid-column:2 / span 6; width:100%; max-width:650px; justify-self:center; }
    .sx-statement h2,.sx-method-intro h2,.sx-entry .shell>div:first-child { grid-column:1 / span 5; }
    .sx-statement>p,.sx-method-intro>p,.sx-entry-copy { grid-column:6 / -1; }
    .sx-capability { grid-template-columns:52px 1fr 1fr 70px 30px; gap:18px; }
    .sx-noetaris-signal { grid-template-columns:1fr 1fr; }
    .sx-noetaris-signal .sx-link { grid-column:2; }
    .sx-project { grid-template-columns:140px 1fr 230px 28px; gap:22px; }
}

@media (max-width:820px) {
    :root { --header-h:72px; --sx-gutter:32px; --sx-section:96px; }
    .sx-grid { grid-template-columns:repeat(4,minmax(0,1fr)); column-gap:18px; }
    .site-header { height:72px; }
    .sx-hero { padding-top:calc(var(--chrome-h) + 54px); }
    .sx-hero-copy,.sx-field,.sx-statement h2,.sx-statement>p,.sx-method-intro h2,.sx-method-intro>p,.sx-entry .shell>div:first-child,.sx-entry-copy { grid-column:1 / -1; }
    .sx-register-line { margin-bottom:42px; }
    .sx-field { max-width:560px; margin-top:20px; }
    .sx-statement>p,.sx-method-intro>p,.sx-entry-copy { margin-top:30px; max-width:600px; }
    .sx-capability { grid-template-columns:42px 1fr 32px; gap:16px; padding:28px 0; }
    .sx-capability>p { grid-column:2 / 4; }
    .sx-capability>i { display:none; }
    .sx-capability>b { grid-column:3; grid-row:1; }
    .sx-process { grid-template-columns:1fr; }
    .sx-process li,.sx-process li:first-child { min-height:110px; border-left:1px solid var(--sx-line-dark); border-right:1px solid var(--sx-line-dark); border-bottom:1px solid var(--sx-line-dark); }
    .sx-process li:last-child { border-bottom:0; }
    .sx-process strong { margin:auto 0 5px; }
    .sx-process li::after { left:auto; right:20px; top:24px; }
    .sx-evidence-heading { align-items:flex-start; flex-direction:column; }
    .sx-project,.sx-project-dark { grid-template-columns:100px 1fr 30px; gap:18px; margin-inline:0; padding:26px 0; background:transparent; color:var(--sx-ink); border-color:var(--sx-line); }
    .sx-project-dark .sx-project-meta { color:var(--sx-muted); }
    .sx-project-dark p { color:var(--sx-muted); }
    .sx-project-signal { grid-column:2 / 4; min-height:100px; }
    .sx-project>b { grid-column:3; grid-row:1; }
    .sx-noetaris-signal { grid-template-columns:1fr; }
    .sx-noetaris-signal .sx-link { grid-column:1; }
}

@media (max-width:520px) {
    :root { --sx-gutter:20px; --sx-section:76px; }
    .sx-hero { padding-top:calc(var(--chrome-h) + 40px); padding-bottom:72px; }
    .sx-register-line span:last-child { display:none; }
    .sx-hero h1 { font-size:clamp(38px,10.5vw,48px); }
    .sx-hero-lead { font-size:16px; }
    .sx-actions { align-items:flex-start; flex-direction:column; }
    .sx-state-line { margin-top:48px; flex-direction:column; gap:9px; }
    .sx-field { aspect-ratio: .93; }
    .sx-field-steps { grid-template-columns:repeat(3,1fr); row-gap:7px; }
    .sx-field-steps li:nth-child(4),.sx-field-steps li:nth-child(5) { display:none; }
    .sx-field-core { width:90px; }
    .sx-section-head { align-items:flex-start; flex-direction:column; gap:7px; margin-bottom:42px; }
    .sx-statement h2,.sx-method-intro h2,.sx-evidence-heading h2 { font-size:34px; }
    .sx-capability { grid-template-columns:34px 1fr 28px; }
    .sx-capability h3 { font-size:25px; }
    .sx-capability>p { font-size:13px; }
    .sx-noetaris-signal { gap:18px; }
    .sx-project,.sx-project-dark { grid-template-columns:1fr 28px; }
    .sx-project-meta { grid-column:1 / -1; min-height:0; flex-direction:row; gap:16px; }
    .sx-project>div:nth-child(2) { grid-column:1; }
    .sx-project>b { grid-column:2; grid-row:2; }
    .sx-project-signal { grid-column:1 / -1; }
    .sx-entry h2 { font-size:42px; }
}

@media (prefers-reduced-motion: reduce) {
    .sx-signal-path { animation:none; }
}
