/* tex-ux.com shared styles */
:root{
  /* palette from the Figma file */
  --cream:#F6EDE0; --black:#141414; --red:#E8413C; --pink:#F2D3C9; --terracotta:#B4541F;
  --teal:#2A8A78; --olive:#A3B47C; --gold:#F6A925; --blue:#3A82C0;
  --heading:"Fraunces", Georgia, serif;
  --body:"DM Sans", "Helvetica Neue", Arial, sans-serif;
  --mono:"IBM Plex Mono", ui-monospace, Menlo, monospace;
}
*,*::before,*::after{box-sizing:border-box}
html,body{margin:0;height:100%}
body{background:var(--cream);color:var(--black);font-family:var(--body);transition:opacity .3s ease}
body.leaving{opacity:0}
a{color:inherit}
:focus-visible{outline:2px solid var(--teal);outline-offset:3px}
.visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* ---------- home ---------- */
.home main{height:100vh;height:100dvh;display:grid;place-items:center;overflow:hidden}
.home .stage{display:block;width:100%;height:100%}
.home .stage path{cursor:default}
.home .stage.at-rest .link{cursor:pointer}
.home .stage.at-rest .link:hover{filter:brightness(1.08)}
/* hidden until a keyboard user tabs into it */
.skip-nav{position:fixed;left:16px;top:16px;z-index:2}
.skip-nav ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.skip-nav a{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip-nav a:focus{position:static;width:auto;height:auto;clip:auto;display:inline-block;padding:8px 14px;border-radius:999px;background:var(--black);color:var(--cream);font:500 15px var(--body);text-decoration:none}

/* ---------- placeholder pages (replaced in later updates) ---------- */
.placeholder{min-height:100vh;display:grid;place-items:center;padding:24px 16px;text-align:center}
.placeholder .close{position:fixed;top:20px;right:24px;font-size:32px;line-height:1;text-decoration:none;font-weight:300}
.placeholder .eyebrow{font-family:var(--mono);font-size:13px;letter-spacing:.08em;text-transform:uppercase;margin:0 0 12px}
.placeholder h1{font-family:var(--heading);font-weight:600;font-size:clamp(40px,8vw,88px);line-height:1;margin:0 0 16px}
.placeholder p{margin:0;font-size:18px}
