/* lab.css: pass 2-prototyper (lokal) */
body{padding:0}
.lab-top{display:flex;justify-content:space-between;padding:1.2rem 3vw;position:sticky;top:0;z-index:5;background:color-mix(in srgb,var(--paper) 88%,transparent);backdrop-filter:blur(6px)}
main section{padding:9vh 6vw}
.label{font-size:.8rem;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.lab-hero h1{font-size:clamp(3rem,8vw,8rem);margin:.2em 0;max-width:14ch}
.lede{max-width:60ch;font-size:1.15rem}
h2.serif{font-size:clamp(2.2rem,5vw,4.5rem);margin:.2em 0 .4em}
::selection{background:var(--orange);color:#000}   /* kontrastforslag A */
.on-orange{background:var(--orange);color:#000}
.on-orange .label{color:#000}
.on-orange ::selection{background:var(--ink);color:var(--paper)}
.dark{background:var(--ink);color:var(--paper)}
.dark .label{color:#A8A39A}
.dark ::selection{background:var(--orange);color:#000}
.kv-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px;margin-top:2rem}
.kv-tile{border:1px solid #D8D3C8;padding:1.2rem;min-height:220px;display:flex;flex-direction:column;gap:.4rem;transition:background var(--d-s) var(--ease-std)}
.kv-tile:hover{background:#ECE7DC}
.kv-tile img{margin-bottom:.6rem;image-rendering:auto}
.kv-tile b{font-family:"Instrument Serif";font-style:italic;font-weight:400;font-size:1.6rem;color:var(--orange-text,#A94319)}
.kv-tile span{font-size:.85rem}
.kv-tile code{font-size:.72rem;color:var(--muted);margin-top:auto}
.pilnett{display:grid;grid-template-columns:repeat(var(--cols,24),1fr);gap:0;margin:3rem -2vw 1rem;user-select:none;touch-action:none}
.pilnett svg{width:100%;height:auto;display:block}
.pilnett path{fill:#3A3733;transition:fill .25s var(--ease-std)}
.pilnett .on path{fill:var(--orange)}
.note{font-size:.85rem;color:#A8A39A}
.seal-row{display:flex;gap:4vw;flex-wrap:wrap;margin-top:3rem}
.seal-wrap{display:flex;flex-direction:column;align-items:center;gap:.8rem;width:min(300px,40vw)}
.seal-wrap span{font-size:.8rem;color:var(--muted)}
.seal{width:100%;height:auto;display:block}
.seal .ring{transform-box:view-box;transform-origin:0 0}
.seal .mid{transform-box:view-box;transform-origin:0 0;transition:transform .5s var(--ease-out)}
.seal-wrap:hover .mid,.seal-fab:hover .mid{transform:translateX(26px)}
.spacer{height:120vh;display:flex;align-items:center}
.big{font-size:clamp(2rem,4vw,3.5rem);max-width:18ch}
.seal-fab{position:fixed;right:28px;bottom:28px;width:118px;z-index:6;filter:drop-shadow(0 6px 18px rgba(0,0,0,.18))}
@media (max-width:700px){.seal-fab{width:84px;right:16px;bottom:16px}}
@media (prefers-reduced-motion:reduce){.seal .mid{transition:none}}