/* ═══ Do Not Sell / Privacy-rights request ════════════════════ */
/* Reuses .ct hero + .ct-form / .field primitives from contact.css;
   this sheet adds the request-type chooser and the request-only notes. */

/* Short page: pin the footer to the bottom of the viewport. */
.dns-page {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}
.dns-page .ct { flex: 1; }
.dns-page #site-footer { margin-top: auto; }

/* Single copy column on the left — no goat here, so the form gets more room.
   Desktop only: below 941px contact.css stacks the columns. */
@media (min-width: 941px) {
  .dns-page .ct .wrap { grid-template-columns: 1fr 1.2fr; }
}

/* Fieldsets carry no native chrome — match the stacked-field rhythm. */
.dns-form fieldset { border: 0; margin: 0; padding: 0; }
.dns-form > * + * { margin-top: 20px; }
.dns-form legend { font-size: 13.5px; color: var(--cm-ink-secondary); padding: 0; margin-bottom: 10px; }
.dns-form input::placeholder { color: var(--cm-ink-tertiary); opacity: 1; }

/* Request-type chooser: a stack of radio rows. */
.dns-types { display: flex; flex-direction: column; }
.dns-type {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 12px 14px;
  border: 1px solid var(--cm-border-strong);
  border-radius: var(--cm-radius);
  font-size: 15px;
  color: var(--cm-ink-primary);
  cursor: pointer;
}
.dns-type + .dns-type { margin-top: 10px; }
.dns-type input { width: 16px; height: 16px; margin: 2px 0 0; accent-color: var(--cm-accent); flex: none; }
.dns-type:has(input:checked) { border-color: var(--cm-accent); }

/* Nested address fields sit slightly inset under their legend. */
.dns-address .field + .field,
.dns-address .field + .field-row { margin-top: 14px; }
/* City / State / ZIP in one row; align-items:end bottom-aligns the inputs so
   they line up even if a label wraps. */
.dns-address .field-row { grid-template-columns: 2fr 0.8fr 1fr; align-items: end; }

/* State dropdown — match the .field input look (contact.css styles inputs only). */
.dns-address select {
  height: 44px;
  padding: 0 10px;
  border: 1px solid var(--cm-border-strong);
  border-radius: var(--cm-radius);
  background: var(--cm-bg-primary);
  font-family: inherit;
  font-size: 15px;
  font-weight: 300;
  color: var(--cm-ink-primary);
  box-sizing: border-box;
  width: 100%;
}
.dns-address select:focus { outline: none; border-color: var(--cm-accent); }

/* Correction detail textarea — match the .field input look. */
.dns-correct textarea {
  width: 100%;
  padding: 10px;
  border: 1px solid var(--cm-border-strong);
  border-radius: var(--cm-radius);
  background: var(--cm-bg-primary);
  font-family: inherit;
  font-size: 15px;
  font-weight: 300;
  color: var(--cm-ink-primary);
  box-sizing: border-box;
  resize: vertical;
}
.dns-correct textarea:focus { outline: none; border-color: var(--cm-accent); }

/* Repeatable fields (email / phone / address). */
.dns-list { display: flex; flex-direction: column; gap: 10px; }
.dns-multi > .dns-list { margin-top: 7px; }
.dns-addr-block + .dns-addr-block {
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px dashed var(--cm-border-strong);
}
.dns-add {
  align-self: flex-start;
  margin-top: 8px;
  padding: 0;
  background: none;
  border: none;
  font-family: inherit;
  font-size: 13.5px;
  color: var(--cm-accent);
  cursor: pointer;
}
.dns-add:hover { text-decoration: underline; }

.dns-help,
.dns-correct,
.dns-retention { font-size: 13.5px; line-height: 1.6; color: var(--cm-ink-secondary); }
.dns-retention { border-top: 1px solid var(--cm-border); padding-top: 16px; }

.dns-req { color: var(--cm-accent); }

.dns-turnstile:empty { min-height: 0; }

/* Honeypot: bots fill it, humans never see it (no inline style, per repo rule). */
.dns-hp { position: absolute; left: -9999px; width: 1px; height: 1px; opacity: 0; }

@media (max-width: 480px) {
  .dns-address .field-row { grid-template-columns: 1fr; }
}
