/* ============================================
   SWA 3D Enhance — glass · tilt · glow · particles
   White canvas · dark green CTAs · white button text
   ============================================ */

:root {
  --swa3d-green: #1e7a35;
  --swa3d-green-deep: #145524;
  --swa3d-green-soft: rgba(30, 122, 53, 0.12);
  --swa3d-white: #ffffff;
  --swa3d-ink: #131615;
  --swa3d-muted: #5a6b60;
  --swa3d-line: rgba(30, 122, 53, 0.16);
  --swa3d-ease: cubic-bezier(0.22, 1, 0.36, 1);
}

/* Hard brand lock */
body.swa-desk {
  background: #ffffff !important;
  color: var(--swa3d-ink);
}

body.swa-desk .theme-btn.btn-one,
body.swa-desk a.theme-btn.btn-one,
body.swa-desk button.theme-btn.btn-one,
body.swa-desk .hero-actions .btn-one {
  background: var(--swa3d-green) !important;
  border: 1px solid var(--swa3d-green) !important;
  color: #ffffff !important;
  box-shadow: 0 12px 28px rgba(30, 122, 53, 0.28) !important;
}

body.swa-desk .theme-btn.btn-one:hover,
body.swa-desk .hero-actions .btn-one:hover {
  background: var(--swa3d-green-deep) !important;
  border-color: var(--swa3d-green-deep) !important;
  color: #ffffff !important;
}

body.swa-desk .theme-btn.btn-two,
body.swa-desk a.theme-btn.btn-two,
body.swa-desk button.theme-btn.btn-two {
  background: transparent !important;
  border: 1px solid var(--swa3d-green) !important;
  color: var(--swa3d-green) !important;
}

body.swa-desk .theme-btn.btn-two:hover {
  background: var(--swa3d-green) !important;
  color: #ffffff !important;
}

body.swa-desk .theme-btn:focus-visible,
body.swa-desk a:focus-visible,
body.swa-desk button:focus-visible {
  outline: 2px solid var(--swa3d-green);
  outline-offset: 3px;
}

