.project-page{min-height:100svh;padding:var(--gap-32);background:var(--bg)}.project-page.project-page{padding-top:var(--site-header-offset);padding-bottom:var(--gap-96)}.project-page>.project-viewer{height:calc(100dvh - var(--site-header-offset) - var(--gap-96))}.project-viewer{width:100%;max-width:1600px;height:calc(100dvh - 64px);min-height:0;color:var(--text);background:var(--bg);border:1px solid var(--border);border-radius:var(--radius-20);flex-direction:column;margin:auto;padding:0;display:flex;overflow:hidden}.project-viewer-modal{width:calc(100% - 64px);max-height:none;box-shadow:0 24px 64px #0006}.project-viewer-modal:not([open]){display:none}.project-viewer-modal::backdrop{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#020a13e8}.project-viewer-header{align-items:center;gap:var(--gap-24);padding:var(--gap-12) var(--gap-24);background:var(--surface);border-bottom:1px solid var(--border);flex:none;grid-template-columns:1fr auto 1fr;display:grid}.project-viewer-name{min-width:0}.project-viewer-name h1{font-size:var(--text-20);letter-spacing:-.02em;margin:0;font-weight:600;line-height:1.4}.project-devices{gap:var(--gap-4);display:flex}.project-devices button{justify-content:center;align-items:center;gap:var(--gap-8);padding:var(--gap-12);border-radius:var(--radius-8);font-size:var(--text-14);color:var(--muted);transition:background var(--fast),color var(--fast);background:0 0;line-height:20px;display:flex}.project-devices button[aria-pressed=true]{color:var(--text);box-shadow:inset 0 -2px var(--blue);background:#0a84ff24}.project-devices button:hover{color:var(--text);background:#0a84ff18}.project-devices svg,.project-viewer-actions svg{stroke:currentColor;stroke-width:1.5px;stroke-linecap:round;stroke-linejoin:round;flex:none;width:20px;height:20px}.project-viewer-actions{justify-content:flex-end;gap:var(--gap-16);align-items:center;display:flex}.project-viewer-actions>a:not(.project-viewer-close){align-items:center;gap:var(--gap-8);min-height:44px;font-size:var(--text-14);color:var(--muted);white-space:nowrap;display:flex}.project-viewer-actions>a:hover{color:var(--text)}.project-viewer-close{border-radius:var(--radius-8);width:40px;height:40px;color:var(--muted);transition:background var(--fast);background:0 0;flex:none;place-items:center;display:grid}.project-viewer-close:hover{background:var(--surface-raised);color:var(--text)}.project-demo-stage{min-height:0;margin:var(--gap-16) var(--gap-24) 0;flex:1;justify-content:center;align-items:center;display:flex;position:relative;overflow:hidden}.project-device-shell{background:var(--surface);border-radius:var(--radius-8);flex:none;transition:opacity .2s;position:relative;overflow:hidden}.project-device-shell iframe{transform-origin:0 0;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;background:#fff;border:0;display:block;position:absolute;inset:0}.project-demo-loading{justify-content:center;align-items:center;gap:var(--gap-16);font-size:var(--text-16);color:var(--muted);text-align:center;padding:var(--gap-24);flex-direction:column;display:flex;position:absolute;inset:0}.project-demo-loading i{border:2px solid var(--border);border-top-color:var(--blue);border-radius:50%;width:24px;height:24px;animation:.8s linear infinite demo-spin}.project-demo-loading button{border-radius:var(--radius-8);padding:var(--gap-12) var(--gap-24);background:var(--blue)}@keyframes demo-spin{to{transform:rotate(360deg)}}.project-viewer-footer{justify-content:space-between;align-items:center;gap:var(--gap-16);padding:var(--gap-8) var(--gap-24);flex:none;display:flex;position:relative}.project-info-toggle{align-items:center;gap:var(--gap-12);padding:var(--gap-12) 0;color:var(--muted);font-size:var(--text-14);background:0 0;min-height:44px;display:flex}.project-info-toggle:hover,.project-info-toggle[aria-expanded=true]{color:var(--text)}.project-info-toggle span{font-size:var(--text-20);color:var(--blue)}.project-inquiry{gap:var(--gap-16);min-height:44px;color:var(--lightningcss-light,var(--blue))var(--lightningcss-dark,#5db7ff);font-size:var(--text-14);transition:color var(--fast);justify-content:center;align-items:center;display:flex}.project-inquiry:hover{color:var(--text)}.project-details{bottom:100%;left:var(--gap-24);z-index:2;width:min(440px,100% - 48px);max-height:calc(100dvh - 200px);padding:var(--gap-24);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-16);position:absolute;overflow:auto;box-shadow:0 16px 48px #0006}.project-details-type{color:var(--lightningcss-light,var(--blue))var(--lightningcss-dark,#5db7ff);font-size:var(--text-12)}.project-details h2{font-size:var(--text-20);margin:var(--gap-8) 0 var(--gap-16);line-height:1.4}.project-details p,.project-details li{font-size:var(--text-14);color:var(--muted);line-height:1.6}.project-details p{margin:0}.project-details ul{padding-left:var(--gap-16);margin:var(--gap-16) 0}.project-details li::marker{color:var(--blue)}.project-details small{border-top:1px solid var(--border);padding-top:var(--gap-16);color:var(--muted);font-size:var(--text-12);line-height:1.5;display:block}.project-viewer :focus-visible{outline-offset:3px;outline:2px solid #5db7ff}@media (max-width:1100px){.project-external-label{display:none}.project-viewer-header{gap:var(--gap-16)}}@media (max-width:700px){.project-page{padding:0}.project-viewer,.project-viewer-modal{border:0;border-radius:0;width:100%;height:100dvh}.project-viewer-header{gap:var(--gap-8);padding:var(--gap-12) var(--gap-16);grid-template-columns:1fr auto}.project-viewer-name h1{font-size:var(--text-18)}.project-devices{grid-area:2/1/auto/-1;justify-content:center}.project-viewer-actions{grid-area:1/2}.project-demo-stage{margin:var(--gap-8) var(--gap-8) 0}.project-viewer-footer{padding-inline:var(--gap-16)}.project-details{left:var(--gap-16);width:calc(100% - 32px)}}@media (prefers-reduced-motion:reduce){.project-viewer *{transition:none!important;animation:none!important}}.project-viewer{min-height:30rem}.project-viewer-name h1{overflow-wrap:anywhere}.project-viewer-close,.project-viewer-actions>a:not(.project-viewer-close){justify-content:center;min-width:3rem;min-height:3rem}.project-devices{flex-wrap:wrap}.project-devices button{min-height:3rem}.project-viewer-footer{flex-wrap:wrap}.project-info-toggle,.project-inquiry{min-height:3rem}@media (max-width:43.75em){.project-viewer-header{padding-top:max(.75rem,env(safe-area-inset-top))}.project-viewer-footer{padding-bottom:max(.5rem,env(safe-area-inset-bottom))}.project-viewer-actions{gap:.25rem}.project-devices{justify-content:flex-start}.project-devices button{padding:.75rem .5rem}.project-viewer-footer{gap:0 .75rem}.project-viewer,.project-viewer-modal{overflow-y:auto}}
