/*
Theme Name: Lux
Theme URI: https://luxwebhosting.com/themes/lux
Author: Lux Digital
Author URI: https://lux.digital
Description: The Lux standard block theme. Core block editor only - no page
  builder, no Cornerstone, no lock-in. Content is portable core blocks so a
  site survives a theme change. Brand per client via style variations.
Requires at least: 6.5
Tested up to: 7.1
Requires PHP: 8.1
Version: 1.2.2
License: GPL-2.0-or-later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: lux
Tags: block-theme, full-site-editing, accessibility-ready, blog, portfolio, business
*/

/* Block themes style via theme.json. This file carries only what theme.json
   cannot express. Keep it short on purpose. */

/* Respect reduced-motion preferences everywhere. */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
    scroll-behavior: auto !important;
  }
}

/* Visible focus for keyboard users - accessibility baseline. */
:where(a, button, input, select, textarea, [tabindex]):focus-visible {
  outline: 2px solid var(--wp--preset--color--accent);
  outline-offset: 2px;
  border-radius: var(--wp--custom--radius--sm);
}

/* Skip link - hidden until focused. */
.lux-skip-link {
  position: absolute;
  left: -9999px;
  top: 0;
  z-index: 100000;
  padding: .75rem 1.25rem;
  background: var(--wp--preset--color--contrast);
  color: var(--wp--preset--color--base);
  text-decoration: none;
  border-radius: 0 0 var(--wp--custom--radius--md) 0;
}
.lux-skip-link:focus { left: 0; }

/* Smooth anchor scrolling that does not fight reduced-motion. */
@media (prefers-reduced-motion: no-preference) {
  html { scroll-behavior: smooth; }
}

/* Card utility used by several Lux patterns. */
.lux-card {
  background: var(--wp--preset--color--base);
  border: 1px solid var(--wp--preset--color--hairline);
  border-radius: var(--wp--custom--radius--lg);
  transition: box-shadow var(--wp--custom--transition--base),
              transform var(--wp--custom--transition--base);
}
.lux-card:hover {
  box-shadow: var(--wp--preset--shadow--md);
  transform: translateY(-2px);
}

/* Eyebrow label above headings. */
.lux-eyebrow {
  text-transform: uppercase;
  letter-spacing: .09em;
  font-weight: 600;
  color: var(--wp--preset--color--accent);
}

/* Keep images from overflowing on small screens. */
img, svg, video { max-width: 100%; height: auto; }

/* Print: drop chrome. */
@media print {
  .wp-block-navigation, .wp-site-blocks > header, .wp-site-blocks > footer { display: none !important; }
}

/* ---------------------------------------------------------------- brand mark
   The wordmark is inline SVG with fill="currentColor", so it takes the
   palette's contrast colour and flips correctly on the dark style variation
   without shipping a second image. Height is set here; width follows the
   viewBox so the frame never distorts. */
.lux-logo {
	display: inline-flex;
	align-items: center;
	text-decoration: none;
	color: var(--wp--preset--color--contrast);
	transition: opacity var(--wp--custom--transition--base);
}

.lux-logo:hover {
	opacity: 0.72;
}

.lux-logo:focus-visible {
	outline: 2px solid var(--wp--preset--color--accent);
	outline-offset: 4px;
}

.lux-logo__mark {
	display: block;
	height: 26px;
	width: auto;
}

@media (min-width: 782px) {
	.lux-logo__mark {
		height: 30px;
	}
}

.lux-logo__mark--sm {
	height: 22px;
}

/* ---------------------------------------------------------------- spec list
   Feature lists on the plans cards. No bullet - an accent rule in the margin
   reads cleaner at small sizes and does not fight the card's own border. */
.lux-spec {
	list-style: none;
	margin-left: 0;
	padding-left: 0;
}

.lux-spec li {
	position: relative;
	padding-left: 1.15em;
	margin-bottom: 0.55em;
	color: var(--wp--preset--color--contrast-2);
}

.lux-spec li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0.62em;
	width: 0.5em;
	height: 2px;
	background: var(--wp--preset--color--accent);
}
