/* ============================================================
   MAX INDUSTRIAL TECHNOLOGIES — Design System
   Overrides Sitejet bundle. Depends on tokens.css.
   ============================================================ */

/* ── Global ─────────────────────────────────────────────── */
body {
  font-family: var(--font-body);
  color: var(--color-text-primary);
  background: var(--color-bg-primary);
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6,
.ed-headline h1, .ed-headline h2, .ed-headline h3 {
  font-family: var(--font-display);
  letter-spacing: var(--tracking-wide);
  line-height: var(--leading-snug);
  text-transform: uppercase;
}

a { color: var(--color-accent); transition: color var(--dur-fast) var(--ease); }
a:hover { color: var(--color-accent-hover); text-decoration: none; }

/* ── Header / Nav ────────────────────────────────────────── */
/* ID selector beats Sitejet's double-class !important rules */
#ed-1178927297,
.ed-element.preset-menu-v2-home-logo-nav-h1-image-text-menu,
.menu-wrapper {
  background: var(--color-header-bg) !important;
  border-bottom: 1px solid rgba(255,255,255,.06) !important;
  box-shadow: 0 2px 24px rgba(0,0,0,.40) !important;
}

#ed-1178927297.sticky,
.menu-wrapper.sticky {
  background: rgba(29,65,112,.97) !important;
  backdrop-filter: blur(8px);
}

/* Logo text — significantly wider tracking */
#ed-1178927300 h1,
#ed-1178927300 span,
.menu-wrapper .ed-logo h1,
.menu-wrapper .ed-logo span {
  color: var(--white) !important;
  font-family: var(--font-display) !important;
  font-size: clamp(var(--text-base), 2vw, var(--text-xl)) !important;
  font-weight: var(--weight-bold) !important;
  letter-spacing: 0.22em !important;
  text-transform: uppercase !important;
}

/* Logo link */
#ed-1178927300 a,
.menu-wrapper .ed-logo a {
  color: var(--white) !important;
  text-decoration: none !important;
}
#ed-1178927300 a:hover,
.menu-wrapper .ed-logo a:hover {
  color: rgba(255,255,255,.80) !important;
  text-decoration: none !important;
}

/* Nav list — spread items across width with generous gap */
@media (min-width: 976px) {
  #ed-1178927312 ul.menu-level-0,
  .menu-wrapper .ed-menu ul.menu-level-0 {
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: var(--space-8) !important;
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
    align-items: center !important;
  }
}

/* Nav links — wide tracking for a premium header feel */
#ed-1178927297 .ed-menu a,
#ed-1178927312 a,
.menu-wrapper .ed-menu a {
  color: rgba(255,255,255,.92) !important;
  font-family: var(--font-body) !important;
  font-size: var(--text-sm) !important;
  font-weight: var(--weight-semibold) !important;
  letter-spacing: 0.11em !important;
  text-transform: uppercase !important;
  padding: 6px 4px !important;
  border-radius: var(--radius-sm) !important;
  transition: color var(--dur-fast) var(--ease) !important;
}

#ed-1178927297 .ed-menu a:hover,
#ed-1178927297 .ed-menu a.active,
.menu-wrapper .ed-menu a:hover,
.menu-wrapper .ed-menu a.active {
  color: var(--teal-400) !important;
  text-decoration: none !important;
  background: transparent !important;
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
}

/* Kill Sitejet's active-state box (likely a pseudo-element overlay) */
#ed-1178927297 .ed-menu a::after,
#ed-1178927297 .ed-menu a::before,
#ed-1178927312 a::after,
#ed-1178927312 a::before {
  display: none !important;
  content: none !important;
  border: none !important;
}
/* Replace box with a clean bottom accent */
#ed-1178927297 #ed-1178927312 a.active {
  color: var(--teal-400) !important;
  border: none !important;
  border-bottom: 2px solid var(--teal-400) !important;
  background: transparent !important;
  outline: none !important;
  box-shadow: none !important;
  padding-bottom: 4px !important;
}

/* Phone icon — hidden (empty href) */
#ed-1178927306 { display: none !important; }

/* CTA button — removed per design decision */
#ed-1178928062 { display: none !important; }

/* Header inner — match lower section width */
#ed-1178927297 > header.inner,
#main-nav {
  max-width: var(--max-wide) !important;
  width: 100% !important;
  padding-left: var(--space-7) !important;
  padding-right: var(--space-7) !important;
}

/* Hamburger */
.menu-trigger-inner,
.menu-trigger-inner::before,
.menu-trigger-inner::after {
  background: var(--white) !important;
}

