/**
  Theme Name: Rhye Child
  Theme URI: https://artemsemkin.com/rhye/wp/
  Description: This is a child theme of Rhye, generated by Merlin WP.
  Author: Artem Semkin
  Author URI: https://artemsemkin.com
  Template: rhye
  Version: 1.0.9
*/

/* NQ preloader; original options remain intact. */
#js-preloader .preloader__heading { font-size: 0 !important; }
#js-preloader .preloader__heading::after { content: ""; display: block; width: min(54vw, 220px); aspect-ratio: 1.55; margin: 0 auto; background: url("https://hellonq.com/wp-content/uploads/2026/09/nq-logo-transparent.png") center / contain no-repeat; }
#js-preloader .preloader__subline, #js-preloader .preloader__counter { display: none !important; }

.header__wrapper-overlay-widgets { display: none !important; }

/* Keep demo footer widgets saved, but omit them from every public page. */
#page-footer .footer__area_upper { display: none !important; }

/* NQ mark in the theme header, mobile menu and footer. Keep the text accessible. */
.logo__text { display: block; width: 64px; aspect-ratio: 1.55; background: url("https://hellonq.com/wp-content/uploads/2026/09/nq-logo-transparent.png") center / contain no-repeat; }
.logo__text-title { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
@media (max-width: 767px) { .logo__text { width: 54px; } }

/* Center the brand mark inside the loading circle. */
#js-preloader .preloader__heading { position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); margin: 0 !important; }

/* Show the complete NQ Sigma film above the homepage copy on phones. */
@media (max-width: 767px) {
  body.page-id-1355 .slider__images-slide-inner { background: #050507; }
  body.page-id-1355 .slider__images-slide-inner video.slider__bg {
    display: block;
    width: 100% !important;
    height: auto !important;
    max-height: 34vh;
    object-fit: contain !important;
    margin-top: max(88px, 12vh);
  }
}

/* The Rhye slider scales its video after load; keep the mobile frame intact. */
@media (max-width: 767px) {
  body.page-id-1355 .slider__images-slide-inner video.slider__bg {
    transform: none !important;
    transform-origin: center !important;
  }
}

/* Keep the entire cinematic frame visible on every viewport. */
body.page-id-1355 .slider__images-slide-inner { background: #050507 !important; }
body.page-id-1355 .slider__images-slide-inner video.slider__bg {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  max-height: none !important;
  margin: 0 !important;
  object-fit: contain !important;
  transform: none !important;
}

/* NQ shared surface sampled from the cinematic banner. */
:root {
  --nq-surface: #e9edee;
  --nq-ink: #24364a;
  --nq-copy: #46515d;
  --color-light-1: #e9edee;
  --color-light-2: #e9edee;
  --color-light-3: #e9edee;
  --color-light-4: #e9edee;
  --h1-color-light: #24364a;
  --h2-color-light: #24364a;
  --h3-color-light: #24364a;
  --h4-color-light: #24364a;
  --h5-color-light: #24364a;
  --h6-color-light: #24364a;
  --xl-color-light: #24364a;
  --xxl-color-light: #24364a;
  --paragraph-color-light: #46515d;
  --subheading-color-light: #46515d;
  --blockquote-color-light: #24364a;
  --dropcap-color-light: #24364a;
}
body, #page-wrapper, .page-wrapper__content, #page-header, #page-footer,
#js-preloader, #nq-film-hero, .header__wrapper-overlay-menu,
.bg-white, .bg-light-1, .bg-light-2, .bg-light-3, .bg-light-4,
.bg-dark-1, .bg-dark-2, .bg-dark-3, .bg-dark-4 {
  background-color: var(--nq-surface) !important;
}
.curtain-svg, .curtain-svg path { fill: var(--nq-surface) !important; }
#page-header, .arts-elementor-theme-light, [data-arts-theme-text="light"],
#nq-film-hero .nq-hero-copy, #nq-film-hero .nq-hero-copy h1 {
  color: var(--nq-ink) !important;
}
#nq-film-hero .nq-hero-copy p { color: var(--nq-copy) !important; }
#page-header .header__burger-line { background-color: var(--nq-ink) !important; }
#page-header .menu-overlay a { color: var(--nq-ink) !important; }
#page-header .menu-overlay a:hover { color: #155b87 !important; }
#js-preloader .preloader__circle { border-color: rgba(36,54,74,.22) !important; }
