/* ============================================================================
   TRANSITIONS — preloader and page-transition curtain.

   The behaviour that goes with these styles lives in:
     js/preloader-counter.js       pads the counter to three digits
     js/dark-to-light-cover.js     the dark -> light curtain between pages

   Both were previously WPCode snippets stored in the database.
   ============================================================================ */


/* ============================================================
   PRELOADER COUNTER

   The background-image is a flat yellow block used as an underline behind
   the digits.

   NOTE: the old child theme also set `color: #F5F5F5` and `font-size: 24px`
   here. Both were overridden by the !important rule below and never had any
   effect, so they have been dropped. Only the font-family survived.
   ============================================================ */
.preloader__counter.me-auto.mt-auto.underline.js-preloader__counter.h6 {
	font-family: 'AzeretMono-Thin';
}

.js-preloader__counter {
	font-size: 120px !important;
	color: var(--evm-ink-caption) !important;
	background-image: linear-gradient(var(--evm-yellow), var(--evm-yellow));
	width: auto !important;
}

/* Light pages get a dark counter. */
body.post-template-default.single.single-post .preloader__counter.me-auto.mt-auto.underline.js-preloader__counter.h6,
body.archive .preloader__counter.me-auto.mt-auto.underline.js-preloader__counter.h6,
.page-template-default.page .preloader__counter.me-auto.mt-auto.underline.js-preloader__counter.h6 {
	color: var(--evm-ink) !important;
}


/* ============================================================
   PRELOADER CURTAIN
   `--color-dark-1` is Kinsey's own variable, not one of ours.
   ============================================================ */
body.home #js-preloader .mask-reveal__layer-1 {
	background-color: var(--color-dark-1) !important;
}