/* ── Language Switcher ───────────────────────────────────── */
.lang-switcher {
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
  margin-left: 20px !important;
}

.lang-btn {
  display: flex !important;
  align-items: center !important;
  gap: 5px !important;
  text-decoration: none !important;
  color: rgba(255,255,255,.65) !important;
  font-family: var(--font-body) !important;
  font-size: var(--text-xs) !important;
  font-weight: var(--weight-bold) !important;
  letter-spacing: var(--tracking-wider) !important;
  padding: 4px 8px !important;
  border: 1px solid rgba(255,255,255,.18) !important;
  border-radius: var(--radius-full) !important;
  transition: all var(--dur-fast) var(--ease) !important;
  white-space: nowrap !important;
  background: transparent !important;
  opacity: 1 !important;
}

.lang-btn:hover {
  color: var(--white) !important;
  border-color: rgba(255,255,255,.45) !important;
  background: rgba(255,255,255,.08) !important;
}

.lang-btn.lang-active {
  color: var(--white) !important;
  background: var(--color-accent) !important;
  border-color: var(--color-accent) !important;
}

.lang-flag {
  width: 18px !important;
  height: 18px !important;
  border-radius: 50% !important;
  object-fit: cover !important;
  display: block !important;
  flex-shrink: 0 !important;
  border: 1px solid rgba(255,255,255,.25) !important;
}

/* ── Hero ────────────────────────────────────────────────── */
.preset-fullscreen-text-on-background-v2-home-logo-nav-h1-image-text {
  min-height: 44vh !important;
  position: relative !important;
}

.preset-fullscreen-text-on-background-v2-home-logo-nav-h1-image-text::after {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  background: linear-gradient(
    135deg,
    rgba(17,24,39,.82) 0%,
    rgba(17,24,39,.52) 60%,
    rgba(17,24,39,.28) 100%
  ) !important;
  pointer-events: none !important;
}

.text-on-background-content { position: relative; z-index: 2; }

.text-on-background-content .ed-headline h2,
.text-on-background-content .ed-headline h2 span {
  font-size: clamp(var(--text-2xl), 5vw, var(--text-4xl)) !important;
  font-weight: var(--weight-bold) !important;
  color: var(--white) !important;
  text-shadow: 0 2px 16px rgba(0,0,0,.5) !important;
  letter-spacing: 0.18em !important;
}

.text-on-background-content .ed-text p {
  font-size: clamp(var(--text-base), 2vw, var(--text-md)) !important;
  color: rgba(255,255,255,.88) !important;
  max-width: 560px !important;
  line-height: var(--leading-relaxed) !important;
  text-shadow: 0 1px 6px rgba(0,0,0,.3) !important;
}

/* ── Services ────────────────────────────────────────────── */
#ed-1178926172 {
  background: var(--color-bg-secondary) !important;
}

/* Outer preset container: no visual box, allow content to breathe */
.preset-boxes-v3-services2,
#ed-1178926181 {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  overflow: visible !important;
}

/* Card appearance — no overflow:hidden, let Sitejet manage the grid layout */
.boxes-box {
  background: var(--white) !important;
  border: 1px solid var(--color-border-primary) !important;
  border-radius: var(--radius-lg) !important;
  box-shadow: var(--shadow-sm) !important;
  transition: transform var(--dur-normal) var(--ease),
              box-shadow var(--dur-normal) var(--ease),
              border-color var(--dur-normal) var(--ease) !important;
  position: relative !important;
}

.boxes-box::before {
  content: '' !important;
  position: absolute !important;
  top: 0; left: 0; right: 0 !important;
  height: 3px !important;
  background: var(--color-accent) !important;
  border-radius: var(--radius-lg) var(--radius-lg) 0 0 !important;
  transform: scaleX(0) !important;
  transform-origin: left !important;
  transition: transform var(--dur-normal) var(--ease) !important;
  z-index: 1 !important;
}

.boxes-box:hover {
  transform: translateY(-4px) !important;
  box-shadow: var(--shadow-lg) !important;
  border-color: var(--color-accent) !important;
}

.boxes-box:hover::before { transform: scaleX(1) !important; }

/* Card inner — padding-top makes room for the absolutely-placed icon */
#ed-1178926181 .boxes-box > .inner {
  padding: var(--space-8) var(--space-6) var(--space-6) var(--space-6) !important;
  box-sizing: border-box !important;
  position: relative !important;
}

/* Inner text wrapper: no visual box */
.boxes-box-inner,
.boxes-box-inner > .inner {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  width: 100% !important;
}

