/* DistroDesigner Intake. Burgundy accent #7A1F3D (10.0:1 on white). Every
   text colour below holds at least 4.5:1 on its background (WCAG 2.1 AA). */

@font-face { font-family: "Jost"; font-style: normal; font-weight: 400; font-display: swap;
  src: url("../vendor/jost/jost-latin-400-normal.woff2") format("woff2");
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family: "Jost"; font-style: normal; font-weight: 400; font-display: swap;
  src: url("../vendor/jost/jost-latin-ext-400-normal.woff2") format("woff2");
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family: "Jost"; font-style: normal; font-weight: 500; font-display: swap;
  src: url("../vendor/jost/jost-latin-500-normal.woff2") format("woff2");
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family: "Jost"; font-style: normal; font-weight: 500; font-display: swap;
  src: url("../vendor/jost/jost-latin-ext-500-normal.woff2") format("woff2");
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }
@font-face { font-family: "Jost"; font-style: normal; font-weight: 600; font-display: swap;
  src: url("../vendor/jost/jost-latin-600-normal.woff2") format("woff2");
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD; }
@font-face { font-family: "Jost"; font-style: normal; font-weight: 600; font-display: swap;
  src: url("../vendor/jost/jost-latin-ext-600-normal.woff2") format("woff2");
  unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF; }

:root {
  --accent: #7A1F3D;        /* 10.0:1 on white */
  --accent-dark: #5C1730;
  --accent-tint: #F6ECEF;
  --ink: #1F1A1C;           /* 16.7:1 on white */
  --muted: #5A5257;         /* 7.4:1 on white */
  --line: #8A8186;          /* 3.6:1, for borders of controls (1.4.11) */
  --soft: #E7E2E4;
  --error: #B00020;         /* 6.6:1 on white */
  --focus: #1D4ED8;
}

