/* ================================================================
   WDA GLOBAL CSS — FRONTEND ONLY
   Loaded via wp_enqueue_scripts (not in Elementor editor).
   Design tokens are in wda-tokens.css which loads everywhere.
   ================================================================ */


/* ================================================================
   1. BASE RESET — frontend only
   ================================================================ */
html { scroll-behavior: smooth; }

body {
  background-color: var(--wda-obsidian) !important;
  color:            var(--wda-parchment) !important;
  font-family:      var(--wda-font-body) !important;
  overflow-x:       hidden;
}

*:focus {
  outline-color: color-mix(in srgb, var(--wda-bronze) 50%, transparent);
}


/* ================================================================
   2. CUSTOM SCROLLBAR
   ================================================================ */
::-webkit-scrollbar       { width: 4px; }
::-webkit-scrollbar-track { background: var(--wda-obsidian); }
::-webkit-scrollbar-thumb { background: var(--wda-charcoal); border-radius: 2px; }


/* ================================================================
   3. UTILITY CLASSES
   ================================================================ */
.wda-text-bronze    { color: var(--wda-bronze)    !important; }
.wda-text-parchment { color: var(--wda-parchment) !important; }
.wda-text-muted     { color: var(--wda-muted)     !important; }
.wda-bg-obsidian    { background-color: var(--wda-obsidian) !important; }
.wda-bg-ebony       { background-color: var(--wda-ebony)    !important; }
.wda-font-mono      { font-family: var(--wda-font-mono) !important; }
.wda-hairline-top   { border-top:    0.5px solid var(--wda-charcoal) !important; }
.wda-hairline-bottom{ border-bottom: 0.5px solid var(--wda-charcoal) !important; }

.wda-w-label {
  font-family:    var(--wda-font-mono);
  font-size:      0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.3em;
  color:          var(--wda-bronze);
  display:        block;
  margin-bottom:  1.5rem;
}
.wda-w-heading {
  font-size:      clamp(2rem, 5vw, 64px);
  font-weight:    700;
  text-transform: uppercase;
  line-height:    0.9;
  letter-spacing: -0.04em;
  color:          var(--wda-parchment);
}
.wda-w-heading .dim    { color: var(--wda-muted);  }
.wda-w-heading .accent { color: var(--wda-bronze); }

.wda-sr-only {
  position:   absolute;
  width:      1px; height: 1px;
  padding:    0; margin: -1px;
  overflow:   hidden;
  clip:       rect(0,0,0,0);
  white-space:nowrap;
  border:     0;
}


/* ================================================================
   4. KEYFRAME ANIMATIONS
   ================================================================ */