/* ---- Glow backdrop ---- */
.swa-glow {
  position: absolute;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
  z-index: 0;
}
.swa-glow__orb {
  position: absolute;
  border-radius: 50%;
  filter: blur(48px);
  opacity: 0.55;
  will-change: transform;
}
.swa-glow__orb--a {
  width: min(52vw, 480px);
  height: min(52vw, 480px);
  top: -18%;
  right: -8%;
  background: radial-gradient(circle, rgba(34, 130, 58, 0.55), transparent 68%);
  animation: swaOrbA 14s ease-in-out infinite;
}
.swa-glow__orb--b {
  width: min(40vw, 360px);
  height: min(40vw, 360px);
  bottom: -20%;
  left: -6%;
  background: radial-gradient(circle, rgba(20, 85, 36, 0.4), transparent 70%);
  animation: swaOrbB 18s ease-in-out infinite;
}
.swa-glow__grid {
  position: absolute;
  inset: 0;
  opacity: 0.22;
  background-image:
    linear-gradient(rgba(255, 255, 255, 0.07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, 0.07) 1px, transparent 1px);
  background-size: 44px 44px;
  mask-image: radial-gradient(ellipse at 70% 40%, #000 20%, transparent 75%);
}
.swa-glow--section .swa-glow__orb--a {
  background: radial-gradient(circle, rgba(34, 130, 58, 0.18), transparent 70%);
}
.swa-glow--section .swa-glow__grid {
  background-image:
    linear-gradient(rgba(30, 122, 53, 0.06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(30, 122, 53, 0.06) 1px, transparent 1px);
  mask-image: radial-gradient(ellipse at 50% 40%, #000 10%, transparent 70%);
  opacity: 0.7;
}

@keyframes swaOrbA {
  0%, 100% { transform: translate(0, 0) scale(1); }
  50% { transform: translate(-28px, 22px) scale(1.08); }
}
@keyframes swaOrbB {
  0%, 100% { transform: translate(0, 0) scale(1); }
  50% { transform: translate(24px, -18px) scale(1.1); }
}

/* ---- Particle canvas host ---- */
.swa-particle-host {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  opacity: 0.85;
}
.swa-particle-host canvas {
  width: 100% !important;
  height: 100% !important;
  display: block;
}
.swa-particle-fallback {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 70% 30%, rgba(34, 130, 58, 0.25), transparent 45%),
    radial-gradient(circle at 20% 80%, rgba(20, 85, 36, 0.18), transparent 40%);
}

/* ---- Banner enhance ---- */
.banner-section .banner-slide {
  position: relative;
  isolation: isolate;
}
.banner-section .banner-slide.is-swa3d .content-box,
.banner-section .banner-slide.is-swa3d .hero-stage,
.banner-section .banner-slide.is-swa3d .banner-progress,
.banner-section .banner-dots {
  position: relative;
  z-index: 3;
}
.banner-section .swa-3d-layer {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  overflow: hidden;
  border-radius: inherit;
}

/* Floating hero assets — positioning owned by home-ux.css */
.hero-stage {
  transform-style: preserve-3d;
}
.hero-stage img,
.swa-float-asset {
  transition: filter 0.35s var(--swa3d-ease);
  will-change: transform;
  filter: drop-shadow(0 18px 30px rgba(0, 0, 0, 0.35));
}
/* Disable competing float class — home-ux handles bob */
.hero-stage.is-swa-float img {
  /* keep home-ux keyframes */
}

/* ---- Glass tilt cards ---- */
[data-swa-tilt],
.account-card,
.trading-card,
.news-card,
.pricing-card,
.price-card,
.funfact-card,
.feature-block {
  transform-style: preserve-3d;
  transform: perspective(900px) rotateX(0) rotateY(0);
  transition:
    transform 0.35s var(--swa3d-ease),
    box-shadow 0.35s ease,
    border-color 0.35s ease;
  will-change: transform;
}

.swa-glass,
body.swa-desk .account-card,
body.swa-desk .trading-card,
body.swa-desk .news-card,
body.swa-desk .pricing-card,
body.swa-desk .price-card,
body.swa-desk .funfact-card {
  background: linear-gradient(155deg, rgba(255, 255, 255, 0.92), rgba(244, 248, 245, 0.82)) !important;
  border: 1px solid var(--swa3d-line) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.85),
    0 16px 40px rgba(19, 22, 21, 0.07);
  backdrop-filter: blur(12px) saturate(1.12);
  -webkit-backdrop-filter: blur(12px) saturate(1.12);
  position: relative;
  overflow: hidden;
}

.swa-glass::after,
body.swa-desk .account-card.swa-tilt-ready::after,
body.swa-desk .trading-card.swa-tilt-ready::after,
body.swa-desk .pricing-card.swa-tilt-ready::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.3s ease;
  background: radial-gradient(circle at var(--glare-x, 50%) var(--glare-y, 40%), rgba(255, 255, 255, 0.45), transparent 55%);
  z-index: 2;
}
.swa-tilt-ready:hover::after { opacity: 1; }

body.swa-desk .account-card:hover,
body.swa-desk .trading-card:hover,
body.swa-desk .news-card:hover,
body.swa-desk .pricing-card:hover,
body.swa-desk .price-card:hover,
body.swa-desk .funfact-card:hover {
  border-color: rgba(30, 122, 53, 0.4) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.9),
    0 22px 48px rgba(30, 122, 53, 0.14);
}

/* Lift children slightly in 3D space */
.swa-tilt-ready .icon-box,
.swa-tilt-ready .viz,
.swa-tilt-ready h3,
.swa-tilt-ready .img-3d {
  transform: translateZ(28px);
}

/* Section white surfaces */
body.swa-desk .section-pad,
body.swa-desk .section-muted,
body.swa-desk .clients-section {
  background-color: #ffffff;
}

/* Magnetic CTA micro-state */
.theme-btn.swa-magnetic {
  transition: transform 0.2s var(--swa3d-ease), box-shadow 0.3s ease, background 0.3s ease;
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
  .swa-glow__orb,
  .hero-stage.is-swa-float img,
  [data-swa-tilt],
  .account-card,
  .trading-card,
  .news-card,
  .pricing-card,
  .funfact-card {
    animation: none !important;
    transition: none !important;
    transform: none !important;
  }
  .swa-particle-host { display: none; }
}

@media (max-width: 767px) {
  .swa-glow__orb { filter: blur(36px); opacity: 0.4; }
  .swa-particle-host { opacity: 0.45; }
  [data-swa-tilt],
  .account-card,
  .trading-card,
  .news-card,
  .pricing-card {
    transform: none !important;
  }
}