/* =====================================================================
   ReachIQ — Engagement layer: cookie consent banner + popup lead-capture.
   Uses base.css design tokens (coral #FF4848, warm paper, Inter Tight/Inter).
   Base styles are new UI so they apply at all widths; only the mobile
   bottom-sheet overrides live under max-width media queries (< 1511px ref).
   z-index band: consent banner 1000, popup overlay 1400, modal 1401.
   ===================================================================== */

/* ---------------------------------------------------------------------
   Cookie consent banner (bottom-left card)
   ------------------------------------------------------------------- */
.riq-cc {
  position: fixed;
  left: clamp(16px, 3vw, 28px);
  bottom: clamp(16px, 3vw, 28px);
  width: min(400px, calc(100vw - 32px));
  z-index: 1000;
}
.riq-cc[hidden] { display: none; }
.riq-cc-card {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r-2xl);
  box-shadow: var(--sh-4);
  padding: 24px;
  transform: translateY(16px);
  opacity: 0;
  transition: transform .3s cubic-bezier(.16,1,.3,1), opacity .3s ease;
}
.riq-cc.is-show .riq-cc-card { transform: none; opacity: 1; }
.riq-cc-h {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 18px;
  line-height: 1.2;
  letter-spacing: -.01em;
  color: var(--ink);
  margin: 0 0 8px;
}
.riq-cc-p {
  font-family: var(--font-body);
  font-size: 13.5px;
  line-height: 1.5;
  color: var(--ink-2);
  margin: 0 0 16px;
}
.riq-cc-p a { color: var(--coral); text-decoration: underline; }
.riq-cc-actions { display: flex; gap: 8px; flex-wrap: nowrap; }
.riq-cc-actions .btn { flex: 1; min-width: 0; white-space: nowrap; }

/* persistent footer "Cookie preferences" link */
.riq-cc-open { cursor: pointer; }
a.riq-cc-open-fixed {
  position: fixed;
  left: 16px; bottom: 16px;
  z-index: 999;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 8px 14px;
  font-size: 12px;
  color: var(--ink-2);
  box-shadow: var(--sh-2);
}

/* ---------------------------------------------------------------------
   Cookie disclosure table (ISSUE-157) rendered into /cookie-policy/
   ------------------------------------------------------------------- */
.ri-cookie-table-wrap { overflow-x: auto; margin: 16px 0 24px; }
.ri-cookie-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13.5px;
  min-width: 640px;
}
.ri-cookie-table th,
.ri-cookie-table td {
  text-align: left;
  padding: 10px 12px;
  border-bottom: 1px solid var(--line);
  vertical-align: top;
}
.ri-cookie-table thead th {
  font-family: var(--font-display);
  font-weight: 600;
  color: var(--ink);
  border-bottom: 2px solid var(--line);
}
.ri-cookie-table td { color: var(--ink-2); }
.ri-cookie-table code {
  font-family: var(--font-mono);
  font-size: 12.5px;
  color: var(--ink);
}

/* ---------------------------------------------------------------------
   CCPA request form (do-not-sell page shortcode)
   ------------------------------------------------------------------- */
.riq-ccpa-form { display: flex; flex-direction: column; gap: 14px; max-width: 560px; margin: 20px 0; }
.riq-ccpa-row { display: flex; gap: 14px; }
.riq-ccpa-form label {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 6px;
  font-size: 13px;
  font-weight: 600;
  color: var(--ink);
}
.riq-ccpa-form .req { color: var(--coral); }
.riq-ccpa-form input,
.riq-ccpa-form select,
.riq-ccpa-form textarea {
  font: inherit;
  font-size: 14px;
  font-weight: 400;
  color: var(--ink);
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  padding: 12px 14px;
}
.riq-ccpa-form input:focus,
.riq-ccpa-form select:focus,
.riq-ccpa-form textarea:focus {
  outline: none;
  border-color: var(--coral);
  box-shadow: 0 0 0 3px var(--coral-soft);
}
.riq-ccpa-form .btn { align-self: flex-start; }
.riq-ccpa-msg { font-size: 13px; margin: 0; }
.riq-ccpa-msg.ok { color: var(--good); }
.riq-ccpa-msg.err { color: var(--danger); }

/* ---------------------------------------------------------------------
   Popup modal (light ReachIQ brand)
   ------------------------------------------------------------------- */
.riq-pop {
  position: fixed;
  inset: 0;
  z-index: 1400;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  background: rgba(24, 24, 28, .55);
  opacity: 0;
  transition: opacity .35s ease;
}
.riq-pop[hidden] { display: none; }
.riq-pop.is-open { opacity: 1; }
.riq-modal {
  position: relative;
  z-index: 1401;
  width: 720px;
  max-width: min(720px, calc(100vw - 32px));
  max-height: 94vh;
  overflow: auto;
  background: var(--paper);
  border-radius: var(--r-2xl);
  box-shadow: var(--sh-4);
  display: flex;
  transform: translateY(24px) scale(.97);
  opacity: 0;
  transition: transform .5s cubic-bezier(.16,1,.3,1), opacity .35s ease;
}
.riq-pop.is-open .riq-modal { transform: none; opacity: 1; }
.riq-x {
  position: absolute;
  top: 14px; right: 14px;
  z-index: 3;
  width: 32px; height: 32px;
  border-radius: 50%;
  border: 1px solid var(--line);
  background: var(--paper);
  color: var(--ink-4);
  font-size: 14px;
  line-height: 1;
  cursor: pointer;
  display: flex; align-items: center; justify-content: center;
}
.riq-x:hover { color: var(--ink); border-color: var(--ink-4); }

