/* Secret Room — article layout + bilingual type. Overrides theme 1.3.0. */

:root {
  --font-display: "Unbounded", "Arial Black", sans-serif;
  --font-body: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

h1, h2, h3, h4,
.display,
.logo .name,
.logo .logo-media {
  font-family: var(--font-display);
}

.topbar {
  font-family: var(--font-display);
  font-weight: 500;
  font-size: 11px;
  letter-spacing: .14em;
}

.nav a {
  font-family: var(--font-display);
  font-weight: 500;
  font-size: 13px;
  letter-spacing: .12em;
}

.badge {
  font-family: var(--font-display);
  font-weight: 500;
  letter-spacing: .14em;
}

.hero-lead {
  min-height: 0 !important;
  aspect-ratio: 16 / 9;
}

.hero-lead .cover {
  object-fit: contain;
}

.card .thumb,
.card.wide .thumb {
  height: auto !important;
  aspect-ratio: 16 / 9;
  background: var(--ink);
}

.card.wide {
  flex-direction: column !important;
}

.card.wide .thumb {
  flex: none !important;
  width: 100% !important;
  align-self: stretch;
  border-right: 0 !important;
  border-bottom: 3px solid var(--ink);
}

.card.wide .card-body {
  width: 100% !important;
}

.card .thumb .thumb-img {
  object-fit: contain !important;
}

.promo-banner .promo-thumb,
.promo-small-thumb,
.svc-logo img {
  object-fit: contain !important;
  background: #fff;
}

.svc-badge {
  position: static !important;
  align-self: flex-start;
  width: max-content;
  max-width: 100%;
  font-family: var(--font-display);
  font-weight: 500;
  letter-spacing: .08em;
}

.svc-card-top {
  padding-right: 0 !important;
}

.svc-card-name {
  font-size: 18px;
  font-weight: 800;
  line-height: 1.15;
  overflow-wrap: anywhere;
}

.srm-cal-card.major .srm-cal-img {
  object-fit: contain;
}

.article-hero .dek {
  font-family: var(--font-body);
  font-weight: 400;
}

.article-hero .meta,
.article-meta {
  font-family: var(--font-body) !important;
  font-weight: 400 !important;
  font-size: 14px;
  color: var(--gray);
}

.article-cover {
  height: auto !important;
  aspect-ratio: 16 / 9;
  background: var(--ink);
}

.article-cover img {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
}

.article-body h2,
.article-body h3 {
  font-family: var(--font-display);
  font-weight: 800;
}

.article-body figure,
.article-body .wp-block-image,
.article-body .art-figure {
  margin: 28px 0;
  border: 3px solid var(--ink);
  border-radius: var(--radius-sm);
  overflow: hidden;
  background: var(--paper);
}

.article-body img,
.article-body .wp-block-image img,
.article-body figure img,
.article-body p > img {
  width: 100%;
  max-width: 100%;
  height: auto !important;
  object-fit: contain;
  display: block;
  background: var(--paper);
}

.article-body figcaption {
  padding: 12px 16px;
  font-family: var(--font-body);
  font-weight: 400;
  font-size: 14px;
  color: var(--gray);
  border-top: 2px solid var(--ink);
}

.article-body .srm-plaque,
.article-body figure.srm-plaque {
  aspect-ratio: 3 / 1;
  background: var(--yellow);
}

.article-body .srm-plaque img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.article-body blockquote,
.article-body .wp-block-quote,
.editor-styles-wrapper blockquote,
.editor-styles-wrapper .wp-block-quote {
  position: relative;
  margin: 32px 0;
  padding: 28px 28px 28px 36px;
  border: 3px solid var(--ink) !important;
  border-left: 3px solid var(--ink) !important;
  border-radius: 18px;
  background: var(--yellow);
  box-shadow: 4px 4px 0 var(--ink);
  font-family: var(--font-display);
  font-style: normal !important;
  font-weight: 600;
  font-size: 20px;
  line-height: 1.4;
  letter-spacing: -0.02em;
}

.article-body blockquote::before,
.article-body .wp-block-quote::before,
.editor-styles-wrapper blockquote::before {
  content: "«";
  position: absolute;
  top: 14px;
  left: 16px;
  font-family: var(--font-display);
  font-weight: 900;
  font-size: 54px;
  line-height: 1;
  color: var(--ink);
  opacity: .18;
}

.article-body blockquote p,
.article-body .wp-block-quote p {
  margin: 0;
}

.article-body blockquote p + p {
  margin-top: 12px;
}

.article-body blockquote cite,
.article-body .wp-block-quote cite {
  display: block;
  margin-top: 14px;
  font-family: var(--font-body);
  font-weight: 400;
  font-size: 13px;
  font-style: normal;
  letter-spacing: 0;
  color: #33332f;
}