/* Tenaja Labs — tenajalabs.com */
@font-face{font-family:"IBM Plex Mono";src:url("/assets/fonts/IBMPlexMono-Regular.ttf") format("truetype");font-weight:400;font-display:swap}
:root{--tl-basalt:#16181B;--tl-bone:#F2EEE6;--tl-fog:#8E9690;--f-mono:"IBM Plex Mono",ui-monospace,monospace}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;background:var(--tl-basalt)}
body{margin:0;background:var(--tl-basalt);color:var(--tl-bone);font:400 17px/1.5 system-ui,sans-serif;-webkit-font-smoothing:antialiased;min-height:100vh;min-height:100dvh;display:grid;grid-template-rows:1fr auto}
img{max-width:100%;display:block}
a{color:inherit}
:focus-visible{outline:3px solid currentColor;outline-offset:3px}
.stage{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:clamp(20px,7vh,72px);padding:clamp(16px,5vh,48px) 24px;text-align:center}
.mark{margin:0;line-height:0}
.mark img{width:clamp(150px,min(22vw,32vh),280px);height:auto}
.hello{font:400 15px/1 var(--f-mono);letter-spacing:.08em;color:var(--tl-fog);text-decoration:none;min-height:44px;display:inline-flex;align-items:center;padding:0 14px;transition:color .3s}
.hello:hover,.hello:focus-visible{color:var(--tl-bone);text-decoration:underline;text-underline-offset:6px}
.hello:focus-visible{outline:2px solid var(--tl-bone);outline-offset:4px}
@font-face{font-family:"IBM Plex Mono Descriptor";src:url("/assets/fonts/IBMPlexMono-Medium-descriptor.ttf") format("truetype");font-weight:500;font-display:swap}
/* descriptor: small tracked uppercase label, Plex Mono 500 per type spec, echoing "LABS" in the lockup */
.brand{display:flex;flex-direction:column;align-items:center;gap:clamp(16px,2.8vh,26px)}
.descriptor{margin:0;font:500 13px/1.5 "IBM Plex Mono Descriptor","IBM Plex Mono",ui-monospace,monospace;letter-spacing:.14em;text-transform:uppercase;color:var(--tl-fog);text-wrap:balance;padding-left:.14em}
@media (max-width:389px){.descriptor{font-size:12px;letter-spacing:.12em;padding-left:.12em}}
@media (max-width:360px){.descriptor{font-size:11px;letter-spacing:.1em;padding-left:.1em}}
.note{font:400 13px/1.4 var(--f-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--tl-fog);margin:0}
.horizon{height:34px;background:url("/assets/pattern/tenaja-labs_pattern-tile_basalt.svg") repeat-x left top;background-size:44px auto;pointer-events:none}
@media (prefers-reduced-motion:no-preference){
  .mark{animation:tl-rise 1.8s ease-out both}
  .descriptor{animation:tl-fade 1.2s ease-out .15s both}
  .hello{animation:tl-fade .9s ease-out .3s both}
}
@keyframes tl-rise{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@keyframes tl-fade{from{opacity:0}to{opacity:1}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
@media (max-height:420px){.horizon{display:none}}