.riq-pic {
  flex: 0 0 42%;
  position: relative;
  background: var(--paper-warm);
}
.riq-pic picture, .riq-pic img {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover; display: block;
}
.riq-seam {
  position: absolute;
  top: 0; right: 0; bottom: 0;
  width: 3px;
  background: var(--coral);
}

.riq-bd { flex: 1; min-width: 0; padding: 36px 38px 30px; }
.riq-ey {
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--coral);
  margin: 0;
}
.riq-h {
  font-family: var(--font-display);
  font-size: 23px;
  font-weight: 700;
  line-height: 1.15;
  letter-spacing: -.02em;
  color: var(--ink);
  margin: 11px 0 0;
  text-wrap: balance;
}
.riq-sub {
  font-size: 14px;
  line-height: 1.55;
  color: var(--ink-2);
  margin: 11px 0 0;
}

.riq-form { margin-top: 18px; display: flex; flex-direction: column; gap: 11px; }
.riq-step { display: flex; flex-direction: column; gap: 11px; }
.riq-step[hidden] { display: none; }
.riq-steplbl {
  font-family: var(--font-mono);
  font-size: 10.5px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--ink-4);
}
.riq-row { display: flex; gap: 11px; }
.riq-in {
  width: 100%;
  min-width: 0;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  padding: 12px 14px;
  font: inherit;
  font-size: 14px;
  color: var(--ink);
  transition: border-color .15s, box-shadow .15s;
}
.riq-in::placeholder { color: var(--ink-4); }
.riq-in:focus {
  outline: none;
  border-color: var(--coral);
  box-shadow: 0 0 0 3px var(--coral-soft);
}
select.riq-in {
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%2397A0AF' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 14px center;
  padding-right: 36px;
}
.riq-qs { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.riq-q { display: flex; flex-direction: column; gap: 6px; }
.riq-q:last-child:nth-child(odd) { grid-column: 1 / -1; }
.riq-ql { font-size: 12px; font-weight: 600; color: var(--ink-2); }
.riq-btn {
  margin-top: 4px;
  background: var(--coral);
  color: #fff;
  border: 0;
  border-radius: 999px;
  padding: 14px 26px;
  font: inherit;
  font-weight: 700;
  font-size: 15px;
  cursor: pointer;
  width: 100%;
  transition: background .18s, transform .12s, box-shadow .2s;
  box-shadow: var(--sh-coral);
}
.riq-btn:hover { background: var(--coral-hover); transform: translateY(-1px); }
.riq-btn:active { transform: translateY(0); }
.riq-btn:disabled { opacity: .6; cursor: default; transform: none; box-shadow: none; }
.riq-agree {
  display: flex;
  gap: 9px;
  align-items: flex-start;
  margin-top: 12px;
  font-size: 12px;
  line-height: 1.45;
  color: var(--ink-4);
  cursor: pointer;
}
.riq-agree input { flex: none; width: 16px; height: 16px; margin-top: 1px; accent-color: var(--coral); }
.riq-agree a { color: var(--ink-2); text-decoration: underline; }
.riq-nothx, .riq-back {
  background: none;
  border: 0;
  color: var(--ink-4);
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: .04em;
  text-decoration: underline;
  cursor: pointer;
  margin: 10px auto 0;
  padding: 0;
  display: block;
}
.riq-nothx:hover, .riq-back:hover { color: var(--ink-2); }
.riq-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.riq-msg { font-size: 12.5px; line-height: 1.45; margin: 2px 0 0; }
.riq-msg.err { color: var(--danger); }
.riq-msg.ok { color: var(--good); }
.riq-msg[hidden] { display: none; }

.riq-success { text-align: center; padding: 8px 0 4px; }
.riq-success[hidden] { display: none; }
.riq-tick {
  width: 46px; height: 46px;
  border-radius: 50%;
  background: var(--coral-soft);
  color: var(--coral);
  display: flex; align-items: center; justify-content: center;
  font-size: 22px;
  margin: 0 auto 12px;
}
.riq-success p { font-size: 15px; color: var(--ink); margin: 0; line-height: 1.5; }

/* ---------------------------------------------------------------------
   Responsive — scoped under the 1512px reference width. Mobile bottom-sheet.
   ------------------------------------------------------------------- */
@media (max-width: 1511px) {
  @media (max-width: 600px) {
    /* footer links row gains a 5th link (Cookie preferences); let it wrap */
    footer .foot-bottom .links { flex-wrap: wrap; row-gap: 8px; }

    /* consent banner -> full-width bottom sheet */
    .riq-cc {
      left: 0; right: 0; bottom: 0;
      width: 100%;
    }
    .riq-cc-card {
      border-radius: var(--r-2xl) var(--r-2xl) 0 0;
      border-left: 0; border-right: 0; border-bottom: 0;
    }

    /* popup -> bottom sheet, stacked panels */
    .riq-pop { padding: 0; align-items: flex-end; }
    .riq-modal {
      flex-direction: column;
      width: 100%;
      max-width: 100%;
      max-height: 92vh;
      border-radius: var(--r-2xl) var(--r-2xl) 0 0;
      transform: translateY(100%);
    }
    .riq-pop.is-open .riq-modal { transform: none; }
    .riq-pic { flex-basis: auto; height: 128px; }
    .riq-seam { top: auto; left: 0; right: 0; bottom: 0; width: auto; height: 3px; }
    .riq-bd { padding: 26px 24px 26px; }
    .riq-h { font-size: 20px; }
    .riq-qs { grid-template-columns: 1fr; }
    .riq-row { flex-direction: column; }
  }
}

@media (prefers-reduced-motion: reduce) {
  .riq-cc-card, .riq-pop, .riq-modal, .riq-btn { transition: none; }
}