/* Horizontal colour stops sampled from the supplied reference, averaged vertically.
   A 90deg gradient depends only on viewport width, so its colours never drift
   as the document grows or the user scrolls. */
.data-page {
  --data-reference-background: linear-gradient(90deg,
    #052043 0%,
    #062147 5%,
    #052454 10%,
    #042c6d 15%,
    #05388c 20%,
    #0749b1 25%,
    #095cd4 30%,
    #0b6eee 35%,
    #0d7efd 40%,
    #1291fd 45%,
    #19a4fd 50%,
    #21b7fd 55%,
    #32c7fd 60%,
    #4ad7fd 65%,
    #61e4fd 70%,
    #79e7f5 75%,
    #a1dcd2 80%,
    #d0cb99 85%,
    #f5b157 90%,
    #fe942b 95%,
    #fe7b0f 100%);
  background: var(--data-reference-background);
  background-size: 100% 100%;
  background-repeat: no-repeat;
}
.data-page .site-shell,
.data-page .site-footer {
  background: transparent;
}
.data-page .data-hero{padding:70px max(24px,calc((100% - 1120px)/2)) 48px;background:transparent}
.data-page .data-hero h1{font-family:var(--fw-font-display);font-size:clamp(48px,7vw,88px);line-height:1;letter-spacing:-.045em;margin:18px 0 24px}
.data-page .data-hero h1 span{color:var(--fw-cyan)}
.data-page p{line-height:1.65}
.data-page .data-hero>p:not(.data-label){font-size:clamp(18px,2vw,22px);max-width:740px}
.data-page .data-label{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--fw-cyan);font-weight:700}



