/*
Theme Name: Alliant Omega
Theme URI: https://alliantstudios.com
Template: dopplehaus
Author: Alliant Studios
Author URI: https://alliantstudios.com
Description: Child theme of Dopplehaus for the new alliantstudios.com (Project Omega). Holds the design-direction mockups. Rules of engagement: all styling hangs off the classes and IDs set in each stack's Options tab - content areas carry plain HTML only (headings, paragraphs, lists, links, images, strong/em), never structure classes or IDs.
Version: 0.2.0
Requires at least: 6.1.1
Requires PHP: 8.1
Text Domain: alliant-omega
*/

/* Child overrides that apply to every page live here. Parent (Dopplehaus)
   styles load first; this stylesheet enqueues after them.

   The site's design (Hex Noir) is css/site.css on every non-mockup page
   (body.omega-site). Each mockup has its own file in css/mockups/ and only
   loads on its page (see functions.php). Mockup selectors are scoped by the body class
   omega-mNN and by the classes set in each stack's Options tab. Content
   inside a stack is plain HTML, so selectors target elements by position
   (h1, p:first-child, .row > div:nth-child(2)) rather than by class. */

/* Plain images inside WYSIWYG content stay responsive without a class. */
.block.content-area img {
	max-width: 100%;
	height: auto;
}

/* Dopplehaus gives each Content Area column order-N / order-lg-N classes,
   but Bootstrap only ships order-0 to order-5. Without these, the 6th and
   later columns of a content area fall back to order 0 and jump ahead of
   the first five. */
.order-6 { order: 6; }
.order-7 { order: 7; }
.order-8 { order: 8; }
.order-9 { order: 9; }
.order-10 { order: 10; }
.order-11 { order: 11; }
.order-12 { order: 12; }

@media (min-width: 992px) {
	.order-lg-6 { order: 6; }
	.order-lg-7 { order: 7; }
	.order-lg-8 { order: 8; }
	.order-lg-9 { order: 9; }
	.order-lg-10 { order: 10; }
	.order-lg-11 { order: 11; }
	.order-lg-12 { order: 12; }
}

/* Anchor targets (#services, #work ...) clear the fixed header. */
.block[id] {
	scroll-margin-top: 90px;
}

/* Header colors per mockup. Each mockup sets these variables on its body
   class; the selectors below are specific enough to beat both the header's
   inline <style> and Dopplehaus's white sticky header
   (header.sticky.sticky-active [data-header-hover="light"] ... !important). */
:is(body.omega-mockup, body.omega-site) header nav.navbar {
	background-color: var(--omega-nav-bg, #000);
}

:is(body.omega-mockup, body.omega-site) header.sticky.sticky-active nav.navbar[data-header-hover] {
	background-color: var(--omega-nav-sticky-bg, var(--omega-nav-bg, #000)) !important;
}

:is(body.omega-mockup, body.omega-site) header .navbar-nav .nav-link,
:is(body.omega-mockup, body.omega-site) header .header-icon .icon > a {
	color: var(--omega-nav-link, #fff);
}

:is(body.omega-mockup, body.omega-site) header.sticky.sticky-active [data-header-hover] .navbar-nav .nav-link,
:is(body.omega-mockup, body.omega-site) header.sticky.sticky-active [data-header-hover] .header-icon .icon > a {
	color: var(--omega-nav-sticky-link, var(--omega-nav-link, #fff));
}

:is(body.omega-mockup, body.omega-site) .navbar-toggler-line {
	background-color: var(--omega-nav-link, #fff);
}

/* Below 992px Dopplehaus paints transparent headers white
   (.navbar.bg-transparent { background: var(--white) !important }), which
   hides a white logo and hamburger. Use the sticky color instead. */
@media (max-width: 991px) {
	:is(body.omega-mockup, body.omega-site) header nav.navbar.bg-transparent {
		background-color: var(--omega-nav-sticky-bg, var(--omega-nav-bg, #000)) !important;
	}
}

/* On phones the mobile nav wraps the page in .page-layout with a white
   background; let the design's body background show through. */
:is(body.omega-mockup, body.omega-site) .page-layout {
	background-color: transparent !important;
}

/* Lists a mockup turns into layout (ul with list-style: none) should not
   keep Dopplehaus's square li markers; li follows its ul instead. */
:is(.omega-mockup, .omega-site) .block ul li {
	list-style: inherit;
}

/* Mockups draw their own quotation marks. */
:is(.omega-mockup, .omega-site) .block blockquote::before,
:is(.omega-mockup, .omega-site) .block blockquote::after {
	content: none;
}

/* Mockups switcher in the nav: long labels stay on one line. */
header .navbar .dropdown-menu .menu-link div {
	white-space: nowrap;
}

/* Smooth in-page jumps; respect reduced motion everywhere. */
html {
	scroll-behavior: smooth;
}

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