@font-face{font-family:"Source Serif 4";font-style:normal;font-weight:200 900;font-display:swap;src:url("fonts/source-serif-4.woff2") format("woff2")}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:500;font-display:swap;src:url("fonts/ibm-plex-mono-500.woff2") format("woff2")}

:root{
  --bg:#FFFFFF; --plate:#FFFFFF; --text:#1F1F1D; --muted:#6E6A64; --link:#8A5A1E; --ink:#2B1F14;
  --serif:"Source Serif 4","Source Serif Pro",Georgia,"Times New Roman",serif;
  --mono:"IBM Plex Mono",ui-monospace,Menlo,Consolas,monospace;
}
*{box-sizing:border-box}
html{background:var(--bg);color:var(--text);font-family:var(--serif);font-optical-sizing:auto;-webkit-text-size-adjust:100%}
body{margin:0;min-height:100vh;display:flex;flex-direction:column;
  padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
svg .plate{fill:var(--plate)}
p{margin:0}
h1{margin:0;font-weight:500;line-height:1.1}
h1 .tag{display:block;font-size:.6875rem;font-weight:500;letter-spacing:.2em;text-transform:uppercase;color:var(--link);margin-top:.5rem;line-height:1.2}
.mark{margin:0;color:var(--ink)}
.mark svg{display:block;width:100%;height:auto}
.text{display:flex;flex-direction:column;gap:1em;font-size:1.25rem;line-height:1.5;text-wrap:pretty;width:30rem;max-width:100%}
footer{margin-top:auto;padding-block:1.25rem;font-family:var(--mono);font-size:.6875rem;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
@media (max-width:480px){.text{font-size:1.0625rem;text-wrap:pretty}}

main{width:100%;max-width:74rem;margin:0 auto;flex:1;display:flex;align-items:center;justify-content:center;gap:clamp(2rem,6vw,5rem);padding-block:3rem 2rem}
.lockup{flex:0 0 min(44%,25rem);display:flex;flex-direction:column;align-items:center;gap:1.25rem}
.mark{width:100%}
h1{font-size:1.5rem;letter-spacing:-.005em;text-align:center;text-wrap:balance}
.text{flex:0 1 30rem;min-width:0;padding-bottom:var(--namebox,2.9rem)}
main.full{--namebox:4.2rem}
footer{width:100%;max-width:74rem;margin-inline:auto}
@media (max-width:760px){main{flex-direction:column;align-items:flex-start;gap:2.5rem;padding-block:2.5rem 1rem}.lockup{flex:none;width:min(72%,18rem)}.text{flex:none;width:100%;padding-bottom:0}}