/* ============================================================
   RIVETDATA — marketing-site additions (rivet-data.com only)
   Loaded right after styles.css on the public pages. styles.css,
   main.js and assets/ are shared with the Console bundle
   (scripts/build-console.sh), so marketing-only rules live here
   and never reach console.rivet-data.com.
   ============================================================ */

/* ---------- Free-review form: consent link + inline send error ---------- */
#review-form .check label a { color: var(--t2); border-bottom: 1px solid var(--line-2); }
.form__error { font-size: 13.5px; line-height: 1.5; color: #E5674B; }
.form__error a { color: inherit; border-bottom: 1px solid currentColor; }

/* ---------- FAQ (native details/summary) ---------- */
.faq { border: 1px solid var(--line); border-radius: var(--r3); background: var(--bg-1); overflow: hidden; }
.faq__item { border-bottom: 1px solid var(--line); }
.faq__item:last-child { border-bottom: 0; }
.faq__item summary { display: flex; align-items: baseline; justify-content: space-between; gap: 18px; padding: clamp(16px,1.8vw,22px) clamp(20px,2.2vw,28px); cursor: pointer; list-style: none; font-size: 1.02rem; font-weight: 600; letter-spacing: -0.02em; color: var(--t1); transition: background 0.25s; }
.faq__item summary::-webkit-details-marker { display: none; }
.faq__item summary::after { content: "+"; flex: none; font-family: var(--mono); font-weight: 400; color: var(--acc); }
.faq__item[open] summary::after { content: "\2013"; }
.faq__item summary:hover { background: var(--hover); }
.faq__a { padding: 0 clamp(20px,2.2vw,28px) clamp(18px,2vw,24px); }
.faq__a p { font-size: 14.5px; color: var(--t3); line-height: 1.65; max-width: 72ch; }

/* ---------- Green buttons: white text (owner request, 2026-10-15) ----------
   White on the light-theme emerald (#0E9E67) is only 3.4:1 and on the dark-theme
   emerald (#3FCF8E) 2.0:1, both below WCAG AA (4.5:1) for button-size text. So the
   button uses the palette's deeper emerald (#0B8657, already the light-theme hover
   shade): white on it is 4.6:1. Hover goes deeper still (#08744B, 5.8:1).
   Same in both themes. Lives here, not in styles.css, because styles.css also ships
   in the Console bundle. */
.btn--primary, .btn--glow { background: #0B8657; border-color: #0B8657; color: #FFFFFF; }
.btn--primary:hover, .btn--glow:hover { background: #08744B; border-color: #08744B; color: #FFFFFF; }

/* ---------- Free-review form: optional contract upload ---------- */
.field__opt { margin-left: 6px; font-weight: 400; font-size: 12.5px; color: var(--t4); }
.field__hint { display: block; margin-top: 6px; font-size: 12.5px; line-height: 1.5; color: var(--t3); }
.field input[type="file"] { padding: 9px 10px; cursor: pointer; color: var(--t2); }
.field input[type="file"]::file-selector-button {
  margin-right: 12px; padding: 7px 12px; border: 1px solid var(--line-2); border-radius: var(--r1);
  background: var(--panel); color: var(--t1); font: inherit; font-size: 13.5px; cursor: pointer;
}
.field input[type="file"]::file-selector-button:hover { border-color: var(--acc); }
.upload__list { list-style: none; margin: 8px 0 0; padding: 0; display: grid; gap: 4px; font-size: 13px; color: var(--t2); }
.upload__list:empty { display: none; }
.upload__list li::before { content: "\2713"; margin-right: 8px; color: var(--acc); }
.upload__list li.is-bad { color: #E5674B; }
.upload__list li.is-bad::before { content: "\00D7"; color: #E5674B; }

/* ---------- Mobile menu (≤900px): the CTA keeps its button styling ----------
   styles.css styles every `.mobile-menu a` as a plain menu link (dark text, 4px side
   padding, display:block, a divider line), and that rule outranks `.btn`. So the green
   "Free contract review" button in the dropdown rendered as a cramped, left-aligned link
   with black text. Restored here; styles.css is shared with the Console. */
@media (max-width: 900px) {
  .mobile-menu a.btn {
    display: flex; align-items: center; justify-content: center; gap: 8px;
    margin-top: 14px; padding: 13px 16px;
    border: 1px solid #0B8657; border-radius: var(--r2);
    background: #0B8657; color: #FFFFFF; font-size: 15px; font-weight: 600;
  }
  .mobile-menu a.btn:hover, .mobile-menu a.btn:focus-visible { background: #08744B; border-color: #08744B; color: #FFFFFF; }
  .mobile-menu a[aria-current="page"]:not(.btn) { color: var(--acc); }
  /* iOS zooms the page when a form field's text is under 16px; keep fields at 16 on phones. */
  .field input, .field select, .field textarea { font-size: 16px; }
}
