/* Realliance Pages landing site. Tokens, fonts and logo come from realliance/brand (assets/brand, pinned by
   brand.lock.json). Dark by default, Latte when the visitor prefers light (the brand palette does the switch). */
:root{
  color-scheme: dark light;
  --r-sm: 8px;
  --r-md: 12px;
}
*,*::before,*::after{box-sizing:border-box}
html{background:var(--rl-bg);-webkit-text-size-adjust:100%}
body{
  margin:0;
  background:var(--rl-bg);
  color:var(--rl-text);
  font-family:var(--rl-font-body);
  font-size:1.0625rem;
  line-height:1.6;
}
main,footer{width:min(100% - 2rem, 42rem);margin-inline:auto}
main{padding:2.5rem 0 1rem}

h1,h2,h3{font-family:var(--rl-font-heading);font-weight:600;line-height:1.15;margin:0}
h1{font-size:2.5rem}
h2{font-size:1.5rem;margin-top:2.5rem}
h3{font-size:1.1rem;margin-top:1.5rem}
p,ul,ol{margin:.75rem 0 0}
ul,ol{padding-left:1.4rem}
li+li{margin-top:.35rem}
a{color:var(--rl-primary);text-underline-offset:.18em}
a:hover{color:var(--rl-primary-hover)}
:is(a,summary):focus-visible,pre:focus-visible{outline:2px solid var(--rl-accent);outline-offset:2px}
hr{border:0;border-top:1px solid var(--rl-border);margin:2.5rem 0 0}
.muted{color:var(--rl-text-muted)}

.hero{text-align:center}
.hero img{display:block;width:200px;height:auto;max-width:60vw;margin:0 auto .5rem}
.pitch{font-family:var(--rl-font-heading);font-weight:500;font-size:1.35rem;margin-top:.5rem}
.hero .sub{max-width:32rem;margin-inline:auto}
.hero .btns{display:flex;flex-wrap:wrap;gap:.75rem;justify-content:center;margin-top:1.25rem}
.btn{
  display:inline-flex;align-items:center;
  padding:.5rem 1rem;
  border:1px solid transparent;border-radius:var(--r-sm);
  background:var(--rl-primary);color:var(--rl-primary-contrast);
  font-weight:700;text-decoration:none;
}
.btn:hover{background:var(--rl-primary-hover);color:var(--rl-primary-contrast)}

code,pre{font-family:var(--rl-font-code);font-size:.9rem}
code{
  padding:.1rem .35rem;
  background:var(--rl-surface);
  border:1px solid var(--rl-border);border-radius:6px;
  overflow-wrap:anywhere;
}
pre{
  margin:.75rem 0 0;padding:.9rem 1rem;
  background:var(--rl-surface);
  border:1px solid var(--rl-border);border-radius:var(--r-md);
  overflow-x:auto;
  line-height:1.5;
  tab-size:2;
}
pre code{padding:0;background:none;border:0;border-radius:0;font-size:inherit;overflow-wrap:normal}
.pick{user-select:all}

.card{
  margin-top:.75rem;padding:1rem 1.1rem;
  background:var(--rl-surface);
  border:1px solid var(--rl-border);border-radius:var(--r-md);
}
.card p:first-child{margin-top:0}
details{margin-top:.75rem;border:1px solid var(--rl-border);border-radius:var(--r-md);background:var(--rl-surface)}
summary{cursor:pointer;padding:.7rem 1rem;font-weight:700}
details pre{margin:0;border:0;border-top:1px solid var(--rl-border);border-radius:0 0 var(--r-md) var(--r-md)}

footer{padding:1.5rem 0 3rem}
footer ul{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:.5rem 1.25rem;margin-top:.75rem}
footer li+li{margin-top:0}
footer .small{font-size:.9rem}
@media (max-width:30rem){
  h1{font-size:2rem}
  pre{font-size:.82rem}
}