/* Unoty — shared styles for legal / utility pages (imprint, privacy, terms, thanks, 404).
   Same monochrome system as the hero pages, trimmed to a reading layout. */
:root{
  --paper:#FFFFFF;--ink:#1F1F1F;--grey:#6B6B6B;--faint:#999999;
  --rule:#E6E6E6;--dot:#000000;--paper-2:#F4F4F4;
  --spine-x:clamp(20px,6vw,120px);--edge:clamp(20px,6vw,120px);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);
  font-family:"Archivo",system-ui,sans-serif;font-size:17px;line-height:1.65;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
  display:flex;flex-direction:column;min-height:100vh}
a{color:inherit}
::selection{background:var(--ink);color:var(--paper)}

.wrap{width:100%;max-width:1180px;margin:0 auto}
.col{padding-left:calc(var(--spine-x) + clamp(24px,4vw,64px));padding-right:var(--edge)}

/* header — matches the hero pages */
.bar{display:flex;align-items:center;justify-content:space-between;
  padding:26px var(--edge) 26px calc(var(--spine-x) + clamp(24px,4vw,64px))}
.mark{font-family:"Archivo",sans-serif;font-weight:800;letter-spacing:-.03em;font-size:19px;
  color:var(--ink);text-decoration:none;line-height:1;display:inline-block}
.mark .odot{display:inline-block;width:.5em;height:.5em;background:var(--dot);border-radius:50%;
  vertical-align:-.015em;margin:0 .012em}
nav{display:flex;gap:30px;font-size:14px;font-family:"IBM Plex Mono",monospace}
nav a{color:var(--grey);text-decoration:none}
nav a:hover,nav a[aria-current]{color:var(--ink)}
.navwrap{display:flex;align-items:center;gap:34px}
.login{font-family:"IBM Plex Mono",monospace;font-size:13px;letter-spacing:.02em;
  color:var(--grey);text-decoration:none;white-space:nowrap;transition:color .18s ease}
.login:hover{color:var(--ink)}
.btn{font-family:"IBM Plex Mono",monospace;font-size:13px;letter-spacing:.02em;
  border:1px solid var(--ink);background:transparent;color:var(--ink);padding:10px 18px;
  border-radius:999px;text-decoration:none;white-space:nowrap;transition:background .18s,color .18s;
  display:inline-block;cursor:pointer}
.btn:hover{background:var(--ink);color:var(--paper)}
.btn.solid{background:var(--ink);color:var(--paper)}
.btn.solid:hover{background:#000}

/* content */
main{flex:1 0 auto;padding:clamp(40px,7vh,90px) 0 clamp(56px,10vh,120px)}
.eyebrow{font-family:"IBM Plex Mono",monospace;font-weight:500;font-size:12px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--grey);display:flex;align-items:center;gap:.7em;margin:0 0 1.6rem}
.eyebrow::before{content:"";width:6px;height:6px;background:var(--eb-dot,var(--dot));border-radius:50%;flex:none;transform:scale(var(--eb-scale,1));transform-origin:center;transition:background .25s linear,transform .25s linear}
h1{font-weight:800;letter-spacing:-.02em;line-height:1.06;margin:0;
  font-size:clamp(32px,5.2vw,58px);max-width:18ch}
.updated{font-family:"IBM Plex Mono",monospace;font-size:12.5px;color:var(--faint);
  letter-spacing:.02em;margin:18px 0 0}
.prose{max-width:68ch;margin-top:clamp(30px,4vw,46px)}
.prose h2{font-weight:700;letter-spacing:-.01em;font-size:clamp(20px,2.6vw,26px);
  margin:2.2em 0 .6em;line-height:1.2}
.prose h2:first-child{margin-top:0}
.prose h3{font-weight:600;font-size:clamp(17px,2vw,19px);margin:1.6em 0 .4em}
.prose p{margin:0 0 1.05em}
.prose ul{margin:0 0 1.05em;padding-left:1.15em}
.prose li{margin:.3em 0}
.prose a{color:var(--ink);text-decoration:underline;text-decoration-color:var(--rule);
  text-underline-offset:3px}
.prose a:hover{text-decoration-color:var(--ink)}
.prose strong{font-weight:600}
.prose .lede{font-size:clamp(18px,2.1vw,21px);color:var(--ink);line-height:1.5;max-width:60ch}
.prose hr{border:0;border-top:1px solid var(--rule);margin:2.4em 0}
/* editorial note — visible flag for content that needs review */
.note{background:var(--paper-2);border:1px solid var(--rule);border-radius:6px;
  padding:16px 18px;margin:0 0 1.6em;font-size:14.5px;color:var(--grey)}
.note strong{color:var(--ink)}
.contact-card{font-family:"IBM Plex Mono",monospace;font-size:13.5px;line-height:1.9;
  color:var(--ink);font-style:normal;margin:.4em 0 1.2em}

/* centred utility layout (thanks / 404) */
.center{display:flex;flex-direction:column;align-items:flex-start;gap:8px}
.center .bigdot{width:14px;height:14px;background:var(--dot);border-radius:50%;margin-bottom:26px}
.center .cta-row{display:flex;flex-wrap:wrap;gap:14px;margin-top:34px}

/* footer — reversed out against black */
footer{background:var(--ink);color:var(--paper);flex-shrink:0}
footer .mark{color:var(--paper)}
footer .mark .odot{background:var(--paper)}
.foot{display:flex;flex-wrap:wrap;justify-content:space-between;gap:24px;
  padding:44px var(--edge) 26px calc(var(--spine-x) + clamp(24px,4vw,64px))}
.foot .mono{font-family:"IBM Plex Mono",monospace;font-size:13px;color:#9A9A93}
.foot nav a{font-size:13px;color:#B9B9B2;text-decoration:none}
.foot nav a:hover{color:var(--paper)}
.foot-legal{display:flex;flex-wrap:wrap;justify-content:space-between;gap:14px 40px;
  align-items:baseline;padding:0 var(--edge) 44px calc(var(--spine-x) + clamp(24px,4vw,64px));
  border-top:1px solid rgba(255,255,255,.14);padding-top:22px;margin-top:0}
.foot-legal .mono{font-family:"IBM Plex Mono",monospace;font-size:12.5px;color:#9A9A93}
.legal-nav{display:flex;flex-wrap:wrap;gap:10px 22px;font-family:"IBM Plex Mono",monospace;font-size:12.5px}
.legal-nav a{color:#9A9A93;text-decoration:none}
.legal-nav a:hover{color:var(--paper)}

a.btn:focus-visible,nav a:focus-visible,.mark:focus-visible,.login:focus-visible,.prose a:focus-visible{
  outline:2px solid var(--dot);outline-offset:3px;border-radius:2px}
footer a:focus-visible{outline-color:var(--paper)}

@media(max-width:760px){
  :root{--spine-x:20px}
  nav[aria-label="Primary"]{display:none}
  .bar,.col{padding-left:24px;padding-right:24px}
  .foot,.foot-legal{padding-left:24px;padding-right:24px}
}
