/*
Theme Name: VLX Infracon Exact Elementor
Theme URI: https://vlxinfracon.com/
Author: VLX Infracon
Description: Pixel-faithful Elementor edition of the original VLX Infracon React website.
Version: 3.0.5
Requires at least: 6.4
Requires PHP: 7.4
Text Domain: vlx-infracon-exact
*/

:root {
  --font-heading: "Playfair Display Variable", "Playfair Display", Georgia, serif;
  --font-sans: "Instrument Sans Variable", "Instrument Sans", system-ui, sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, monospace;
}

html, body, [data-vlx-page] { font-family: var(--font-sans); }
h1, h2, h3, h4, h5, h6, .font-heading { font-family: var(--font-heading); }
.font-sans { font-family: var(--font-sans); }
.font-mono { font-family: var(--font-mono); }

/* Approved body typography scale across every page. */
[data-vlx-page] main { font-size: 18px !important; }
[data-vlx-page] main .text-xs { font-size: calc(.75rem + 2px) !important; }
[data-vlx-page] main .text-sm { font-size: calc(.875rem + 2px) !important; }
[data-vlx-page] main .text-base { font-size: calc(1rem + 2px) !important; }
[data-vlx-page] main .text-lg { font-size: calc(1.125rem + 2px) !important; }

/* Approved prominent header and footer scale. */
[data-testid="nav-brand"] > img { width: 3.25rem !important; height: 3.25rem !important; }
[data-testid="nav-brand"] > span > span:first-child { font-size: 1.15rem !important; }

#site-footer > div { max-width: 90rem !important; }
#site-footer img[alt="VLX logo"] { width: 4.5rem !important; height: 4.5rem !important; }
#site-footer .font-heading.text-2xl { font-size: calc(2rem + 3px) !important; }
#site-footer .font-heading.italic { font-size: calc(1.35rem + 3px) !important; }
#site-footer .text-sm { font-size: calc(1rem + 3px) !important; line-height: 1.7 !important; }
#site-footer .text-xs { font-size: calc(.875rem + 3px) !important; }
#site-footer .font-mono.text-xs { font-size: calc(.82rem + 3px) !important; }

@media (min-width: 1024px) {
  [data-testid="site-header"] > div { max-width: 90rem !important; padding-inline: 3rem !important; }
  [data-testid="site-header"] > div > div { height: 6.5rem !important; }
  [data-testid="nav-brand"] { gap: 1rem !important; }
  [data-testid="nav-brand"] > img { width: 4.5rem !important; height: 4.5rem !important; }
  [data-testid="nav-brand"] > span > span:first-child { font-size: calc(1.55rem + 3px) !important; }
  [data-testid="nav-brand"] > span > span:last-child { font-size: calc(.72rem + 3px) !important; }
  nav[aria-label="Primary"] { gap: 2.25rem !important; }
  nav[aria-label="Primary"] > a { font-size: calc(1rem + 3px) !important; }
  [data-testid="nav-cta-schedule"] { padding: .85rem 1.5rem !important; }
  #site-footer > div { padding: 5rem 3rem !important; }
}

html, body { margin: 0; }
.vlx-elementor-exact > .elementor,
.vlx-elementor-exact > .elementor > .elementor-element,
.vlx-elementor-exact .elementor-section,
.vlx-elementor-exact .elementor-container,
.vlx-elementor-exact .elementor-column,
.vlx-elementor-exact .elementor-widget-wrap,
.vlx-elementor-exact .elementor-widget-html,
.vlx-elementor-exact .elementor-widget-container { width: 100%; max-width: none !important; margin: 0; padding: 0; }
.vlx-elementor-exact .elementor-column-gap-default > .elementor-column > .elementor-element-populated { padding: 0; }
[data-vlx-page] > .elementor,
[data-vlx-page] > .elementor > .elementor-element,
[data-vlx-page] > .elementor .elementor-section,
[data-vlx-page] > .elementor .elementor-container,
[data-vlx-page] > .elementor .elementor-column,
[data-vlx-page] > .elementor .elementor-widget-wrap,
[data-vlx-page] > .elementor .elementor-widget-html,
[data-vlx-page] > .elementor .elementor-widget-container { width: 100%; max-width: none !important; margin: 0; padding: 0; }
.admin-bar [data-testid="site-header"] { top: 32px; }

.vlx-scrolled [data-testid="site-header"] {
  background: rgba(250,247,242,.88) !important;
  border-bottom: 1px solid rgba(229,220,209,.7);
  box-shadow: 0 8px 30px rgba(0,0,0,.05);
  backdrop-filter: blur(18px);
}
.vlx-scrolled [data-testid="site-header"] [data-testid="nav-brand"] > span > span:first-child,
.vlx-scrolled [data-testid="site-header"] nav > a:not([data-testid="nav-cta-schedule"]) { color: #1c1815 !important; }
.vlx-scrolled [data-testid="site-header"] [data-testid="nav-brand"] > span > span:last-child { color: #5c5248 !important; }
.vlx-scrolled [data-testid="site-header"] [data-testid="nav-mobile-toggle"] { color: #1c1815 !important; border-color: #e5dcd1 !important; background: rgba(255,255,255,.7) !important; }

.vlx-form-notice { margin: 0 0 15px; padding: 12px 14px; border-radius: 12px; background: #edf8ef; color: #216832; font-size: 14px; }
.vlx-form-notice.is-error { background: #fff0ee; color: #9f3327; }

@media (max-width: 782px) { .admin-bar [data-testid="site-header"] { top: 46px; } }
@media (max-width: 1023px) {
  nav[aria-label="Primary"].vlx-mobile-nav-open {
    display: flex !important; position: fixed; inset: 64px 12px auto; z-index: 70;
    flex-direction: column; align-items: stretch; gap: 2px; padding: 18px;
    border: 1px solid #e5dcd1; border-radius: 20px; background: rgba(250,247,242,.98);
    box-shadow: 0 20px 50px rgba(18,16,14,.18); color: #1c1815;
  }
  nav[aria-label="Primary"].vlx-mobile-nav-open a { color: #1c1815 !important; padding: 10px 8px; }
}
