/* ---------- fonts (self-hosted, no third-party requests) ---------- */
@font-face{
  font-family:"M PLUS 2";font-style:normal;font-weight:400;font-display:swap;
  src:url("/fonts/m-plus-2-latin-400-normal.woff2") format("woff2");
}
@font-face{
  font-family:"M PLUS 2";font-style:normal;font-weight:500;font-display:swap;
  src:url("/fonts/m-plus-2-latin-500-normal.woff2") format("woff2");
}
@font-face{
  font-family:"M PLUS 2";font-style:normal;font-weight:600;font-display:swap;
  src:url("/fonts/m-plus-2-latin-600-normal.woff2") format("woff2");
}
@font-face{
  font-family:"JetBrains Mono";font-style:normal;font-weight:400;font-display:swap;
  src:url("/fonts/jetbrains-mono-latin-400-normal.woff2") format("woff2");
}
@font-face{
  font-family:"JetBrains Mono";font-style:normal;font-weight:500;font-display:swap;
  src:url("/fonts/jetbrains-mono-latin-500-normal.woff2") format("woff2");
}

:root{
  --ink:#0E1111;
  --paper:#FAF9F6;
  --rust:#D76A29;
  --ink-70:rgba(14,17,17,.70);
  --ink-45:rgba(14,17,17,.45);
  --paper-70:rgba(250,249,246,.70);
  --paper-45:rgba(250,249,246,.45);
  --rule:rgba(14,17,17,.14);
  --rule-light:rgba(250,249,246,.16);
  --bevel:7vw;
  --pad:clamp(1.5rem,5vw,6rem);
}

*,*::before,*::after{box-sizing:border-box}

html{-webkit-text-size-adjust:100%}

body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:"M PLUS 2",system-ui,sans-serif;
  font-weight:400;
  font-size:clamp(1rem,.95rem + .3vw,1.125rem);
  line-height:1.62;
  -webkit-font-smoothing:antialiased;
}

a{color:inherit}

:focus-visible{
  outline:2px solid var(--rust);
  outline-offset:4px;
  border-radius:2px;
}

.wrap{
  width:min(100%,1240px);
  margin-inline:auto;
  padding-inline:var(--pad);
}

.mono{
  font-family:"JetBrains Mono",ui-monospace,monospace;
  font-size:.75rem;
  letter-spacing:.09em;
  text-transform:uppercase;
  font-weight:500;
}

/* ---------- lockup ---------- */
.lockup{display:flex;align-items:center;gap:.85rem;text-decoration:none}
.lockup img{height:1.7rem;width:auto;display:block;flex:none}
.lockup .bar{width:1px;align-self:stretch;background:var(--rule-light);margin-block:.15rem}
.lockup .name{
  font-weight:600;
  font-size:1.2rem;
  letter-spacing:-.005em;
  line-height:1;
}

/* ---------- language switch ---------- */
.meta{display:flex;align-items:center;gap:clamp(1rem,3vw,2rem)}
.meta .where{color:var(--paper-70)}

.lang{display:flex;align-items:center;gap:.55rem}
.lang button{
  font-family:"JetBrains Mono",ui-monospace,monospace;
  font-size:.75rem;
  letter-spacing:.09em;
  font-weight:500;
  background:none;
  border:0;
  padding:.2rem .1rem;
  color:var(--paper-45);
  cursor:pointer;
  transition:color .25s;
}
.lang button:hover{color:var(--paper)}
.lang button[aria-pressed="true"]{color:var(--rust)}
.lang .sep{color:var(--rule-light);font-size:.75rem;line-height:1}

/* ---------- dark panel (shared by both pages) ---------- */
.panel{
  position:relative;
  background:var(--ink);
  color:var(--paper);
  clip-path:polygon(0 0,100% 0,100% calc(100% - var(--bevel)),0 100%);
  overflow:hidden;
  isolation:isolate;
}

.topbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  flex-wrap:wrap;
}

/* ---------- home hero ---------- */
.hero{padding-block:clamp(1.4rem,3vw,2.2rem) calc(var(--bevel) + clamp(5rem,12vw,10rem))}

/* oversized mark, bled off the right edge and sliced by the panel bevel */
.hero .glyph{
  position:absolute;
  z-index:-1;
  right:-14%;
  top:50%;
  translate:0 -46%;
  width:min(62%,760px);
  opacity:.13;
  pointer-events:none;
}
.hero .glyph img{width:100%;height:auto;display:block}

.hero-body{margin-top:clamp(4rem,11vw,8.5rem)}

.eyebrow{
  color:var(--rust);
  display:flex;
  align-items:center;
  gap:.7rem;
  margin-bottom:clamp(1.1rem,2vw,1.6rem);
}
.eyebrow::before{
  content:"";
  width:clamp(1.6rem,4vw,3rem);
  height:1px;
  background:var(--rust);
  flex:none;
}

h1{
  font-weight:600;
  font-size:clamp(2.2rem,1rem + 5.4vw,4.9rem);
  line-height:1.04;
  letter-spacing:-.028em;
  margin:0;
  max-width:15ch;
  text-wrap:balance;
}
h1 em{font-style:normal;color:var(--rust)}