@keyframes wda-marquee-h {
  0%   { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}
@keyframes wda-marquee-v {
  0%   { transform: translateY(0); }
  100% { transform: translateY(-50%); }
}
@keyframes wda-fade-up {
  from { opacity: 0; transform: translateY(20px); }
  to   { opacity: 1; transform: translateY(0); }
}
@keyframes wda-scale-blur-in {
  0%   { transform: scale(1.12); filter: blur(8px);  opacity: 0; }
  100% { transform: scale(1);    filter: blur(0px); opacity: 1; }
}
@keyframes wda-float-tag-in {
  from { opacity: 0; transform: scale(0.6); }
  to   { opacity: 1; transform: scale(1);   }
}
@keyframes wda-nav-slide-in {
  from { transform: translateY(-100%); }
  to   { transform: translateY(0); }
}


/* ================================================================
   5. SCROLL REVEAL
   ================================================================ */
.wda-reveal {
  opacity:    0;
  transform:  translateY(30px);
  transition: opacity 0.8s ease, transform 0.8s ease;
}
.wda-reveal.wda-visible {
  opacity:   1;
  transform: translateY(0);
}
.wda-reveal-left {
  opacity:    0;
  transform:  translateX(-30px);
  transition: opacity 0.8s ease, transform 0.8s ease;
}
.wda-reveal-left.wda-visible {
  opacity:   1;
  transform: translateX(0);
}
.wda-reveal-scale {
  opacity:    0;
  transform:  scale(1.05);
  transition: opacity 1s ease, transform 1s ease;
}
.wda-reveal-scale.wda-visible {
  opacity:   1;
  transform: scale(1);
}


/* ================================================================
   6. NAVBAR
   ================================================================ */
.wda-header-section {
  width:      100% !important;
  padding:    0 !important;
  margin:     0 !important;
  background: transparent !important;
  transition: background 0.5s ease, backdrop-filter 0.5s ease !important;
  animation:  wda-nav-slide-in 0.8s cubic-bezier(0.25,0.46,0.45,0.94) forwards;
}
.wda-header-section.wda-nav-scrolled {
  backdrop-filter:         blur(20px) saturate(180%) !important;
  -webkit-backdrop-filter: blur(20px) saturate(180%) !important;
  background: color-mix(in srgb, var(--wda-obsidian) 70%, transparent) !important;
}
.wda-header-inner {
  display:         flex !important;
  align-items:     center !important;
  justify-content: space-between !important;
  height:          80px !important;
  max-width:       1800px !important;
  margin:          0 auto !important;
  padding:         0 3rem !important;
}
@media (max-width:767px) {
  .wda-header-inner { padding: 0 1.5rem !important; }
}
.wda-logo-wrap  { display:flex; align-items:center; text-decoration:none !important; flex-shrink:0; }
.wda-logo-text  { font-family:var(--wda-font-body) !important; font-size:1.5rem !important; font-weight:700 !important; letter-spacing:-0.05em !important; color:var(--wda-parchment) !important; line-height:1 !important; }
.wda-logo-dot   { color:var(--wda-bronze) !important; }

.wda-nav-links-wrap { display:flex; align-items:center; gap:2.5rem; }
@media (max-width:767px) { .wda-nav-links-wrap { display:none !important; } }

.wda-nav-item {
  font-family:    var(--wda-font-mono) !important;
  font-size:      0.75rem !important;
  text-transform: uppercase !important;
  letter-spacing: 0.2em !important;
  color:          var(--wda-muted) !important;
  text-decoration:none !important;
  transition:     color 0.3s !important;
}
.wda-nav-item:hover,
.wda-nav-item.wda-active { color: var(--wda-bronze) !important; }

.wda-nav-right { display:flex; align-items:center; gap:1rem; flex-shrink:0; }

.wda-nav-cta-btn {
  display:         inline-flex !important;
  align-items:     center !important;
  gap:             0.5rem !important;
  padding:         0.75rem 1.5rem !important;
  background:      var(--wda-bronze) !important;
  color:           var(--wda-obsidian) !important;
  font-family:     var(--wda-font-body) !important;
  font-size:       0.75rem !important;
  font-weight:     700 !important;
  text-transform:  uppercase !important;
  letter-spacing:  0.15em !important;
  text-decoration: none !important;
  border:          none !important;
  border-radius:   0 !important;
  transition:      background 0.3s !important;
  line-height:     1 !important;
}
.wda-nav-cta-btn:hover { background:var(--wda-parchment) !important; color:var(--wda-obsidian) !important; }
@media (max-width:767px) { .wda-nav-cta-btn { display:none !important; } }

.wda-hamburger {
  display:none !important; background:none !important; border:none !important;
  color:var(--wda-parchment) !important; cursor:pointer !important;
  padding:0.5rem !important; align-items:center !important; justify-content:center !important;
}
@media (max-width:767px) { .wda-hamburger { display:flex !important; } }
.wda-hamburger svg { width:24px; height:24px; stroke:currentColor; fill:none; stroke-width:2; stroke-linecap:round; }

#wda-mobile-menu {
  position:       fixed;
  inset:          0;
  z-index:        9999;
  background:     var(--wda-obsidian);
  display:        flex;
  flex-direction: column;
  opacity:        0;
  pointer-events: none;
  transition:     opacity 0.3s ease;
}
#wda-mobile-menu.wda-menu-open { opacity:1; pointer-events:all; }

.wda-mobile-menu-header {
  display:         flex;
  align-items:     center;
  justify-content: space-between;
  padding:         0 1.5rem;
  height:          80px;
  flex-shrink:     0;
  border-bottom:   0.5px solid var(--wda-charcoal);
}
.wda-mobile-close {
  background:none !important; border:none !important;
  color:var(--wda-parchment) !important; cursor:pointer !important;
  padding:0.5rem !important; display:flex; align-items:center; justify-content:center;
}
.wda-mobile-close svg { width:24px; height:24px; stroke:currentColor; fill:none; stroke-width:2; stroke-linecap:round; }

