
@font-face{font-family:Basis;src:url('fonts/KHTekaMedium-Medium.woff2') format('woff2');font-weight:700;font-display:swap}
.brand-lockup{display:flex;align-items:center;gap:12px;flex-shrink:0;line-height:1}
.brand-crest{display:block;width:31px;height:31px;background:currentColor;mask:url('../daymark/crest.svg') center/contain no-repeat}
.brand-wordmark{display:block;width:156px;aspect-ratio:4567/866;background:currentColor;mask:url('wordmark-teka.svg') center/contain no-repeat}
.identity-link{display:inline-flex;align-items:baseline;gap:4px;font:700 18px/1.15 Basis,Arial,sans-serif;letter-spacing:-.045em;padding:8px 0;border:0;transition:color 450ms ease;text-decoration:none}
.identity-link .link-arrow{display:inline-block;transform:translate(0,0);transition:transform 650ms cubic-bezier(.2,.65,.3,1);font-family:Arial,sans-serif;font-weight:700}
.identity-link:hover,.identity-link:focus-visible{color:#858585}.identity-link:hover .link-arrow,.identity-link:focus-visible .link-arrow{transform:translate(3px,-3px)}
.studio .contact.identity-link{gap:4px;border:0}.studio .contact.identity-link:after{display:none}.studio .contact.identity-link span{width:auto;height:auto;display:inline-block;border:0;font-size:inherit;overflow:visible;background:none}.studio .contact.identity-link span:before,.studio .contact.identity-link span:after{display:none}
.device-name{white-space:nowrap}
@media(max-width:600px){.brand-crest{width:25px;height:25px}.brand-wordmark{width:131px}.brand-lockup{gap:9px}.identity-link{font-size:16px}}
@media(prefers-reduced-motion:reduce){.identity-link,.identity-link .link-arrow{transition:none}.identity-link:hover .link-arrow{transform:none}}

.identity-link .link-arrow svg{display:block;width:.86em;height:.86em}

/* Crest and wordmark share one coordinate system: matching 700-unit cap heights. */
.brand-combined{display:block;width:226px;aspect-ratio:5845/866;background:currentColor;mask:url('brand-lockup.svg') center/contain no-repeat}
.identity-link,.studio .contact.identity-link{background:transparent;color:var(--ink,#282828);padding:8px 0;gap:6px;align-items:baseline;transition:color 450ms ease}
.identity-link .link-arrow{position:static;top:auto;line-height:0}.identity-link .link-arrow svg{width:1em;height:1em}
.identity-link:hover,.identity-link:focus-visible,.studio .contact.identity-link:hover{background:transparent;color:#858585}
@media(max-width:600px){.brand-combined{width:183px}.identity-link,.studio .contact.identity-link{font-size:16px;padding:8px 0;gap:5px}}

/* Basis has a 700/1000 cap height. Arrow ink shares that height and baseline. */
.identity-link,.studio .contact.identity-link{gap:1em;padding:12px 0}
.identity-link .link-arrow,.studio .contact.identity-link .link-arrow{position:relative;top:auto;line-height:0;isolation:isolate;transform:none}
.identity-link .link-arrow svg{width:.7em;height:.7em;position:relative;transition:transform 650ms cubic-bezier(.2,.65,.3,1)}
.identity-link .link-arrow::before,.studio .contact.identity-link .link-arrow::before{content:'';display:block;position:absolute;inset:-.35em;background:#f0f0f0;z-index:-1;transition:background 450ms ease;transform:none}
.identity-link:hover .link-arrow,.identity-link:focus-visible .link-arrow{transform:none}
.identity-link:hover .link-arrow svg,.identity-link:focus-visible .link-arrow svg{transform:translate(2px,-2px)}
.identity-link:hover .link-arrow::before{background:#e8e7e8}
body.dark .identity-link .link-arrow::before{background:#3b3b3b}
@media(prefers-reduced-motion:reduce){.identity-link .link-arrow svg{transition:none}.identity-link:hover .link-arrow svg,.identity-link:focus-visible .link-arrow svg{transform:none}}

/* Include the arrow tile in the link bounds, rather than painting past the grid. */
.identity-link,.studio .contact.identity-link{padding-right:.35em}
