
.project-hero{padding:28px 0 35px;border-bottom:1px solid var(--line)}.project-hero h1{font:700 clamp(46px,9vw,86px)/1.12 Plex;letter-spacing:-.04em;text-align:right;overflow-wrap:anywhere}.project-hero .lead{font-size:clamp(17px,2.5vw,22px);line-height:1.9;max-width:58ch;margin-top:18px}.project-hero .actions{margin-top:24px;align-items:center}.project-sections{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:24px}.project-sections .panel:first-child{grid-column:1/-1}.project-sections h2{font-size:22px}.project-sections p{font-size:16px;line-height:1.9;color:#504639}.feature-list{display:grid;gap:14px;list-style:none}.feature-list li{padding:14px 0;border-top:1px solid var(--line);font-size:15px;line-height:1.9}.feature-list b{display:block;color:var(--ink);font-size:16px;margin-bottom:2px}.project-label{display:flex;gap:8px;flex-wrap:wrap;margin-top:20px}.project-hero .eyebrow{margin-bottom:22px}.project-note{font-size:13px!important;color:var(--muted)!important}.other-projects{display:flex;gap:10px;flex-wrap:wrap;margin-top:24px}.other-projects a{min-height:44px;display:flex;align-items:center;text-decoration:none;padding:8px 16px;border:1px solid var(--line);border-radius:10px;font-size:14px;font-weight:600;background:var(--card);transition:transform 150ms var(--ease-out),border-color 150ms var(--ease-out)}.other-projects a:active{transform:scale(.97)}.project-detail{margin-bottom:24px}
.os-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:24px}.metric-card{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:18px;display:flex;flex-direction:column;gap:4px;transition:transform 200ms var(--ease-out),box-shadow 200ms var(--ease-out)}.metric-card b{font:700 clamp(26px,3.5vw,36px)/1.1 Plex;color:var(--accent-ink);letter-spacing:-.03em}.metric-card span{font-size:13px;color:var(--muted);line-height:1.5}
.os-preview-panel{margin-top:20px}.os-preview-tabs{display:flex;flex-wrap:wrap;gap:6px}.os-tab{min-height:40px;padding:6px 14px;border-radius:10px;border:1px solid var(--line);background:var(--surface);font-size:13px;font-weight:600;cursor:pointer;transition:background 150ms var(--ease-out),color 150ms var(--ease-out),transform 140ms var(--ease-out)}.os-tab:active{transform:scale(.97)}.os-tab.is-active{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.os-mock-window{border-radius:16px;overflow:hidden;border:1px solid rgba(23,18,14,.18);background:#141615;color:#ece6da;box-shadow:0 20px 44px -22px rgba(23,18,14,.45)}.os-mock-titlebar{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:11px 16px;background:#1d201f;border-bottom:1px solid rgba(255,255,255,.08);font:600 12px Plex,monospace}.os-mock-dots{display:flex;gap:6px}.os-mock-dots i{width:10px;height:10px;border-radius:50%;background:rgba(255,255,255,.22)}.os-mock-dots i:first-child{background:#ff5f56}.os-mock-dots i:nth-child(2){background:#ffbd2e}.os-mock-dots i:nth-child(3){background:#27c93f}.os-mock-title{color:#c9c2b8;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.os-mock-shortcut{padding:3px 8px;border-radius:6px;background:rgba(255,255,255,.08);color:#ff916d;font-size:11px}
.os-mock-body{padding:clamp(18px,3vw,28px)}.os-pane{animation:osPaneIn 220ms var(--ease-out)}@keyframes osPaneIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}.os-pane-grid{display:grid;grid-template-columns:1.3fr .9fr;gap:20px;align-items:center}.os-pane h3{font-size:19px;color:#fff;margin-bottom:10px}.os-pane p{font-size:14.5px;line-height:1.85;color:#d6ccbe}.os-chip-list{margin-top:14px;display:grid;gap:8px}.os-chip-list li{font-size:13.5px;line-height:1.7;color:#ece6da;padding-inline-start:14px;position:relative}.os-chip-list li::before{content:"";position:absolute;inset-inline-start:0;top:10px;width:6px;height:6px;border-radius:50%;background:var(--accent)}.os-chip-list code{font-family:Plex,monospace;font-size:12px;background:rgba(255,255,255,.1);padding:2px 6px;border-radius:5px;color:#ff916d}.os-mini-specs{display:grid;gap:8px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1);border-radius:12px;padding:14px}.os-mini-specs code{font:400 12.5px/1.6 Plex,monospace;color:#7de2b8;overflow-wrap:anywhere}
@media(hover:hover) and (pointer:fine){.metric-card:hover{transform:translateY(-2px);box-shadow:0 14px 28px -18px rgba(23,18,14,.35)}.other-projects a:hover{border-color:var(--accent2);transform:translateY(-1px)}.os-tab:hover:not(.is-active){border-color:var(--accent-ink)}}
@media(max-width:760px){.os-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.os-pane-grid{grid-template-columns:1fr}.project-sections{grid-template-columns:1fr}.project-hero{padding-top:18px}.project-hero h1{font-size:clamp(42px,11vw,70px)}}
@media(max-width:420px){.os-preview-tabs{width:100%}.os-tab{flex:1 1 calc(50% - 6px);text-align:center;padding:8px 10px;font-size:12px}.os-mock-shortcut{display:none}}
@media(prefers-reduced-motion:reduce){.os-pane{animation:none!important}.metric-card,.other-projects a,.os-tab{transition:none!important;transform:none!important}}