/* No opaque case-study wrapper. Text stays within a single contrast region. */
.data-page .data-story { max-width:1120px; margin:auto; padding:0 24px 32px; }
.data-page .data-investigation { background:transparent; border:0; padding:0; font-size:16px; }
.data-page .data-stage { padding:24px 0; scroll-margin-top:90px; }
.data-page .data-stage h2 { font-size:22px; font-weight:500; line-height:1.35; margin:0 0 16px; color:var(--fw-white); max-width:240px; }
.data-page .data-stage h3,.data-page .data-stage dt { font-size:14px; font-weight:500; margin:0; line-height:1.5; }
.data-page .data-stage p { font-size:16px; font-weight:400; line-height:1.6; margin:12px 0; }
.data-page .data-prose { width:46%; margin-left:auto; color:#052043; }
.data-page .data-introduction,.data-page .data-closing,.data-page .data-next { display:grid; grid-template-columns:1fr 1fr; gap:20px; }
.data-page .data-introduction .data-prose,.data-page .data-closing .data-prose,.data-page .data-next .data-prose { width:100%; }
.data-page .data-shipment { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px 24px; padding:20px; margin:0; background:#ffffff; color:#052043; border-radius:6px; }
.data-page .data-stage dt { color:#052043; }
.data-page .data-stage dd { font-size:16px; font-weight:400; margin:4px 0 0; font-variant-numeric:tabular-nums; }
.data-page .data-record-equation { grid-column:1 / -1; border-top:1px solid #36516c; padding-top:12px; }
.data-page .data-record-equation dd,.data-page .data-equation { color:#052043; }
.data-page .data-questionable { margin-top:20px; }
.data-page .data-verification { background:#ffffff; color:#052043; border-radius:6px; padding:12px 20px; margin-top:20px; max-width:650px; }
.data-page .data-checks { display:grid; grid-template-columns:1fr 1fr; gap:20px; }
.data-page .data-check { padding:20px; background:#ffffff; color:#052043; border-radius:6px; }
.data-page .data-check p:last-child { margin-bottom:0; }
.data-page .data-check h3 { margin-bottom:12px; }
.data-page .data-case-conclusion { margin-top:20px; }
.data-page .data-scale ol { list-style:none; display:grid; grid-template-columns:repeat(4,1fr); gap:24px; padding:16px 20px; margin:0 0 20px; background:#ffffff; color:#052043; border-radius:6px; }
.data-page .data-scale li { position:relative; padding:8px 0; }
.data-page .data-scale li:not(:last-child)::after { content:'→'; position:absolute; right:-20px; top:8px; color:#052043; }
.data-page .data-try-actions { grid-column:1 / -1; display:flex; align-items:center; flex-wrap:wrap; gap:20px 28px; margin-top:8px; background:#ffffff; color:#052043; border-radius:6px; padding:20px; }
.data-page .data-sample { display:grid; grid-template-columns:auto auto; align-items:center; gap:8px 16px; }
.data-page .data-sample label,.data-page .data-sample span { font-size:14px; color:#052043; }
.data-page .data-sample span { grid-column:1 / -1; }
.data-page .data-sample button { font:inherit; font-size:16px; color:#052043; background:transparent; border:1px solid #7892a8; border-radius:6px; padding:10px 14px; }
.data-page .data-try-actions .button { font-size:16px; font-weight:400; }
.data-page a:focus-visible,.data-page button:focus-visible { outline:3px solid #ffbf7b; outline-offset:5px; }
.data-page .data-skip { position:absolute; left:16px; top:-100px; background:#07182c; padding:16px; z-index:100; }
.data-page .data-skip:focus { top:16px; }
.data-page .data-story-link { color:var(--fw-cyan); }
@media(max-width:760px) {
  .data-page .data-hero { padding-top:42px; }
  .data-page .data-introduction,.data-page .data-closing,.data-page .data-next { display:block; }
  .data-page .data-stage h2 { max-width:none; width:48%; margin-left:auto; color:#052043; }
  .data-page .data-prose,.data-page .data-introduction .data-prose,.data-page .data-closing .data-prose,.data-page .data-next .data-prose { width:48%; margin-left:auto; }
  .data-page .data-shipment { grid-template-columns:1fr 1fr; padding:16px; }
  .data-page .data-checks { grid-template-columns:1fr; gap:16px; }
  .data-page .data-check { padding:16px; }
  .data-page .data-scale ol { grid-template-columns:1fr 1fr; }
  .data-page .data-scale li:nth-child(2)::after { content:''; }
  .data-page .data-sample { grid-template-columns:1fr; }
}
@media(max-width:400px) { .data-page .data-story { padding-inline:16px; } .data-page .data-shipment { grid-template-columns:1fr; } }
@media(prefers-reduced-motion:reduce) { html:has(.data-page) { scroll-behavior:auto; } }

/* Orange outlines distinguish content surfaces from download controls. */
.data-page .data-shipment,
.data-page .data-verification,
.data-page .data-check,
.data-page .data-scale ol,
.data-page .data-try-actions {
  border: 1px solid var(--fw-orange);
}
.data-page .data-sample a[download],
.data-page .data-sample button {
  background: #052043;
  border: 1px solid var(--fw-orange);
  color: #ffffff;
  opacity: 1;
}
.data-page .data-sample a[download]:hover,
.data-page .data-sample a[download]:focus-visible {
  background: #052043;
  color: #ffffff;
}

/* Matched desktop pairs, stacked in reading order on smaller screens. */
.data-page .data-scale,
.data-page .data-verification-pair {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:20px;
  align-items:stretch;
}
.data-page .data-scale ol { grid-template-columns:1fr 1fr; margin:0; }
.data-page .data-scale li:nth-child(2)::after { content:''; }
.data-page .data-verification-pair { margin-top:20px; }
.data-page .data-verification-pair .data-verification { max-width:none; margin:0; }
.data-page .data-scale > .data-prose,
.data-page .data-verification-pair > .data-questionable {
  width:auto;
  margin:0;
  padding:12px 20px;
  background:#052043;
  color:#ffffff;
  border:1px solid var(--fw-orange);
  border-radius:6px;
}
.data-page .data-sample a[download] {
  color:var(--fw-orange);
  border:3px solid var(--fw-orange);
  /* A clipped inset surface follows the existing chamfered button outline. */
  background:var(--fw-orange);
  position:relative;
  isolation:isolate;
  overflow-wrap:anywhere;
  line-height:1.4;
  padding:10px 22px;
}
.data-page .data-sample a[download]:hover,
.data-page .data-sample a[download]:focus-visible { color:var(--fw-orange); background:var(--fw-orange); }
.data-page .data-sample a[download]::before {
  content:'';
  position:absolute;
  inset:0;
  z-index:-1;
  background:#052043;
  clip-path:polygon(0 0,calc(100% - var(--fw-chamfer-sm)) 0,100% var(--fw-chamfer-sm),100% 100%,var(--fw-chamfer-sm) 100%,0 calc(100% - var(--fw-chamfer-sm)));
  pointer-events:none;
}
@media(max-width:760px) {
  .data-page .data-scale,
  .data-page .data-verification-pair { grid-template-columns:1fr; }
}
