/* The contact page: the form and what helps, in the site's colour. Needs base.css. */
.contact .kick{color:var(--sys-text)}
.ct-sent{margin:0 0 2rem;padding:1.1rem 1.4rem;background:color-mix(in srgb,var(--gain) 12%,var(--panel));border-left:3px solid var(--gain);color:var(--text-2);max-width:760px}
.ct-sent b{color:var(--text)}
.ct-grid{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:2.4rem 3rem;align-items:start}
@media(max-width:820px){.ct-grid{grid-template-columns:minmax(0,1fr)}}
.ct-form{position:relative;background:var(--panel);border-left:3px solid var(--sys);clip-path:var(--notch);padding:1.8rem 2rem 2rem;display:grid;gap:1.2rem}
.ct-trap{position:absolute;left:-10000px;top:auto;width:1px;height:1px;overflow:hidden}
.ct-field{display:grid;gap:.45rem}
.ct-field span{font-family:var(--mono);font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted-2)}
.ct-field span small{font-size:1em;letter-spacing:.06em;text-transform:none;margin-left:.4rem}
.ct-field input,.ct-field textarea{width:100%;background:var(--panel-2);border:1px solid var(--line);color:var(--text);font:inherit;font-size:.98rem;padding:.75rem .9rem;border-radius:0}
.ct-field textarea{resize:vertical;min-height:9rem;line-height:1.55}
.ct-field input:focus,.ct-field textarea:focus{outline:none;border-color:var(--sys);box-shadow:0 0 0 1px var(--sys)}
.ct-send{justify-self:start;font-family:var(--disp);font-weight:600;font-size:.95rem;letter-spacing:.05em;text-transform:uppercase;background:var(--sys);color:var(--on-accent);
  border:0;padding:.75rem 1.6rem;cursor:pointer;clip-path:var(--pill)}
.ct-send:hover{background:var(--up)}
.ct-errors{background:color-mix(in srgb,var(--lose) 12%,var(--panel-2));border-left:3px solid var(--lose);padding:.9rem 1.1rem;color:var(--text-2);font-size:.92rem;display:grid;gap:.3rem}
.ct-aside h2{font-family:var(--disp);font-weight:700;font-size:1.2rem;text-transform:uppercase;letter-spacing:.02em;margin:0 0 .6rem}
.ct-aside h2:not(:first-child){margin-top:1.8rem}
.ct-aside ul{margin:0;padding:0;list-style:none}
.ct-aside li{position:relative;padding-left:1.1rem;color:var(--muted);font-size:.93rem;line-height:1.6}
.ct-aside li+li{margin-top:.45rem}
.ct-aside li::before{content:'';position:absolute;left:0;top:.62em;width:5px;height:5px;background:var(--sys)}
.ct-aside p{color:var(--muted);font-size:.93rem;line-height:1.65;margin:0}
.ct-aside a{color:var(--text-2)}
/* The privacy page */
.pv{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:2rem 3rem;max-width:1000px}
@media(max-width:760px){.pv{grid-template-columns:minmax(0,1fr)}}
.pv section{border-top:2px solid var(--sys);padding-top:1rem}
.pv h2{font-family:var(--disp);font-weight:700;font-size:1.25rem;text-transform:uppercase;letter-spacing:.02em;margin:0 0 .6rem}
.pv p{color:var(--muted);font-size:.95rem;line-height:1.7;margin:0}
.pv a{color:var(--text-2)}
.pv p+p{margin-top:.7rem}