/* ==========================================================================
   PULSE V2 — trust.css · "ION ATMOSPHERE"
   Trust + contact layer: the inline email-copy control (text + copy + mailto
   pattern used wherever an address appears), the /contact email module and
   address rows, and the doc tables used by /compliance and /cookies.
   Requires tokens.css + base.css first; /contact additionally loads
   legal.css + utility.css, the doc pages load legal.css.
   Tokens only — zero hardcoded colors (spec §14.1).
   ========================================================================== */

/* --------------------------------------------------------------------------
   Inline email-copy button — sits right after a mailto link. Icon-only;
   ships disabled and is enabled by /js/copy-email.js only when the
   Clipboard API exists (disabled ⇒ hidden, so no-JS pages show just
   text + mailto). The two icons swap via .is-copied.
   -------------------------------------------------------------------------- */
.email-copy {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.9rem;
  height: 1.9rem;
  padding: 0;
  margin-inline-start: 0.45rem;
  vertical-align: middle;
  background: var(--wash-1);
  border: 1px solid var(--line-1);
  border-radius: var(--radius-sm);
  color: var(--text-3);
  cursor: pointer;
  transition: color var(--dur-1) ease, border-color var(--dur-1) ease,
              background var(--dur-1) ease;
}
.email-copy:hover,
.email-copy:focus-visible {
  color: var(--accent-bright);
  border-color: var(--line-2);
  background: var(--wash-2);
}
.email-copy svg { flex: none; }
.email-copy .ec-check { display: none; }
.email-copy.is-copied {
  color: var(--accent-bright);
  border-color: var(--accent-line);
}
.email-copy.is-copied .ec-copy { display: none; }
.email-copy.is-copied .ec-check { display: block; }
.email-copy[disabled] { display: none; }

/* Text-label variant (the /contact primary control): both labels live in
   the markup; .is-copied swaps which one shows. i18n-safe — no JS-authored
   strings, no CSS content. */
.email-copy-lg .ec-done { display: none; }
.email-copy-lg.is-copied .ec-idle { display: none; }
.email-copy-lg.is-copied .ec-done { display: inline; }
.email-copy-lg[disabled] { display: none; }

/* --------------------------------------------------------------------------
   /contact — primary email module
   -------------------------------------------------------------------------- */
.email-module {
  max-width: 46rem;
  padding: var(--sp-6);
  background: var(--surface-1);
  border: 1px solid var(--line-1);
  border-radius: var(--radius-lg);
}
.email-module .mono-label { display: block; margin-bottom: var(--sp-3); }
.email-value {
  display: block;
  font: 700 clamp(1.05rem, 2.8vw, 1.4rem) / 1.35 var(--font-mono);
  color: var(--text-1);
  overflow-wrap: anywhere;
  -webkit-user-select: all;
  user-select: all;
}
.email-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--sp-3);
  margin-top: var(--sp-5);
}
.email-hint {
  margin-top: var(--sp-4);
  padding-inline-start: var(--sp-4);
  border-inline-start: 2px solid var(--accent-line);
  color: var(--text-3);
  font-size: var(--fs-body-sm);
  max-width: 60ch;
}
.email-expect {
  margin-top: var(--sp-4);
  color: var(--text-2);
  font-size: var(--fs-body-sm);
}

/* Address rows (billing@ / business@ / hello@) */
.addr-list {
  display: grid;
  gap: var(--sp-3);
  margin-top: var(--sp-5);
  max-width: 46rem;
}
.addr-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--sp-2) var(--sp-4);
  padding: var(--sp-3) var(--sp-4);
  background: var(--surface-1);
  border: 1px solid var(--line-1);
  border-radius: var(--radius-md);
}
.addr-role {
  flex: 1 1 12rem;
  color: var(--text-3);
  font-size: var(--fs-body-sm);
}
.addr-mail {
  font: 600 var(--fs-body-sm) / 1.5 var(--font-mono);
  color: var(--text-1);
  text-decoration: none;
  overflow-wrap: anywhere;
}
.addr-mail:hover,
.addr-mail:focus-visible { color: var(--accent-bright); text-decoration: underline; }

/* Contact page section spacing (cards reuse utility.css .contact-card) */
.contact-block { margin-top: var(--sp-8); }
.contact-block:first-child { margin-top: 0; }
.contact-block > h2 { font-size: var(--fs-h3); }
.contact-block > p { margin-top: var(--sp-4); max-width: 70ch; color: var(--text-2); }
.contact-block .legal-note { margin-top: var(--sp-4); }

.contact-cards {
  display: grid;
  gap: var(--sp-4);
  margin-top: var(--sp-5);
}
@media (min-width: 48em) {
  .contact-cards { grid-template-columns: repeat(2, 1fr); }
}
.contact-card h3 { font-size: var(--fs-h4); }

/* --------------------------------------------------------------------------
   Doc tables — /compliance subprocessors + /cookies storage keys
   -------------------------------------------------------------------------- */
.doc-table-wrap {
  margin-top: var(--sp-4);
  overflow-x: auto;
  border: 1px solid var(--line-1);
  border-radius: var(--radius-md);
  background: var(--surface-1);
}
.doc-table {
  width: 100%;
  border-collapse: collapse;
  font-size: var(--fs-body-sm);
}
.doc-table caption {
  padding: var(--sp-3) var(--sp-4);
  text-align: start;
  color: var(--text-3);
  font-size: var(--fs-micro);
  border-bottom: 1px solid var(--line-1);
}
.doc-table th {
  text-align: start;
  font: 700 var(--fs-micro) / 1.5 var(--font-mono);
  letter-spacing: var(--track-micro);
  text-transform: uppercase;
  color: var(--text-3);
}
.doc-table th,
.doc-table td {
  padding: var(--sp-3) var(--sp-4);
  border-bottom: 1px solid var(--line-0);
  vertical-align: top;
}
.doc-table tbody tr:last-child th,
.doc-table tbody tr:last-child td { border-bottom: 0; }
.doc-table td { color: var(--text-2); }
.doc-table td code { white-space: nowrap; }

/* --------------------------------------------------------------------------
   Print — controls are interactive chrome, not document content
   -------------------------------------------------------------------------- */
@media print {
  .email-copy,
  .email-copy-lg { display: none; }
  .doc-table-wrap { border-color: #ccc; background: none; }
  .doc-table th, .doc-table td { border-color: #ccc; color: #111; }
}