/* Icon — anchored top-left, above the text */
#ed-1178926181 .boxes-icon {
  position: absolute !important;
  top: var(--space-6) !important;
  left: var(--space-6) !important;
  background: var(--color-accent-muted) !important;
  padding: 10px !important;
  border-radius: var(--radius-md) !important;
  width: 48px !important;
  height: 48px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

#ed-1178926181 .boxes-icon svg {
  fill: var(--color-accent) !important;
  width: 24px !important;
  height: 24px !important;
  max-width: 24px !important;
  max-height: 24px !important;
}

.boxes-box .ed-headline h3 {
  font-size: var(--text-md) !important;
  font-weight: var(--weight-bold) !important;
  color: var(--color-text-primary) !important;
  letter-spacing: var(--tracking-wide) !important;
  margin: 0 !important;
}

.boxes-box .ed-text p {
  font-size: var(--text-sm) !important;
  color: var(--color-text-secondary) !important;
  line-height: var(--leading-relaxed) !important;
  margin: 0 !important;
}

/* Services section title */
#ed-1178926172 .ed-headline h2 {
  font-size: clamp(var(--text-xl), 3vw, var(--text-3xl)) !important;
  color: var(--color-text-primary) !important;
  position: relative !important;
  padding-bottom: var(--space-5) !important;
}

#ed-1178926172 .ed-headline h2::after {
  content: '' !important;
  position: absolute !important;
  bottom: 0; left: 50% !important;
  transform: translateX(-50%) !important;
  width: 48px; height: 3px !important;
  background: var(--color-accent) !important;
  border-radius: var(--radius-full) !important;
}

/* ── CTA Band ────────────────────────────────────────────── */
.preset-text-v2-cta-1 {
  background: var(--color-cta-bg) !important;
  border-top: 1px solid rgba(255,255,255,.07) !important;
  border-bottom: 1px solid rgba(255,255,255,.07) !important;
}

.preset-text-v2-cta-1 .ed-headline h2,
.preset-text-v2-cta-1 .ed-headline h2 span {
  font-size: clamp(var(--text-xl), 3.5vw, var(--text-3xl)) !important;
  color: var(--white) !important;
  letter-spacing: var(--tracking-wide) !important;
}

.preset-text-v2-cta-1 .ed-text p,
.preset-text-v2-cta-1 .ed-text span {
  color: var(--steel-200) !important;
  font-size: var(--text-md) !important;
}

.preset-text-v2-cta-1 .ed-button a,
.preset-text-v2-cta-1 .button {
  background: var(--color-accent) !important;
  color: var(--white) !important;
  border: 2px solid var(--color-accent) !important;
  border-radius: var(--radius-md) !important;
  font-family: var(--font-body) !important;
  font-weight: var(--weight-bold) !important;
  font-size: var(--text-base) !important;
  letter-spacing: var(--tracking-wide) !important;
  text-transform: uppercase !important;
  padding: 14px 36px !important;
  transition: background var(--dur-fast) var(--ease),
              transform var(--dur-fast) var(--ease-bounce),
              box-shadow var(--dur-fast) var(--ease) !important;
  text-decoration: none !important;
}

.preset-text-v2-cta-1 .ed-button a:hover,
.preset-text-v2-cta-1 .button:hover {
  background: var(--color-accent-hover) !important;
  border-color: var(--color-accent-hover) !important;
  transform: translateY(-2px) !important;
  box-shadow: 0 6px 20px rgba(13,148,136,.35) !important;
  text-decoration: none !important;
}

/* ── Contact / Form ──────────────────────────────────────── */
#ed-1178926460 h2 {
  font-size: clamp(var(--text-xl), 3vw, var(--text-3xl)) !important;
  color: var(--color-text-primary) !important;
  position: relative !important;
  padding-bottom: var(--space-5) !important;
}

#ed-1178926460 h2::after {
  content: '' !important;
  position: absolute !important;
  bottom: 0; left: 50% !important;
  transform: translateX(-50%) !important;
  width: 48px; height: 3px !important;
  background: var(--color-accent) !important;
  border-radius: var(--radius-full) !important;
}

.ed-form-input input,
.ed-form-email input,
.ed-form-textarea textarea {
  background: var(--gray-50) !important;
  border: 1.5px solid var(--color-border-primary) !important;
  border-radius: var(--radius-md) !important;
  padding: 12px 16px !important;
  font-family: var(--font-body) !important;
  font-size: var(--text-base) !important;
  color: var(--color-text-primary) !important;
  width: 100% !important;
  transition: border-color var(--dur-fast) var(--ease),
              box-shadow var(--dur-fast) var(--ease),
              background var(--dur-fast) var(--ease) !important;
  outline: none !important;
}

