/*
Theme Name: AIRO Control Tower
Theme URI: https://airo-auto.com/
Author: AIRO
Description: A full-site-editing block theme for AIRO Warehousing Automation.
Version: 1.0.0
Requires at least: 6.5
Requires PHP: 8.0
Text Domain: airo-control-tower
*/

:root {
  --airo-ink: #07130f;
  --airo-panel: #101916;
  --airo-line: rgba(242, 244, 241, 0.14);
  --airo-lime: #c7ff3d;
  --airo-white: #f2f4f1;
  --airo-muted: #aeb7b0;
}

html { scroll-behavior: smooth; }
body { overflow-x: hidden; }
a { text-underline-offset: .22em; }

.airo-shell { position: relative; }
.airo-header {
  position: absolute;
  z-index: 20;
  inset: 0 0 auto;
  border-bottom: 1px solid var(--airo-line);
  backdrop-filter: blur(14px);
  background: linear-gradient(180deg, rgba(7,19,15,.88), rgba(7,19,15,.38));
}
.airo-logo-frame {
  display: inline-flex;
  align-items: center;
  width: 144px;
  height: 52px;
  padding: 5px 9px;
  box-sizing: border-box;
  background: #fff;
  border-radius: 3px;
}
.airo-logo-frame img { display: block; width: 100%; height: auto; }
.airo-nav a { text-decoration: none; }
.airo-nav a:hover { color: var(--airo-lime) !important; }

.airo-hero {
  position: relative;
  min-height: 900px;
  display: flex;
  align-items: center;
  overflow: hidden;
  background-color: var(--airo-ink);
  background-image:
    linear-gradient(90deg, rgba(4,12,9,.98) 0%, rgba(4,12,9,.93) 28%, rgba(4,12,9,.48) 54%, rgba(4,12,9,.10) 100%),
    linear-gradient(180deg, rgba(7,19,15,.18), rgba(7,19,15,.45)),
    url('assets/images/hero-production.png');
  background-position: center;
  background-size: cover;
}
.airo-hero::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: .28;
  background-image:
    linear-gradient(rgba(199,255,61,.08) 1px, transparent 1px),
    linear-gradient(90deg, rgba(199,255,61,.08) 1px, transparent 1px);
  background-size: 80px 80px;
  mask-image: linear-gradient(90deg, #000 0%, transparent 66%);
}
.airo-hero-content { position: relative; z-index: 2; padding-top: 110px; }
.airo-kicker { display: flex; align-items: center; gap: 10px; }
.airo-kicker::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--airo-lime); box-shadow: 0 0 18px var(--airo-lime); }
.airo-hero h1 { max-width: 760px; letter-spacing: -.055em; }
.airo-hero-copy { max-width: 590px; }
.wp-block-button.is-style-outline > .wp-block-button__link:hover { border-color: var(--airo-lime); color: var(--airo-lime); }
.wp-block-button:not(.is-style-outline) > .wp-block-button__link:hover { transform: translateY(-2px); box-shadow: 0 14px 35px rgba(199,255,61,.2); }
.wp-block-button__link { transition: .22s ease; }

.airo-section { border-top: 1px solid var(--airo-line); }
.airo-card {
  height: 100%;
  box-sizing: border-box;
  border: 1px solid var(--airo-line);
  background: linear-gradient(145deg, rgba(255,255,255,.045), rgba(255,255,255,.012));
  transition: transform .25s ease, border-color .25s ease, background .25s ease;
}
.airo-card:hover { transform: translateY(-6px); border-color: rgba(199,255,61,.52); background: rgba(199,255,61,.035); }
.airo-number { color: var(--airo-lime); font-variant-numeric: tabular-nums; }
.airo-metric { border-left: 1px solid rgba(199,255,61,.45); }
.airo-footer { border-top: 1px solid var(--airo-line); }

@media (max-width: 900px) {
  .airo-header { position: relative; background: var(--airo-ink); }
  .airo-header .wp-block-navigation__responsive-container.is-menu-open { background: var(--airo-ink); color: var(--airo-white); }
  .airo-hero { min-height: 760px; background-position: 64% center; }
  .airo-hero-content { padding-top: 36px; }
  .airo-hero h1 { font-size: clamp(3rem, 12vw, 5.2rem) !important; }
}

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