/* /report - email-gated PDF. Field BELOW visible value. shared.css = chrome. */

/* ---- value first ---------------------------------------------------------- */
.report-value { background: var(--color-surface-default); padding-block: var(--bdri-space-8); }
@media (min-width: 760px) { .report-value { padding-block: var(--bdri-space-9); } }
.report-contents { list-style: none; padding: 0; margin: 0; display: grid; gap: var(--bdri-space-4); }
.report-item {
  display: grid; grid-template-columns: auto 1fr; grid-template-areas: "n t" "n d";
  column-gap: var(--bdri-space-4); row-gap: var(--bdri-space-1);
  background: var(--color-surface-subtle); border: var(--bw-divider) solid var(--color-border-subtle);
  border-left: var(--bw-accent) solid var(--color-accent-primary);
  border-radius: var(--radius-card); padding: var(--bdri-space-5);
}
.report-item__n { grid-area: n; align-self: center; font-family: var(--bdri-text-display-family); font-size: clamp(1.75rem, 3.5vw, 2.5rem); font-weight: var(--bdri-text-display-weight); line-height: 1; color: var(--color-accent-primary); }
.report-item__t { grid-area: t; font-size: var(--bdri-size-body-lg); font-weight: var(--bdri-weight-semibold); }
.report-item__d { grid-area: d; font-size: var(--bdri-size-small); color: var(--color-text-muted); line-height: var(--bdri-lh-relaxed); }
@media (min-width: 760px) { .report-contents { grid-template-columns: repeat(2, minmax(0,1fr)); } }

/* ---- the gate (dark identity zone - the conversion moment) ---------------- */
.gate {
  position: relative; overflow: hidden;
  background:
    radial-gradient(90% 120% at 8% 100%, color-mix(in srgb, var(--color-accent-primary) 16%, transparent) 0%, transparent 60%),
    var(--color-surface-accent);
  color: var(--color-text-inverted);
  --color-accent-primary: var(--bdri-color-aquamarine-bright);
  --color-text-default: #ffffff; --color-text-subtle: #F1F6F7; --color-text-muted: #828E95;
  border-top: var(--bw-accent) solid var(--bdri-color-aquamarine-bright);
}
.gate__inner { display: grid; gap: var(--bdri-space-7); padding-block: var(--bdri-space-8); align-items: center; }
.gate__title { font-family: var(--bdri-text-h2-family); font-size: var(--bdri-text-h2-size); font-weight: var(--bdri-text-h2-weight); line-height: var(--bdri-text-h2-lh); letter-spacing: var(--bdri-text-h2-tracking); color: #fff; margin-bottom: var(--bdri-space-3); text-wrap: balance; }
.gate__body { color: var(--bdri-color-cloud); line-height: var(--bdri-lh-loose); max-width: var(--measure-narrow); }
@media (min-width: 860px) { .gate__inner { grid-template-columns: minmax(0,1fr) minmax(340px, 0.85fr); gap: var(--bdri-space-8); padding-block: var(--bdri-space-9); } }

/* ---- signup form (same shape as /score) ----------------------------------- */
.signup { display: grid; gap: var(--bdri-space-4); background: color-mix(in srgb, #ffffff 6%, transparent); border: var(--bw-divider) solid color-mix(in srgb, #ffffff 18%, transparent); border-radius: var(--radius-modal); padding: var(--bdri-space-6); }
.signup__hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.signup__field { display: grid; gap: var(--bdri-space-2); }
.signup__label { font-family: var(--bdri-font-mono); font-size: var(--bdri-size-caption); letter-spacing: 0.06em; text-transform: uppercase; color: var(--color-text-muted); }
.signup__input {
  min-height: 48px; padding: 0 var(--bdri-space-4);
  border: var(--bw-input-focus) solid color-mix(in srgb, #ffffff 24%, transparent);
  border-radius: var(--radius-input); background: color-mix(in srgb, #ffffff 8%, transparent);
  color: #fff; font-family: var(--bdri-font-body); font-size: var(--bdri-size-body);
}
.signup__input::placeholder { color: color-mix(in srgb, #ffffff 50%, transparent); }
.signup__input:focus-visible { outline: var(--bw-input-focus) solid var(--bdri-color-aquamarine-bright); outline-offset: 2px; }
.signup__turnstile[data-turnstile]:empty { display: none; }
.signup__submit { width: 100%; background: var(--bdri-color-aquamarine-bright); color: var(--bdri-color-ink); border-color: var(--bdri-color-aquamarine-bright); }
.signup__fine { font-size: var(--bdri-size-small); color: var(--bdri-color-cloud); line-height: var(--bdri-lh-relaxed); }
.signup__fine a { color: var(--bdri-color-aquamarine-bright); }

@media (max-width: 640px) { .section-title, .gate__title { font-size: var(--bdri-size-h3); } }
