:root {
  --rd-ink: #172943;
  --rd-navy: #092756;
  --rd-green: #176448;
  --rd-saffron: #c25916;
  --rd-paper: #fffdf7;
  --rd-cream: #f7f0e2;
  --rd-line: #d9d0c1;
  --rd-shadow: 0 16px 44px rgba(19,38,67,.12);
  --rd-shell: 1600px;
}

.redesign-shell {
  width: min(var(--rd-shell), calc(100% - 32px));
  margin-inline: auto;
}

/* Reuse the approved open-book mark from the live home-page identity. */
nav .brand {
  display: inline-flex;
  align-items: center;
  gap: .62rem;
}

nav .brand::before {
  content: "";
  width: 48px;
  height: 36px;
  flex: 0 0 auto;
  background: url('../assets/brand-mark.svg') center / contain no-repeat;
}

nav .brand:has(> img)::before { display: none; }

nav .brand > img {
  display: block;
  width: 48px;
  height: 36px;
  flex: 0 0 auto;
  object-fit: contain;
}

.redesign-back {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  min-height: 44px;
  padding: .55rem .85rem;
  border: 1px solid var(--rd-line);
  border-radius: 999px;
  background: rgba(255,253,247,.86);
  color: var(--rd-navy);
  font-weight: 700;
  text-decoration: none;
  box-shadow: 0 4px 14px rgba(19,38,67,.06);
}

/* Keep the required history control available without creating a second
   full-width navigation bar above the screenshot-style hero. */
main:has(> .redesign-back-row) { position: relative; }
main > .redesign-back-row {
  position: absolute;
  top: .85rem;
  left: clamp(1rem, 3vw, 3rem);
  z-index: 20;
  width: auto;
  min-height: 0;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}
main > .redesign-back-row .redesign-back {
  min-height: 38px;
  padding: .42rem .72rem;
  font-size: .82rem;
}

.redesign-back-row--standalone {
  position: relative;
  z-index: 20;
  display: flex;
  justify-content: flex-start;
  margin-block: .75rem 0;
}

.redesign-back-row--standalone .redesign-back {
  min-height: 38px;
  padding: .42rem .72rem;
  font-size: .82rem;
}

.redesign-back:hover,
.redesign-back:focus-visible { border-color: var(--rd-saffron); transform: translateY(-1px); }
.redesign-back:focus-visible { outline: 3px solid rgba(194,89,22,.32); outline-offset: 3px; }

.redesign-card {
  border: 1px solid var(--rd-line);
  border-radius: 18px;
  background: var(--rd-paper);
  box-shadow: var(--rd-shadow);
}

.redesign-source-link { color: var(--rd-green); font-weight: 700; text-decoration-thickness: .12em; text-underline-offset: .18em; }

@media (max-width: 580px) {
  .redesign-shell { width: calc(100% - 20px); }
  nav .brand::before,
  nav .brand > img { width: 40px; height: 30px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}