* { box-sizing: border-box; }
html { font-size: 100%; }
body { margin: 0; font-family: "Jost", system-ui, sans-serif; color: var(--ink);
  background: #fff; line-height: 1.5; display: flex; flex-direction: column; min-height: 100vh; }
a { color: var(--accent); }
a:hover { color: var(--accent-dark); }
:focus-visible { outline: 3px solid var(--focus); outline-offset: 2px; }

.skip { position: absolute; left: -9999px; top: 0; background: #fff; padding: .5rem 1rem; }
.skip:focus { left: 1rem; z-index: 2000; }

.top { display: flex; align-items: center; justify-content: space-between; gap: 1rem;
  padding: .75rem 1.5rem; border-bottom: 4px solid var(--accent); flex-wrap: wrap; }
.brand { display: flex; align-items: center; gap: .75rem; text-decoration: none; color: var(--ink);
  font-weight: 600; font-size: 1.15rem; }
.brand img { max-height: 40px; max-width: 160px; }
.top nav ul { list-style: none; display: flex; gap: 1.25rem; margin: 0; padding: 0; align-items: center; }
.top nav a { font-weight: 500; }
.linkish { background: none; border: none; color: var(--accent); text-decoration: underline;
  font: inherit; font-weight: 500; padding: 0; cursor: pointer; }

main { flex: 1; width: 100%; max-width: 60rem; margin: 0 auto; padding: 1.5rem; }
main:focus { outline: none; }
h1 { font-weight: 600; font-size: 1.8rem; margin: .25rem 0 1rem; }
h2 { font-weight: 600; font-size: 1.25rem; margin: 1.5rem 0 .5rem; }

.foot { padding: 1rem 1.5rem; border-top: 1px solid var(--soft); color: var(--muted); font-size: .9rem; }

.steps ol { list-style: none; display: flex; flex-wrap: wrap; gap: .25rem; padding: 0; margin: 0 0 1.5rem; counter-reset: step; }
.steps li { counter-increment: step; }
.steps a { display: inline-block; padding: .35rem .75rem; border: 1px solid var(--line); border-radius: 999px;
  text-decoration: none; color: var(--ink); }
.steps a::before { content: counter(step) ". "; }
.steps a[aria-current="step"], .steps a[aria-current="page"] { background: var(--accent); border-color: var(--accent); color: #fff; }

.field { display: flex; flex-direction: column; gap: .25rem; margin: 0 0 1rem; max-width: 32rem; }
.field.inline { flex-direction: row; align-items: flex-end; gap: .5rem; }
.field.inline > div { display: flex; flex-direction: column; gap: .25rem; }
label, legend { font-weight: 500; }
label.req::after, legend.req::after { content: " *"; color: var(--error); }
input[type=text], input[type=email], input[type=tel], input[type=number], input[type=date],
select, textarea { font: inherit; color: var(--ink); padding: .5rem .6rem; border: 1px solid var(--line);
  border-radius: 6px; background: #fff; width: 100%; }
textarea { min-height: 7rem; }
input[aria-invalid=true], select[aria-invalid=true], textarea[aria-invalid=true] { border: 2px solid var(--error); }
.unit-wrap { display: flex; align-items: center; gap: .5rem; }
.unit-wrap input { max-width: 12rem; }
.unit { color: var(--muted); }
fieldset { border: 1px solid var(--soft); border-radius: 8px; padding: .75rem 1rem 0; margin: 0 0 1.25rem; }
legend { padding: 0 .25rem; }
.grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(11rem, 1fr)); gap: 0 1rem; }
.grid .field { max-width: none; }
.radios { display: flex; gap: 1.5rem; padding-bottom: .75rem; }
.radios label { font-weight: 400; display: flex; gap: .4rem; align-items: center; }
.field-error { color: var(--error); font-weight: 500; }

button, .button { font: inherit; font-weight: 500; display: inline-block; padding: .55rem 1.2rem;
  border-radius: 6px; border: 2px solid var(--accent); background: var(--accent); color: #fff;
  cursor: pointer; text-decoration: none; }
button:hover, .button:hover { background: var(--accent-dark); border-color: var(--accent-dark); color: #fff; }
button.secondary, .button.secondary { background: #fff; color: var(--accent); }
button.secondary:hover, .button.secondary:hover { background: var(--accent-tint); color: var(--accent-dark); }
button[disabled] { opacity: .6; cursor: progress; }
.actions { display: flex; gap: .75rem; margin: 1.5rem 0; flex-wrap: wrap; }

.errors { border: 2px solid var(--error); border-radius: 8px; padding: .5rem 1rem; margin: 0 0 1.25rem; }
.errors h2 { margin: .25rem 0; font-size: 1.1rem; color: var(--error); }
.errors a { color: var(--error); font-weight: 500; }
.status { min-height: 1.5rem; font-weight: 500; }

table { border-collapse: collapse; width: 100%; margin: .5rem 0 1rem; }
th, td { text-align: left; padding: .5rem .6rem; border-bottom: 1px solid var(--soft); vertical-align: top; }
th { font-weight: 600; }
dl.facts { display: grid; grid-template-columns: max-content 1fr; gap: .4rem 1.5rem; margin: 0 0 1rem; }
dl.facts dt { font-weight: 500; color: var(--muted); }
dl.facts dd { margin: 0; }
.reference { font-size: 2rem; font-weight: 600; letter-spacing: .05em; color: var(--accent); }

.map { height: 22rem; border: 1px solid var(--line); border-radius: 8px; margin: 0 0 1rem; }
.combo { position: relative; }
.combo ul { position: absolute; z-index: 1000; left: 0; right: 0; top: 100%; margin: 0; padding: 0;
  list-style: none; background: #fff; border: 1px solid var(--line); border-radius: 0 0 6px 6px; }
.combo li { padding: .45rem .6rem; cursor: pointer; }
.combo li[aria-selected=true], .combo li:hover { background: var(--accent-tint); }

.thread { list-style: none; padding: 0; margin: 0 0 1.5rem; }
.thread li { border: 1px solid var(--soft); border-radius: 8px; padding: .75rem 1rem; margin: 0 0 .75rem; }
.thread li.mine { border-left: 4px solid var(--accent); }
.thread .meta { color: var(--muted); font-size: .9rem; }
.thread .body { white-space: pre-wrap; margin: .25rem 0; }
.notice { color: var(--muted); font-size: .92rem; max-width: 40rem; }
.files { list-style: none; padding: 0; margin: .25rem 0; }
.files li { display: flex; gap: .75rem; align-items: center; }
.visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