.wda-mobile-menu-links {
  flex:1; display:flex; flex-direction:column;
  justify-content:center; padding:0 1.5rem; gap:2rem;
}
.wda-mobile-link {
  font-size:       2.5rem !important;
  font-weight:     700 !important;
  color:           var(--wda-parchment) !important;
  text-transform:  uppercase !important;
  letter-spacing:  -0.03em !important;
  text-decoration: none !important;
  display:         block !important;
  opacity:         0;
  transform:       translateX(-40px);
  transition:      color 0.3s, opacity 0.3s, transform 0.3s !important;
}
#wda-mobile-menu.wda-menu-open .wda-mobile-link { opacity:1; transform:translateX(0); }
#wda-mobile-menu.wda-menu-open .wda-mobile-link:nth-child(1) { transition-delay:0.05s; }
#wda-mobile-menu.wda-menu-open .wda-mobile-link:nth-child(2) { transition-delay:0.10s; }
#wda-mobile-menu.wda-menu-open .wda-mobile-link:nth-child(3) { transition-delay:0.15s; }
#wda-mobile-menu.wda-menu-open .wda-mobile-link:nth-child(4) { transition-delay:0.20s; }
#wda-mobile-menu.wda-menu-open .wda-mobile-link:nth-child(5) { transition-delay:0.25s; }
.wda-mobile-link:hover { color:var(--wda-bronze) !important; }

.wda-mobile-menu-footer {
  padding:     1.5rem;
  border-top:  0.5px solid var(--wda-charcoal);
  display:     flex;
  align-items: center;
  justify-content:space-between;
  flex-wrap:   wrap;
  gap:         1rem;
}
.wda-mobile-menu-footer a {
  font-family:    var(--wda-font-mono);
  font-size:      0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.2em;
  color:          var(--wda-muted);
  text-decoration:none;
  transition:     color 0.3s;
}
.wda-mobile-menu-footer a:hover { color:var(--wda-bronze); }


/* ================================================================
   8. ABOUT SECTION
   ================================================================ */
.wda-about-section { padding:8rem 0; background:var(--wda-obsidian); }
@media (min-width:768px)  { .wda-about-section { padding:10rem 0; } }
@media (min-width:1024px) { .wda-about-section { padding:12rem 0; } }
.wda-about-grid { display:grid; grid-template-columns:1fr; gap:4rem; align-items:center; }
@media (min-width:1024px) { .wda-about-grid { grid-template-columns:1fr 1fr; gap:6rem; } }
.wda-about-image-wrap { position:relative; overflow:hidden; aspect-ratio:4/5; }
.wda-about-image-wrap img { width:100%; height:100%; object-fit:cover; }
.wda-about-image-overlay {
  position:   absolute; inset:0;
  background: linear-gradient(to top, color-mix(in srgb, var(--wda-obsidian) 40%, transparent), transparent);
}
.wda-stat-block { border-top:0.5px solid var(--wda-charcoal); padding-top:1.5rem; }
.wda-stat-num   { font-size:2.25rem; font-weight:700; color:var(--wda-parchment); }
.wda-stat-lbl   { font-family:var(--wda-font-mono); font-size:0.75rem; text-transform:uppercase; letter-spacing:0.15em; color:var(--wda-muted); margin-top:0.5rem; }


/* ================================================================
   9. FLOATING SCROLL-TO-TOP
   ================================================================ */
#wda-floating-cta {
  position:       fixed;
  bottom:2rem; right:2rem;
  z-index:        999;
  opacity:        0;
  transform:      translateY(20px);
  pointer-events: none;
  transition:     opacity 0.3s, transform 0.3s;
}
#wda-floating-cta.visible { opacity:1; transform:translateY(0); pointer-events:all; }
#wda-scroll-top {
  width:3rem; height:3rem;
  background:  var(--wda-ebony);
  border:      1px solid var(--wda-charcoal);
  color:       var(--wda-parchment);
  display:     flex; align-items:center; justify-content:center;
  cursor:      pointer;
  transition:  border-color 0.3s, color 0.3s;
}
#wda-scroll-top:hover { border-color:var(--wda-bronze); color:var(--wda-bronze); }


/* ================================================================
   10. ELEMENTOR OVERRIDES — frontend only
   ================================================================ */
.elementor-section,
.elementor-container,
.e-con,
.e-con-inner { --e-con-gap:0px; }

.wda-no-pad > .elementor-column-wrap,
.wda-no-pad > .elementor-widget-wrap { padding:0 !important; }

.elementor-widget a { color:inherit; }
