/* The comparison activates this treatment only with ?design=review. */
html.design-review {
  --review-ink: #110f12;
  --review-paper: #faf6ee;
  --review-wine: #90283d;
  --review-rose: #ee9eaa;
  --review-ivory: #f8f0e7;
  --review-edge: #76616a;
  --review-rule: #d8cbc1;
}

.design-review .site-page main :is(.shell, .retained-hero .wrap) {
  width: min(calc(100% - 64px), 1120px);
  margin-inline: auto;
}

.design-review .site-page main .section {
  padding-block: clamp(57px, 8vw, 110px);
}

.design-review .site-page main .section:is(.white, .tint, .editorial-about) {
  background: var(--review-paper);
  border-block: 0;
  border-top: 1px solid var(--review-rule);
}

.design-review .site-page main .section h2 {
  letter-spacing: -.035em;
}

.design-review .site-page .v143-head {
  background: #0d0b0d;
  border-bottom-color: #48313a;
}

html.design-review body.site-page main .opening {
  background: var(--review-ink);
  color: var(--review-ivory);
  min-height: 0;
  padding-block: clamp(56px, 8vw, 110px);
  border-top: 1px solid #693144;
}

.design-review .site-page .opening .eyebrow {
  color: var(--review-rose);
  font-size: 11px;
  margin-bottom: 16px;
  letter-spacing: .16em;
  text-shadow: none !important;
}

html.design-review body.site-page .opening .school-label {
  justify-content: space-between;
  flex-direction: row;
  align-items: baseline;
  gap: 8px 14px;
  padding: 12px 0;
  margin: 0 0 clamp(36px, 6vw, 66px);
  border-block: 1px solid var(--review-edge);
  background: transparent;
  color: var(--review-ivory) !important;
  font-size: clamp(15px, 1.5vw, 19px);
}

html.design-review body.site-page .opening .school-label-title {
  color: inherit;
  font-size: inherit;
}

html.design-review .site-page .opening .school-opening-status {
  padding: 0;
  border: 0;
  color: var(--review-rose);
  font-size: 12px;
}

html.design-review .site-page .opening .shell :is(h1, #school-title) {
  margin-bottom: 24px;
  color: var(--review-ivory);
  font-size: clamp(37px, 7.2vw, 70px);
  line-height: 1.28;
  letter-spacing: -.055em;
  text-shadow: none !important;
}

html.design-review .site-page .opening .shell :is(h1, #school-title) .wine {
  color: var(--review-rose) !important;
}

html.design-review .site-page .opening .school-audience {
  display: block;
  margin-bottom: 9px;
  color: var(--review-ivory);
  font-size: clamp(14px, 2.2vw, 23px);
  letter-spacing: .015em;
}

html.design-review .site-page .opening .shell :is(.lead, .honkatsuyo-definition, .honkatsuyo-catch) {
  color: var(--review-ivory);
  line-height: 1.85;
  text-shadow: none !important;
}

html.design-review .site-page .opening .shell .honkatsuyo-name {
  color: var(--review-rose);
  text-shadow: none !important;
}

.design-review .site-page .opening .honkatsuyo-statement {
  border-left: 1px solid var(--review-rose);
  padding-block: 4px;
}

html.design-review .site-page .opening .page-jumps a {
  color: #e6d2d5;
  border-color: var(--review-edge);
}

html.design-review .site-page main .opening a.button {
  min-height: 49px;
  padding: 12px 16px;
  border: 1px solid #bd6576;
  background: #741e34;
  color: #fff;
}

html.design-review .site-page main .opening a.button:is(:hover, :focus-visible) {
  background: var(--review-wine);
}

html.design-review .school-detail .school-intro-copy .opening-art {
  border: 1px solid #d98094;
  background: repeating-radial-gradient(circle, transparent 0 20%, #bd697f 20.3% 20.6%, transparent 20.9% 26%);
  mask-image: none;
  opacity: .23;
}

html.design-review .school-detail .school-intro-copy .opening-aura {
  border: 1px solid #ae5a72;
  background: none;
  opacity: .22;
}

html.design-review .corporate-page .opening .opening-art {
  --band-width: 1px;
  background: repeating-linear-gradient(90deg, transparent 0 calc(var(--band-period) - var(--band-width)), #cb788c calc(var(--band-period) - var(--band-width)) var(--band-period));
  opacity: .35;
}

html.design-review .corporate-page .opening::after {
  background: linear-gradient(112deg, #110f12 12%, #110f12e8 45%, #3a1122a3 100%);
}

.design-review .school-home .school-entry .opening-art,
.design-review .school-home .school-entry .opening-aura {
  opacity: .14;
}

.design-review .school-home .retained-hero-art {
  filter: saturate(.82) contrast(1.1);
}

.design-review .school-home .retained-links {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: stretch;
  width: min(100%, 580px);
  gap: 0;
  border-block: 1px solid #b88c97;
}

.design-review .school-home .retained-links a {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  min-height: 52px;
  padding: 11px 14px;
  background: #170c12e8;
  border: 0;
  color: var(--review-ivory);
  font-size: 14px;
  letter-spacing: 0;
}

.design-review .school-home .retained-links a + a {
  border-left: 1px solid #b88c97;
}

.design-review .school-home .retained-links a::after {
  content: '↗' / '';
  flex: none;
  color: var(--review-rose);
}

.design-review .school-home .retained-links a:is(:hover, :focus-visible) {
  background: #632036;
}

@media (max-width: 700px) {
  .design-review .site-page main :is(.shell, .retained-hero .wrap) {
    width: calc(100% - 48px);
  }

  html.design-review body.site-page main .opening {
    padding-block: 43px 58px;
  }

  .design-review .school-home .retained-hero {
    height: auto;
    min-height: min(570px, calc(100svh - 72px));
    padding-block: 44px;
  }

  .design-review .school-home .retained-links {
    grid-template-columns: minmax(0, 1fr);
  }

  .design-review .school-home .retained-links a + a {
    border-left: 0;
    border-top: 1px solid #76616a;
  }
}

@media (max-width: 360px) {
  .design-review .site-page main :is(.shell, .retained-hero .wrap) {
    width: calc(100% - 34px);
  }

  html.design-review .site-page .opening .shell :is(h1, #school-title) {
    font-size: 33px;
  }
}