.lede{
  margin:clamp(1.6rem,3vw,2.2rem) 0 0;
  max-width:48ch;
  color:var(--paper-70);
  font-size:clamp(1.02rem,.95rem + .4vw,1.24rem);
}

/* ---------- content ---------- */
.content{padding-block:clamp(3.5rem,9vw,7rem) clamp(3rem,7vw,5.5rem)}

.cols{
  display:grid;
  gap:clamp(2.5rem,5vw,4.5rem);
  grid-template-columns:1fr;
}
@media (min-width:820px){
  .cols{grid-template-columns:1fr 1fr;gap:clamp(3rem,6vw,6rem)}
}

.block h2{
  font-weight:600;
  font-size:1rem;
  letter-spacing:.005em;
  margin:0 0 1.1rem;
  padding-bottom:.85rem;
  border-bottom:1px solid var(--rule);
}
.block p{margin:0 0 1.05rem;color:var(--ink-70);max-width:56ch}
.block p:last-of-type{margin-bottom:0}
.block strong{font-weight:600;color:var(--ink)}

.tag{
  display:inline-block;
  margin-top:1.4rem;
  padding:.34rem .7rem;
  border:1px solid var(--rust);
  color:var(--rust);
  border-radius:2px;
}

/* ---------- contact ---------- */
.contact{
  margin-top:clamp(4rem,9vw,7rem);
  padding-top:clamp(2rem,4vw,3rem);
  border-top:1px solid var(--rule);
  display:flex;
  flex-wrap:wrap;
  align-items:baseline;
  justify-content:space-between;
  gap:1.2rem 2rem;
}
.contact .label{color:var(--ink-45);margin:0}
.contact a{
  font-weight:600;
  font-size:clamp(1.3rem,.9rem + 2vw,2.6rem);
  letter-spacing:-.02em;
  text-decoration:none;
  line-height:1.1;
  background-image:linear-gradient(var(--rust),var(--rust));
  background-repeat:no-repeat;
  background-position:0 100%;
  background-size:100% 1px;
  transition:background-size .35s cubic-bezier(.2,.7,.3,1),color .35s;
}
.contact a:hover{color:var(--rust);background-size:100% 2px}

/* ---------- footer ---------- */
footer{border-top:1px solid var(--rule);padding-block:1.5rem 2.2rem}
.foot{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:.6rem 1.5rem;
  color:var(--ink-45);
  font-size:.7rem;
  margin:0;
}
.foot a{
  color:var(--ink-45);
  text-decoration:none;
  border-bottom:1px solid transparent;
  transition:color .25s,border-color .25s;
}
.foot a:hover{color:var(--rust);border-bottom-color:var(--rust)}

/* ---------- legal page ---------- */
.subhead{
  --bevel:3.5vw;
  padding-block:clamp(1.4rem,3vw,2.2rem) calc(var(--bevel) + clamp(2.6rem,6vw,4.5rem));
}
.subhead h1{
  margin-top:clamp(2.4rem,6vw,4rem);
  font-size:clamp(1.9rem,1.1rem + 3vw,3.2rem);
  max-width:20ch;
}
.back{
  color:var(--paper-70);
  text-decoration:none;
  transition:color .25s;
}
.back:hover{color:var(--rust)}

.doc{
  padding-block:clamp(3rem,7vw,5rem) clamp(2.5rem,6vw,4rem);
  max-width:74ch;
}
.doc section + section{margin-top:clamp(2.4rem,5vw,3.4rem)}
.doc h2{
  font-weight:600;
  font-size:1rem;
  margin:0 0 1.1rem;
  padding-bottom:.85rem;
  border-bottom:1px solid var(--rule);
}
.doc p{margin:0 0 1rem;color:var(--ink-70)}
.doc p:last-child{margin-bottom:0}
.doc a{color:var(--rust);text-decoration:none;border-bottom:1px solid rgba(215,106,41,.35)}
.doc a:hover{border-bottom-color:var(--rust)}

.facts{margin:0;display:grid;gap:.1rem 1.5rem;grid-template-columns:1fr}
@media (min-width:640px){.facts{grid-template-columns:15rem 1fr}}
.facts dt{
  font-family:"JetBrains Mono",ui-monospace,monospace;
  font-size:.7rem;
  letter-spacing:.09em;
  text-transform:uppercase;
  font-weight:500;
  color:var(--ink-45);
  padding-top:.55rem;
}
.facts dd{margin:0;padding-bottom:.55rem;color:var(--ink-70)}
@media (min-width:640px){
  .facts dt{padding-top:.5rem}
  .facts dd{padding-top:.35rem}
}

/* ---------- entrance ---------- */
@media (prefers-reduced-motion:no-preference){
  .rise{
    opacity:0;
    translate:0 14px;
    animation:rise .8s cubic-bezier(.2,.7,.3,1) forwards;
  }
  .d1{animation-delay:.05s}
  .d2{animation-delay:.16s}
  .d3{animation-delay:.27s}
  .d4{animation-delay:.38s}
  @keyframes rise{to{opacity:1;translate:0 0}}
}