.ed-form-input input:focus,
.ed-form-email input:focus,
.ed-form-textarea textarea:focus {
  border-color: var(--color-accent) !important;
  background: var(--white) !important;
  box-shadow: var(--shadow-focus) !important;
}

.ed-form-textarea textarea { resize: vertical !important; min-height: 100px !important; }

.ed-form-button button,
#w3f-contact-form button[type="submit"] {
  background: var(--color-accent) !important;
  color: var(--white) !important;
  border: 2px solid var(--color-accent) !important;
  border-radius: var(--radius-md) !important;
  font-family: var(--font-body) !important;
  font-weight: var(--weight-bold) !important;
  font-size: var(--text-base) !important;
  letter-spacing: var(--tracking-wide) !important;
  text-transform: uppercase !important;
  padding: 14px 36px !important;
  cursor: pointer !important;
  transition: background var(--dur-fast) var(--ease),
              border-color var(--dur-fast) var(--ease),
              transform var(--dur-fast) var(--ease-bounce) !important;
  width: 100% !important;
}

.ed-form-button button:hover,
#w3f-contact-form button[type="submit"]:hover {
  background: var(--color-accent-hover) !important;
  border-color: var(--color-accent-hover) !important;
  transform: translateY(-1px) !important;
}

.ed-form-button button:disabled,
#w3f-contact-form button[type="submit"]:disabled {
  opacity: .6 !important;
  cursor: not-allowed !important;
  transform: none !important;
}

/* Form messages */
.wv-message {
  padding: 12px 16px !important;
  border-radius: var(--radius-md) !important;
  font-size: var(--text-sm) !important;
  font-weight: var(--weight-medium) !important;
  margin-top: var(--space-3) !important;
}
.wv-success {
  background: #E8F5EE !important;
  color: var(--color-status-success) !important;
  border: 1px solid #A3D4B5 !important;
}
.wv-error {
  background: #FDF0EE !important;
  color: var(--color-status-error) !important;
  border: 1px solid #F0B8AE !important;
}

/* Privacy checkbox */
.ed-form-checkbox label p { color: var(--color-text-secondary) !important; font-size: var(--text-sm) !important; }
.ed-form-checkbox label p a { color: var(--color-accent) !important; }

/* ── Footer ──────────────────────────────────────────────── */
.footer {
  background: var(--color-footer-bg) !important;
  border-top: 1px solid rgba(255,255,255,.06) !important;
}

.footer .ed-logo h1,
.footer .ed-logo span {
  color: var(--white) !important;
  font-family: var(--font-display) !important;
  font-weight: var(--weight-bold) !important;
  letter-spacing: var(--tracking-wide) !important;
  text-transform: uppercase !important;
}

.footer .ed-headline h3 {
  color: var(--white) !important;
  font-size: var(--text-base) !important;
  letter-spacing: var(--tracking-wider) !important;
  border-bottom: 1px solid rgba(255,255,255,.10) !important;
  padding-bottom: var(--space-3) !important;
  margin-bottom: var(--space-3) !important;
}

.footer .ed-text p,
.footer .description p {
  color: var(--color-footer-text) !important;
  font-size: var(--text-sm) !important;
  line-height: var(--leading-relaxed) !important;
}

.footer .ed-menu a {
  color: var(--steel-300) !important;
  font-size: var(--text-sm) !important;
  padding: 3px 0 !important;
  transition: color var(--dur-fast) var(--ease) !important;
}

.footer .ed-menu a:hover { color: var(--teal-400) !important; text-decoration: none !important; }

.footer .ed-text a {
  color: var(--steel-300) !important;
  font-size: var(--text-sm) !important;
  transition: color var(--dur-fast) var(--ease) !important;
}
.footer .ed-text a:hover { color: var(--teal-400) !important; }

/* Company name in footer — force single line */
.footer-company-name {
  white-space: nowrap !important;
  display: inline-block !important;
}

/* Footer contact column — 20% wider than siblings */
#ed-1178926337 {
  flex: 1.2 !important;
}
#ed-1178926325,
#ed-1178926349 {
  flex: 0.9 !important;
}

/* ── Responsive tweaks ───────────────────────────────────── */
@media (max-width: 768px) {
  .lang-btn span { display: none !important; }
  .lang-btn { padding: 4px 6px !important; }
  .lang-flag { width: 22px !important; height: 22px !important; }
}

@media (max-width: 480px) {
  .lang-switcher { gap: 2px !important; margin-left: 8px !important; }
}