/*
 * Proofcast — Global block styles
 * Covers all blocks except search and verdict which have their own stylesheets.
 * All colors use CSS custom properties — no hardcoded hex values for presentation.
 */

/* ── CSS custom properties ────────────────────────────────────────── */
:root {
  --pf-color-a:         #166534;
  --pf-color-a-bg:      #f0fdf4;
  --pf-color-a-border:  #86efac;
  --pf-color-a-letter:  linear-gradient(160deg,#4ade80,#86efac 50%,#4ade80);

  --pf-color-f:         #991b1b;
  --pf-color-f-bg:      #fef2f2;
  --pf-color-f-border:  #fca5a5;

  --pf-color-c:         #b45309;
  --pf-color-c-bg:      #fffbeb;
  --pf-color-d:         #c2410c;
  --pf-color-d-bg:      #fff7ed;

  --pf-radius:          var(--wp--custom--border-radius--large, 20px);
  --pf-radius-md:       var(--wp--custom--border-radius--medium, 14px);
  --pf-radius-sm:       var(--wp--custom--border-radius--small, 8px);
  --pf-shadow:          0 2px 4px rgba(0,0,0,.04), 0 20px 60px rgba(0,0,0,.08);
}

/* ── Perspectives ─────────────────────────────────────────────────── */
.proofcast-perspectives {
  display: grid;
  grid-template-columns: 1fr 1fr;
  background: var(--wp--preset--color--base, #fff);
  border-top: 1px solid var(--wp--preset--color--tertiary, #e8e8e8);
}
.proofcast-perspectives__col {
  padding: 1.5rem 2rem;
}
.proofcast-perspectives__col + .proofcast-perspectives__col {
  border-left: 1px solid var(--wp--preset--color--tertiary, #e8e8e8);
}
.proofcast-perspectives__label {
  font-family: var(--wp--preset--font-family--monospace, monospace);
  font-size: 0.5625rem;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--wp--preset--color--contrast-3, #aaa);
  margin-bottom: 0.625rem;
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.proofcast-perspectives__label::before {
  content: '';
  display: block;
  width: 1rem;
  height: 1px;
  background: var(--wp--preset--color--tertiary, #e8e8e8);
}
.proofcast-perspectives__recipient-text,
.proofcast-perspectives__owner-text {
  font-size: var(--wp--preset--font-size--small, 0.875rem);
  font-weight: 300;
  color: var(--wp--preset--color--contrast-2, #555);
  line-height: 1.8;
}
@media (max-width: 640px) {
  .proofcast-perspectives { grid-template-columns: 1fr; }
  .proofcast-perspectives__col + .proofcast-perspectives__col { border-left: none; border-top: 1px solid var(--wp--preset--color--tertiary, #e8e8e8); }
}

/* ── Next step ────────────────────────────────────────────────────── */
.proofcast-next-step {
  background: var(--wp--preset--color--base-2, #f8f6f2);
  border-top: 1px solid var(--wp--preset--color--tertiary, #e8e8e8);
  padding: 0.875rem 2rem;
  display: flex;
  align-items: baseline;
  gap: 0.75rem;
  font-size: var(--wp--preset--font-size--small, 0.875rem);
  font-weight: 300;
  color: var(--wp--preset--color--contrast-2, #555);
  line-height: 1.6;
}
.proofcast-next-step__cta {
  font-family: var(--wp--preset--font-family--monospace, monospace);
  font-size: 0.625rem;
  font-weight: 500;
  color: var(--wp--preset--color--primary, #4682B4);
  white-space: nowrap;
  flex-shrink: 0;
  letter-spacing: 0.02em;
}

/* ── Maturity ─────────────────────────────────────────────────────── */
.proofcast-maturity {
  background: var(--wp--preset--color--base-2, #f8f6f2);
  border-top: 1px solid var(--wp--preset--color--tertiary, #e8e8e8);
  padding: 1.125rem 2rem;
}
.proofcast-maturity__header {
  display: flex;
  align-items: flex-start;
  gap: 1.125rem;
  margin-bottom: 0.875rem;
}
.proofcast-maturity__badge {
  flex-shrink: 0;
  width: 3rem;
  height: 3rem;
  border-radius: var(--pf-radius-sm);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.125rem;
  background: var(--wp--preset--color--base, #fff);
  border: 1px solid var(--wp--preset--color--tertiary, #e8e8e8);
  box-shadow: 0 1px 4px rgba(0,0,0,.05);
}
.proofcast-maturity__letter {
  font-family: var(--wp--preset--font-family--serif, Georgia, serif);
  font-size: 1.5rem;
  font-weight: 700;
  font-style: italic;
  line-height: 1;
}
.proofcast-maturity__letter.is-mat-a { color: var(--pf-color-a); }
.proofcast-maturity__letter.is-mat-c { color: var(--pf-color-c); }
.proofcast-maturity__letter.is-mat-d { color: var(--pf-color-d); }
.proofcast-maturity__letter.is-mat-f { color: var(--pf-color-f); }
.proofcast-maturity__tag {
  font-family: var(--wp--preset--font-family--monospace, monospace);
  font-size: 0.4375rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--wp--preset--color--contrast-3, #aaa);
}
.proofcast-maturity__sep {
  width: 1px;
  background: var(--wp--preset--color--tertiary, #e8e8e8);
  align-self: stretch;
  flex-shrink: 0;
}
.proofcast-maturity__body { flex: 1; }
.proofcast-maturity__label {
  font-family: var(--wp--preset--font-family--monospace, monospace);
  font-size: 0.5rem;
  letter-spacing: 0.125em;
  text-transform: uppercase;
  color: var(--wp--preset--color--contrast-3, #aaa);
  margin-bottom: 0.3rem;
}
.proofcast-maturity__doing {
  font-size: var(--wp--preset--font-size--small, 0.8125rem);
  font-weight: 300;
  color: var(--wp--preset--color--contrast-2, #555);
  line-height: 1.6;
}
.proofcast-maturity__dims {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 0.25rem;
}
.proofcast-maturity__dim {
  padding: 0.4375rem 0.5625rem;
  background: var(--wp--preset--color--base, #fff);
  border: 1px solid var(--wp--preset--color--tertiary, #e8e8e8);
  border-radius: 0.375rem;
  display: flex;
  flex-direction: column;
  gap: 0.125rem;
}
.proofcast-maturity__dim-name {
  font-family: var(--wp--preset--font-family--monospace, monospace);
  font-size: 0.4375rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--wp--preset--color--contrast-3, #aaa);
}
.proofcast-maturity__dim-val {
  font-size: 0.625rem;
  font-weight: 300;
  color: var(--wp--preset--color--contrast-2, #555);
  line-height: 1.4;
}
@media (max-width: 768px) {
  .proofcast-maturity__dims { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 480px) {
  .proofcast-maturity__dims { grid-template-columns: repeat(2, 1fr); }
}

/* ── Trust table ──────────────────────────────────────────────────── */
.proofcast-trust-table-wrap {
  overflow-x: auto;
}
.proofcast-trust-table {
  width: 100%;
  border-collapse: collapse;
  background: var(--wp--preset--color--base, #fff);
  border: 1px solid var(--wp--preset--color--tertiary, #e8e8e8);
  border-radius: var(--pf-radius-md);
  overflow: hidden;
}
.proofcast-trust-table thead th {
  font-family: var(--wp--preset--font-family--monospace, monospace);
  font-size: 0.5625rem;
  letter-spacing: 0.125em;
  text-transform: uppercase;
  color: var(--wp--preset--color--contrast-3, #aaa);
  padding: 0.8125rem 1.25rem;
  text-align: left;
  background: var(--wp--preset--color--base-2, #f8f6f2);
  border-bottom: 1px solid var(--wp--preset--color--tertiary, #e8e8e8);
  font-weight: 400;
}
.proofcast-trust-table thead th.proofcast-trust-table__grade-col { text-align: center; }
.proofcast-trust-table tbody tr { border-bottom: 1px solid var(--wp--preset--color--tertiary, #e8e8e8); transition: background .12s; }
.proofcast-trust-table tbody tr:last-child { border-bottom: none; }
.proofcast-trust-table tbody tr:hover { background: var(--wp--preset--color--base-2, #f8f6f2); }
.proofcast-trust-table td { padding: 1.125rem 1.25rem; vertical-align: middle; }
.proofcast-trust-table__posture-name { display: block; font-size: 0.875rem; font-weight: 500; color: var(--wp--preset--color--contrast, #111); margin-bottom: 0.25rem; }
.proofcast-trust-table__posture-ref  { display: block; font-family: var(--wp--preset--font-family--monospace, monospace); font-size: 0.625rem; color: var(--wp--preset--color--contrast-3, #aaa); }
.proofcast-trust-table__grade-col    { text-align: center; }

/* Grade letters in table — primary large, maturity small */
.proofcast-trust-table__etpg {
  font-family: var(--wp--preset--font-family--serif, Georgia, serif);
  font-size: 2.25rem;
  font-weight: 700;
  font-style: italic;
  line-height: 1;
  display: block;
  text-align: center;
  color: transparent;
  -webkit-background-clip: text;
  background-clip: text;
}
.proofcast-trust-table__etpg.is-etpg-a { background-image: linear-gradient(135deg, #14532d, #16a34a); }
.proofcast-trust-table__etpg.is-etpg-f { background-image: linear-gradient(135deg, #7f1d1d, #dc2626); }

.proofcast-trust-table__mat {
  font-family: var(--wp--preset--font-family--serif, Georgia, serif);
  font-size: 1.25rem;
  font-weight: 400;
  font-style: italic;
  line-height: 1;
  display: block;
  text-align: center;
  color: var(--wp--preset--color--contrast-3, #aaa);
}

.proofcast-trust-table__meaning { font-size: 0.8125rem; font-weight: 300; color: var(--wp--preset--color--contrast-2, #555); line-height: 1.6; max-width: 15rem; }

.proofcast-trust-table__verdict {
  display: inline-block;
  padding: 0.3rem 0.8rem;
  border-radius: 20px;
  font-family: var(--wp--preset--font-family--monospace, monospace);
  font-size: 0.625rem;
  font-weight: 500;
  white-space: nowrap;
}
.proofcast-trust-table__verdict--reject     { background: var(--pf-color-a-bg); color: var(--pf-color-a); }
.proofcast-trust-table__verdict--quarantine { background: var(--pf-color-c-bg); color: var(--pf-color-c); }
.proofcast-trust-table__verdict--none       { background: var(--pf-color-d-bg); color: var(--pf-color-d); }
.proofcast-trust-table__verdict--no_dmarc   { background: var(--pf-color-f-bg); color: var(--pf-color-f); }

.proofcast-trust-table__note {
  padding: 0.75rem 1.25rem;
  background: var(--wp--preset--color--base-2, #f8f6f2);
  border-top: 1px solid var(--wp--preset--color--tertiary, #e8e8e8);
  font-size: 0.75rem;
  font-weight: 300;
  color: var(--wp--preset--color--contrast-3, #aaa);
  line-height: 1.65;
}
.proofcast-trust-table__note strong { font-weight: 500; color: var(--wp--preset--color--contrast-2, #555); }

/* ── Live board ───────────────────────────────────────────────────── */
.proofcast-live-board__header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  margin-bottom: 1.5rem;
  flex-wrap: wrap;
  gap: 0.75rem;
}
.proofcast-live-board__headline {
  font-family: var(--wp--preset--font-family--serif, Georgia, serif);
  font-size: var(--wp--preset--font-size--x-large, 1.75rem);
  font-weight: 400;
  letter-spacing: -0.03em;
}
.proofcast-live-board__live-badge {
  display: flex;
  align-items: center;
  gap: 0.375rem;
  font-family: var(--wp--preset--font-family--monospace, monospace);
  font-size: 0.625rem;
  color: var(--wp--preset--color--primary, #4682B4);
  padding: 0.375rem 0.875rem;
  border-radius: 20px;
  background: rgba(70,130,180,.06);
  border: 1px solid rgba(70,130,180,.15);
}
.proofcast-live-board__live-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #22c55e;
  flex-shrink: 0;
}
.proofcast-live-board__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.5rem;
}
.proofcast-live-board__row {
  background: var(--wp--preset--color--base, #fff);
  border: 1px solid var(--wp--preset--color--tertiary, #e8e8e8);
  border-radius: 0.625rem;
  padding: 0.875rem 1.125rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  transition: box-shadow .15s;
}
.proofcast-live-board__row:hover { box-shadow: var(--pf-shadow); }
.proofcast-live-board__domain  { font-family: var(--wp--preset--font-family--monospace, monospace); font-size: 0.8125rem; font-weight: 300; color: var(--wp--preset--color--contrast, #111); margin-bottom: 0.25rem; }
.proofcast-live-board__verdict { font-family: var(--wp--preset--font-family--serif, Georgia, serif); font-size: 0.8125rem; font-style: italic; color: var(--wp--preset--color--contrast-2, #555); }
.proofcast-live-board__grade  { font-family: var(--wp--preset--font-family--monospace, monospace); font-size: 0.625rem; font-weight: 500; padding: 0.3rem 0.7rem; border-radius: 20px; white-space: nowrap; flex-shrink: 0; }
@media (max-width: 640px) {
  .proofcast-live-board__grid { grid-template-columns: 1fr; }
}

/* ── Compare ──────────────────────────────────────────────────────── */
.proofcast-compare__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.25rem;
}
.proofcast-compare__card {
  border: 1px solid var(--wp--preset--color--tertiary, #e8e8e8);
  border-radius: var(--pf-radius-md);
  padding: 1.75rem;
  background: var(--wp--preset--color--base, #fff);
}
.proofcast-compare__card--etpg {
  border-color: var(--wp--preset--color--primary, #4682B4);
  background: linear-gradient(135deg, var(--wp--preset--color--base, #fff), rgba(70,130,180,.04));
}
.proofcast-compare__icon {
  width: 2.25rem;
  height: 2.25rem;
  border-radius: 0.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 0.875rem;
  font-family: var(--wp--preset--font-family--serif, Georgia, serif);
  font-size: 1.25rem;
  font-weight: 700;
  background: linear-gradient(135deg, #052e16, #16a34a);
  color: #4ade80;
}
.proofcast-compare__card--maturity .proofcast-compare__icon {
  background: var(--wp--preset--color--base-2, #f8f6f2);
  border: 1px solid var(--wp--preset--color--tertiary, #e8e8e8);
  color: var(--wp--preset--color--contrast-2, #555);
  font-size: 0.75rem;
  font-family: var(--wp--preset--font-family--monospace, monospace);
  font-weight: 500;
}
.proofcast-compare__name { font-family: var(--wp--preset--font-family--monospace, monospace); font-size: 0.5rem; letter-spacing: 0.125em; text-transform: uppercase; color: var(--wp--preset--color--contrast-3, #aaa); margin-bottom: 0.5rem; }
.proofcast-compare__h3  { font-family: var(--wp--preset--font-family--serif, Georgia, serif); font-size: 1.125rem; font-weight: 400; color: var(--wp--preset--color--contrast, #111); margin-bottom: 0.625rem; line-height: 1.25; }
.proofcast-compare__body { font-size: 0.8125rem; font-weight: 300; color: var(--wp--preset--color--contrast-2, #555); line-height: 1.75; margin-bottom: 0.875rem; }
.proofcast-compare__for-label { font-family: var(--wp--preset--font-family--monospace, monospace); font-size: 0.5rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--wp--preset--color--contrast-3, #aaa); margin-bottom: 0.375rem; }
.proofcast-compare__uses { list-style: none; padding: 0; display: flex; flex-direction: column; gap: 0.3rem; }
.proofcast-compare__uses li { font-size: 0.8125rem; font-weight: 300; color: var(--wp--preset--color--contrast-2, #555); padding-left: 0.875rem; position: relative; line-height: 1.5; }
.proofcast-compare__uses li::before { content: '·'; position: absolute; left: 0; color: var(--wp--preset--color--primary, #4682B4); }
@media (max-width: 640px) {
  .proofcast-compare__grid { grid-template-columns: 1fr; }
}

/* ── Scenarios ────────────────────────────────────────────────────── */
.proofcast-scenarios__chips { display: flex; gap: 0.625rem; flex-wrap: wrap; margin-bottom: 1.5rem; }
.proofcast-scenarios__chip {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.625rem 1.125rem;
  border: 1.5px solid var(--wp--preset--color--tertiary, #e8e8e8);
  border-radius: 50px;
  background: var(--wp--preset--color--base, #fff);
  font-size: 0.8125rem;
  font-weight: 400;
  color: var(--wp--preset--color--contrast-2, #555);
  cursor: pointer;
  transition: all .15s;
  font-family: inherit;
}
.proofcast-scenarios__chip:hover,
.proofcast-scenarios__chip.is-active {
  border-color: var(--wp--preset--color--primary, #4682B4);
  color: var(--wp--preset--color--primary, #4682B4);
}
.proofcast-scenarios__chip-dot { width: 9px; height: 9px; border-radius: 50%; flex-shrink: 0; }
.proofcast-scenarios__panel { display: none; }
.proofcast-scenarios__panel.is-active {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0;
  background: var(--wp--preset--color--base, #fff);
  border: 1px solid var(--wp--preset--color--tertiary, #e8e8e8);
  border-radius: var(--pf-radius-md);
  overflow: hidden;
  box-shadow: var(--pf-shadow);
}
.proofcast-scenarios__panel-left { padding: 2.5rem; border-right: 1px solid var(--wp--preset--color--tertiary, #e8e8e8); display: flex; flex-direction: column; justify-content: center; }
.proofcast-scenarios__panel-right { padding: 2rem; background: var(--wp--preset--color--base-2, #f8f6f2); display: flex; align-items: center; justify-content: center; }
.proofcast-scenarios__panel-tag  { font-family: var(--wp--preset--font-family--monospace, monospace); font-size: 0.5625rem; letter-spacing: 0.125em; text-transform: uppercase; color: var(--wp--preset--color--contrast-3, #aaa); margin-bottom: 0.875rem; }
.proofcast-scenarios__panel-body { font-size: 0.875rem; font-weight: 300; color: var(--wp--preset--color--contrast-2, #555); line-height: 1.75; }

/* Mini verdict in scenarios */
.proofcast-scenarios__mini-verdict {
  width: 100%;
  border-radius: 0.75rem;
  overflow: hidden;
  border: 1px solid var(--wp--preset--color--tertiary, #e8e8e8);
  box-shadow: 0 2px 12px rgba(0,0,0,.06);
}
.proofcast-scenarios__mini-grade-col {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.25rem;
  padding: 1rem;
}
.proofcast-scenarios__mini-verdict { display: flex; }
.proofcast-scenarios__mini-verdict.is-grade-a .proofcast-scenarios__mini-grade-col { background: linear-gradient(160deg,#052e16,#0d3d20); }
.proofcast-scenarios__mini-verdict.is-grade-f .proofcast-scenarios__mini-grade-col { background: linear-gradient(160deg,#3b0707,#4d0d0d); }
.proofcast-scenarios__mini-letter { font-family: var(--wp--preset--font-family--serif, Georgia, serif); font-size: 2.5rem; font-weight: 700; line-height: 1; letter-spacing: -0.06em; }
.proofcast-scenarios__mini-verdict.is-grade-a .proofcast-scenarios__mini-letter { color: transparent; background: linear-gradient(160deg,#4ade80,#86efac); -webkit-background-clip: text; background-clip: text; }
.proofcast-scenarios__mini-verdict.is-grade-f .proofcast-scenarios__mini-letter { color: transparent; background: linear-gradient(160deg,#f87171,#fca5a5); -webkit-background-clip: text; background-clip: text; }
.proofcast-scenarios__mini-lbl { font-family: var(--wp--preset--font-family--monospace, monospace); font-size: 0.4375rem; letter-spacing: 0.1em; text-transform: uppercase; color: rgba(255,255,255,.25); }
.proofcast-scenarios__mini-body { flex: 1; padding: 1rem 1.125rem; display: flex; flex-direction: column; justify-content: center; }
.proofcast-scenarios__mini-verdict.is-grade-a .proofcast-scenarios__mini-body { background: linear-gradient(135deg,#0a3d1c,#0c4520); }
.proofcast-scenarios__mini-verdict.is-grade-f .proofcast-scenarios__mini-body { background: linear-gradient(135deg,#1f0606,#250808); }
.proofcast-scenarios__mini-posture { font-family: var(--wp--preset--font-family--serif, Georgia, serif); font-size: 0.875rem; font-weight: 400; color: rgba(255,255,255,.9); margin-bottom: 0.25rem; }
.proofcast-scenarios__mini-meaning { font-size: 0.6875rem; font-weight: 300; color: rgba(255,255,255,.45); line-height: 1.5; }
@media (max-width: 640px) {
  .proofcast-scenarios__panel.is-active { grid-template-columns: 1fr; }
  .proofcast-scenarios__panel-left { border-right: none; border-bottom: 1px solid var(--wp--preset--color--tertiary, #e8e8e8); }
}

/* ── How it works ─────────────────────────────────────────────────── */
.proofcast-how__steps { list-style: none; padding: 0; display: flex; flex-direction: column; }
.proofcast-how__step {
  display: flex;
  gap: 1.25rem;
  padding: 1.25rem 0;
  border-bottom: 1px solid var(--wp--preset--color--tertiary, #e8e8e8);
}
.proofcast-how__step:last-child { border-bottom: none; }
.proofcast-how__step-num {
  width: 2rem;
  height: 2rem;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--wp--preset--font-family--serif, Georgia, serif);
  font-size: 0.875rem;
  font-weight: 700;
  flex-shrink: 0;
  margin-top: 0.125rem;
  background: var(--wp--preset--color--base-2, #f8f6f2);
  border: 1px solid var(--wp--preset--color--tertiary, #e8e8e8);
  color: var(--wp--preset--color--contrast-2, #555);
}
.proofcast-how__step-title { display: block; font-size: 0.9375rem; font-weight: 500; color: var(--wp--preset--color--contrast, #111); margin-bottom: 0.25rem; }
.proofcast-how__step-desc  { font-size: 0.8125rem; font-weight: 300; color: var(--wp--preset--color--contrast-2, #555); line-height: 1.7; }

/* ── Features grid ────────────────────────────────────────────────── */
.proofcast-features__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
}
.proofcast-features__card {
  background: var(--wp--preset--color--base, #fff);
  border: 1px solid var(--wp--preset--color--tertiary, #e8e8e8);
  border-radius: var(--pf-radius-md);
  overflow: hidden;
  transition: box-shadow .2s, transform .2s;
}
.proofcast-features__card:hover { box-shadow: var(--pf-shadow); transform: translateY(-2px); }
.proofcast-features__card-body { padding: 1.25rem 1.375rem; }
.proofcast-features__tag   { font-family: var(--wp--preset--font-family--monospace, monospace); font-size: 0.5625rem; letter-spacing: 0.125em; text-transform: uppercase; color: var(--wp--preset--color--contrast-3, #aaa); margin-bottom: 0.5rem; }
.proofcast-features__title { font-family: var(--wp--preset--font-family--serif, Georgia, serif); font-size: 1.0625rem; font-weight: 400; color: var(--wp--preset--color--contrast, #111); margin-bottom: 0.375rem; line-height: 1.25; }
.proofcast-features__desc  { font-size: 0.8125rem; font-weight: 300; color: var(--wp--preset--color--contrast-2, #555); line-height: 1.65; }
@media (max-width: 640px) {
  .proofcast-features__grid { grid-template-columns: 1fr; }
}

/* ── FAQ ──────────────────────────────────────────────────────────── */
.proofcast-faq__list {
  display: flex;
  flex-direction: column;
  border: 1px solid var(--wp--preset--color--tertiary, #e8e8e8);
  border-radius: var(--pf-radius-md);
  overflow: hidden;
  background: var(--wp--preset--color--base, #fff);
}
.proofcast-faq__item { border-bottom: 1px solid var(--wp--preset--color--tertiary, #e8e8e8); }
.proofcast-faq__item:last-child { border-bottom: none; }
.proofcast-faq__question {
  width: 100%;
  padding: 1.125rem 1.5rem;
  font-size: 0.9375rem;
  font-weight: 500;
  color: var(--wp--preset--color--contrast, #111);
  background: transparent;
  border: none;
  text-align: left;
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  transition: background .15s;
  font-family: inherit;
}
.proofcast-faq__question:hover { background: var(--wp--preset--color--base-2, #f8f6f2); }
.proofcast-faq__icon { font-size: 1.125rem; color: var(--wp--preset--color--contrast-3, #aaa); flex-shrink: 0; font-weight: 300; transition: transform .2s; }
.proofcast-faq__answer {
  padding: 0 1.5rem 1.125rem;
  font-size: 0.875rem;
  font-weight: 300;
  color: var(--wp--preset--color--contrast-2, #555);
  line-height: 1.75;
}

/* ── Report ───────────────────────────────────────────────────────── */
.proofcast-report__loading {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 2rem;
  font-size: 0.875rem;
  font-weight: 300;
  color: var(--wp--preset--color--contrast-2, #555);
}
.proofcast-report__spinner {
  display: inline-block;
  width: 1.125rem;
  height: 1.125rem;
  border: 2px solid var(--wp--preset--color--tertiary, #e8e8e8);
  border-top-color: var(--wp--preset--color--primary, #4682B4);
  border-radius: 50%;
  animation: proofcast-spin 0.7s linear infinite;
  flex-shrink: 0;
}
@keyframes proofcast-spin { to { transform: rotate(360deg); } }
.proofcast-report__no-domain { padding: 1.5rem; font-size: 0.875rem; font-weight: 300; color: var(--wp--preset--color--contrast-3, #aaa); font-style: italic; }

/* ── CTA ──────────────────────────────────────────────────────────── */
.proofcast-cta-wrap { text-align: center; }
.proofcast-cta__headline {
  font-family: var(--wp--preset--font-family--serif, Georgia, serif);
  font-size: var(--wp--preset--font-size--xx-large, 2.25rem);
  font-weight: 400;
  letter-spacing: -0.03em;
  margin-bottom: 0.875rem;
}
.proofcast-cta__subtext {
  font-size: var(--wp--preset--font-size--medium, 1rem);
  font-weight: 300;
  color: var(--wp--preset--color--contrast-2, #555);
  max-width: 27rem;
  margin: 0 auto 2rem;
  line-height: 1.75;
}

/* ── Block wrapper classes ─────────────────────────────────────────
   These classes are output by PHP render callbacks as the outermost
   wrapper for each block. They need at minimum display:block so
   WordPress alignment classes (alignfull, alignwide) work correctly.
   ──────────────────────────────────────────────────────────────── */

.proofcast-compare-wrap,
.proofcast-faq-wrap,
.proofcast-features-wrap,
.proofcast-how-wrap,
.proofcast-live-board-wrap,
.proofcast-maturity-wrap,
.proofcast-next-step-wrap,
.proofcast-perspectives-wrap,
.proofcast-report-wrap,
.proofcast-scenarios-wrap {
	display: block;
	width: 100%;
}

/* ── How it works — step body ──────────────────────────────────── */
.proofcast-how__step-body {
	flex: 1;
	min-width: 0;
}

/* ── Next step text ─────────────────────────────────────────────── */
.proofcast-next-step__text {
	font-size: var( --wp--preset--font-size--small, 0.875rem );
	font-weight: 300;
	color: var( --wp--preset--color--contrast-2, #555555 );
	line-height: 1.65;
}

/* ── Trust table rows ───────────────────────────────────────────── */
.proofcast-trust-table__row {
	transition: background 0.12s;
}
.proofcast-trust-table__row:hover {
	background: var( --wp--preset--color--base-2, #f8f6f2 );
}
/* Posture-specific row modifier classes - no styles needed,
   present for targeting in child themes if required */
.proofcast-trust-table__row--reject,
.proofcast-trust-table__row--quarantine,
.proofcast-trust-table__row--none,
.proofcast-trust-table__row--no_dmarc {
	/* intentionally empty — available for theme overrides */
}

/* ── Live board empty state ─────────────────────────────────────── */
.proofcast-live-board__empty {
	grid-column: 1 / -1;
	padding: 2rem;
	text-align: center;
	font-size: var( --wp--preset--font-size--small, 0.875rem );
	font-weight: 300;
	color: var( --wp--preset--color--contrast-3, #aaaaaa );
	font-style: italic;
}

/* ── Compare block note ─────────────────────────────────────────── */
.proofcast-compare__note {
	margin-top: 1rem;
	font-size: var( --wp--preset--font-size--x-small, 0.75rem );
	font-weight: 300;
	color: var( --wp--preset--color--contrast-3, #aaaaaa );
	line-height: 1.65;
}

/* ── Grade state classes — applied by frontend.js on all result blocks ──
   Blocks use these classes to show grade-appropriate styling.
   All colors via CSS custom properties — no hardcoded hex in presentation.
   ──────────────────────────────────────────────────────────────────────── */

/* Perspectives block — grade-aware background */
.proofcast-perspectives-wrap[data-status="graded"] .proofcast-perspectives {
	display: grid;
	grid-template-columns: 1fr 1fr;
}

/* Next step — highlight color matches grade */
.proofcast-next-step-wrap[data-status="graded"] .proofcast-next-step__cta {
	color: var( --wp--preset--color--primary, #4682B4 );
}

/* Maturity grade letter colors — set via .is-mat-{grade} class by JS */
.proofcast-maturity__letter.is-mat-a { color: var( --pf-color-a, #16a34a ); }
.proofcast-maturity__letter.is-mat-c { color: var( --pf-color-c, #b45309 ); }
.proofcast-maturity__letter.is-mat-d { color: var( --pf-color-d, #c2410c ); }
.proofcast-maturity__letter.is-mat-f { color: var( --pf-color-f, #991b1b ); }

/* Hide result blocks until graded — JS sets data-status="graded" to reveal */
.proofcast-verdict-wrap[data-status="idle"] { display: none; }
.proofcast-perspectives-wrap[data-status="idle"] { display: none; }
.proofcast-next-step-wrap[data-status="idle"] { display: none; }
.proofcast-maturity-wrap[data-status="idle"] { display: none; }

/* Show result blocks once graded */
.proofcast-verdict-wrap[data-status="graded"],
.proofcast-perspectives-wrap[data-status="graded"],
.proofcast-next-step-wrap[data-status="graded"],
.proofcast-maturity-wrap[data-status="graded"] {
	display: block;
}

/* ── New primitive blocks ───────────────────────────────────────────── */

/* grade-letter */
.proofcast-grade-letter-wrap {
	display: block;
}

/* grade-field */
.proofcast-grade-field {
	display: block;
}

/* grade-heading */
.proofcast-grade-heading {
	display: block;
}

/* grade-badge */
.proofcast-grade-badge-wrap {
	display: inline;
}
.proofcast-grade-badge {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: 4px;
	font-family: Georgia, serif;
	font-weight: 700;
	line-height: 1;
	vertical-align: middle;
}

/* grade-condition — hidden by default, shown by JS when condition matches */
.proofcast-grade-condition {
	display: none;
}

/* grade-color-region */
.proofcast-grade-color-region {
	display: block;
	transition: background 0.3s;
}

/* Loading state on search block */
.proofcast-search--loading .proofcast-search__btn {
	opacity: 0.7;
	cursor: not-allowed;
}
.proofcast-search--loading .proofcast-search__input {
	opacity: 0.6;
}

/* ── Grade result block ─────────────────────────────────────────────── */
.proofcast-grade-result-wrap {
	display: block;
	position: relative;
}
.proofcast-grade-result__content {
	display: block;
}
.proofcast-grade-result__loading {
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 2rem;
	gap: 12px;
	color: var( --wp--preset--color--contrast-2, #666 );
	font-size: 0.9em;
}
.proofcast-grade-result__spinner {
	display: inline-block;
	width: 20px;
	height: 20px;
	border: 2px solid currentColor;
	border-top-color: transparent;
	border-radius: 50%;
	animation: proofcast-spin 0.7s linear infinite;
	flex-shrink: 0;
}
@keyframes proofcast-spin {
	to { transform: rotate(360deg); }
}

/* ── DNS record blocks ──────────────────────────────────────────────── */
.proofcast-dns-record {
	display: block;
	font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, monospace;
	font-size: 0.85em;
	line-height: 1.6;
	white-space: pre-wrap;
	word-break: break-all;
	background: var( --wp--preset--color--base-2, #f8f6f2 );
	border: 1px solid var( --wp--preset--color--contrast-3, #e0e0e0 );
	border-radius: 4px;
	padding: 1rem 1.25rem;
	margin: 0;
}

/* ── Check table blocks ─────────────────────────────────────────────── */
.proofcast-check-table-wrap {
	display: block;
	overflow-x: auto;
}
.proofcast-check-table {
	width: 100%;
	border-collapse: collapse;
}

/* ── Grade Summary block ──────────────────────────────────────────── */
.proofcast-grade-summary {
  box-sizing: border-box;
}
.proofcast-grade-summary__section {
  margin-bottom: 1.75rem;
}
.proofcast-grade-summary__title {
  font-size: clamp( 1rem, 2.5vw, 1.125rem );
  font-weight: 700;
  color: #111827;
  margin-bottom: 0.25rem;
  line-height: 1.3;
}
.proofcast-grade-summary__subtitle {
  font-size: 0.8125rem;
  color: #6b7280;
  margin-bottom: 0.75rem;
  line-height: 1.5;
}
.proofcast-grade-summary__cards {
  display: grid;
  grid-template-columns: repeat( auto-fit, minmax( 140px, 1fr ) );
  gap: 0.5rem;
}
.proofcast-grade-summary__card {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  padding: 0.875rem 1rem;
}
.proofcast-grade-summary__check-name {
  font-size: 0.8125rem;
  font-weight: 500;
  color: #374151;
  margin-bottom: 0.375rem;
}
.proofcast-grade-summary__check-status {
  font-size: 0.9375rem;
  font-weight: 700;
}

/* ── Table of Contents block ──────────────────────────────────────── */
.proofcast-toc {
  box-sizing: border-box;
}
.proofcast-toc__title {
  font-size: 0.6875rem;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var( --wp--preset--color--contrast-3, #aaa );
  margin-bottom: 0.75rem;
}
.proofcast-toc__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0;
}
.proofcast-toc__item {
  border-left: 2px solid var( --wp--preset--color--tertiary, #e8e8e8 );
  transition: border-color 0.15s;
}
.proofcast-toc__item--active,
.proofcast-toc__item:hover {
  border-left-color: var( --wp--preset--color--primary, #4682B4 );
}
.proofcast-toc__link {
  display: block;
  padding: 0.5rem 0.875rem;
  font-size: 0.875rem;
  font-weight: 400;
  color: var( --wp--preset--color--contrast-2, #555 );
  text-decoration: none;
  line-height: 1.4;
  transition: color 0.15s;
}
.proofcast-toc__link:hover {
  color: var( --wp--preset--color--primary, #4682B4 );
}
.proofcast-toc__link--active {
  color: var( --wp--preset--color--primary, #4682B4 );
  font-weight: 500;
}

