/* small.news intake forms — editorial brand, aligned to small.news
   White / ink black, DM Serif Display headings, Lato body, square black buttons. No emojis. */
:root{
  --ink:#16181d;
  --ink-soft:#5b5f66;
  --hair:#d7dadf;     /* input hairlines */
  --rule:#16181d;     /* masthead/editorial rules */
  --bg:#ffffff;
  --bg-soft:#f7f7f5;
  --err:#9b2c2c;
  --maxw:680px;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family:"Lato",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  color:var(--ink);
  background:var(--bg);
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
}
.wrap{max-width:var(--maxw);margin:0 auto;padding:36px 22px 96px}

/* masthead */
.masthead{text-align:center;padding-bottom:16px;border-bottom:2px solid var(--rule);margin-bottom:32px}
.masthead .logo{height:40px;width:auto;display:inline-block}

/* the form sits flat on the page (editorial), no drop-shadow card */
.card{background:transparent;padding:0}

.tag{display:inline-block;font-size:11.5px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:14px}
h1{font-family:"DM Serif Display",Georgia,"Times New Roman",serif;font-weight:400;font-size:36px;line-height:1.12;margin:0 0 12px;text-align:center}
.lede{color:var(--ink-soft);font-size:16px;margin:0 0 30px;text-align:center}
.intro{color:var(--ink);font-size:15.5px;margin:0 0 30px}
.intro p{margin:0 0 13px}
.intro a{color:var(--ink);text-decoration:underline;text-underline-offset:2px}

/* a thin rule introduces the field set */
form{border-top:1px solid var(--hair);padding-top:28px}

.field{margin-bottom:22px}
label{display:block;font-weight:700;font-size:14px;margin-bottom:7px;letter-spacing:.01em}
label .req{color:var(--ink);margin-left:3px;font-weight:700}
.help{display:block;font-weight:400;color:var(--ink-soft);font-size:12.5px;margin-top:4px;font-style:italic}
input[type=text],input[type=email],input[type=url],textarea,select{
  width:100%;font:inherit;color:var(--ink);background:var(--bg);
  border:1px solid var(--hair);border-radius:2px;padding:11px 13px;
  transition:border-color .12s,box-shadow .12s;
}
textarea{min-height:112px;resize:vertical}
input:focus,textarea:focus,select:focus{
  outline:none;border-color:var(--ink);box-shadow:0 0 0 2px rgba(22,24,29,.12);
}
select{appearance:none;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%2316181d' stroke-width='2'><path d='M6 9l6 6 6-6'/></svg>");background-repeat:no-repeat;background-position:right 13px center;padding-right:38px}
.dropzone{border:1.5px dashed var(--hair);border-radius:2px;padding:18px;text-align:center;color:var(--ink-soft);font-size:14px;cursor:pointer}
.dropzone:hover{border-color:var(--ink);background:var(--bg-soft)}
.filelist{margin-top:8px;font-size:13px;color:var(--ink-soft)}
.consent{display:flex;gap:10px;align-items:flex-start;font-size:14px;color:var(--ink)}
.consent input{margin-top:3px;accent-color:var(--ink)}
.actions{margin-top:30px}
button.submit{
  background:var(--ink);color:#fff;border:0;border-radius:0;
  font:inherit;font-weight:700;font-size:15px;letter-spacing:.03em;
  padding:14px 34px;cursor:pointer;transition:opacity .12s,transform .04s;
}
button.submit:hover{opacity:.86}
button.submit:active{transform:translateY(1px)}
button.submit:disabled{opacity:.45;cursor:not-allowed}
.note{font-size:12px;color:var(--ink-soft);margin-top:18px}
.err-msg{color:var(--err);font-size:12.5px;margin-top:6px;display:none}
.field.invalid input,.field.invalid textarea,.field.invalid select{border-color:var(--err)}
.field.invalid .err-msg{display:block}

/* success */
.success{display:none;text-align:center;padding:46px 10px}
.success.show{display:block}
.success .check{width:52px;height:52px;border-radius:50%;border:1.5px solid var(--ink);display:flex;align-items:center;justify-content:center;margin:0 auto 18px}
.success h2{font-family:"DM Serif Display",Georgia,serif;font-weight:400;margin:0 0 8px;font-size:28px}
.success p{color:var(--ink-soft);margin:0}

footer.legal{max-width:var(--maxw);margin:26px auto 0;color:#9aa0a6;font-size:11.5px;text-align:center;border-top:1px solid var(--hair);padding-top:16px}
