/* AstraTech modern layer v2 */
/* ============================================================
   AstraTech — modern layer v1
   Palette, fonts and geometry unchanged: #7253d0 / Inter / 24px
   Adds: depth, hover motion, image polish, button states,
   stat-number gradients, smoother FAQ, focus accessibility.
   ============================================================ */

/* 1 — Cards & shapes: soft layered depth, gentle lift on hover */
.t396 .tn-elem[data-elem-type="shape"] > .tn-atom {
  box-shadow: 0 1px 2px rgba(17, 17, 17, .04),
              0 12px 32px -12px rgba(114, 83, 208, .12);
  transition: box-shadow .35s cubic-bezier(.2,.6,.2,1),
              transform .35s cubic-bezier(.2,.6,.2,1);
  will-change: transform;
}
.t396 .tn-elem[data-elem-type="shape"]:hover > .tn-atom {
  box-shadow: 0 2px 4px rgba(17, 17, 17, .05),
              0 20px 44px -12px rgba(114, 83, 208, .22);
  transform: translateY(-3px);
}

/* 2 — Images: unified corner radius + subtle zoom on hover */
.t396 .tn-elem[data-elem-type="image"] > .tn-atom {
  border-radius: 24px;
  overflow: hidden;
  transition: transform .45s cubic-bezier(.2,.6,.2,1), box-shadow .45s ease;
  box-shadow: 0 16px 40px -16px rgba(17, 17, 17, .18);
}
.t396 .tn-elem[data-elem-type="image"]:hover > .tn-atom {
  transform: translateY(-3px) scale(1.01);
}

/* 3 — Buttons: confident hover/active states, violet glow */
.t-btn, .t-submit, .tn-atom[href], a.tn-atom {
  transition: transform .22s ease, box-shadow .28s ease, filter .22s ease !important;
}
.t-btn:hover, .t-submit:hover, a.tn-atom:hover {
  transform: translateY(-2px);
  box-shadow: 0 14px 28px -10px rgba(114, 83, 208, .45);
  filter: brightness(1.04);
}
.t-btn:active, .t-submit:active, a.tn-atom:active {
  transform: translateY(0);
  box-shadow: 0 6px 14px -6px rgba(114, 83, 208, .4);
}

/* 4 — Key stat numbers: brand-violet gradient ink (same hue family) */
#rec951376566 .tn-elem[data-elem-id="1744450945545"] .tn-atom,
#rec951376566 .tn-elem[data-elem-id="1744450945557"] .tn-atom,
#rec951297761 .tn-elem[data-elem-id="1744448285162"] .tn-atom {
  background: linear-gradient(120deg, #472b9b 0%, #7253d0 60%, #8d6ff0 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: #7253d0;
}

/* 5 — FAQ accordion: smoother open/close, violet plus icons */
.t585__header { transition: opacity .25s ease; }
.t585__header:hover { opacity: .75; }
.t585__icon, .t585__lines { transition: transform .3s ease; }
.t585__opened .t585__icon { transform: rotate(45deg); }
.t585__text { transition: max-height .4s ease, opacity .35s ease; }

/* 6 — Scroll reveal: records rise softly into view (JS-guarded:
      without JS the site renders exactly as before) */
body.at-js .t-rec[data-at-reveal] {
  opacity: 0;
  transform: translateY(18px);
  transition: opacity .7s cubic-bezier(.2,.6,.2,1),
              transform .7s cubic-bezier(.2,.6,.2,1);
}
body.at-js .t-rec[data-at-reveal].at-inview {
  opacity: 1;
  transform: none;
}

/* 7 — Accessibility: visible focus ring in brand violet */
a:focus-visible, button:focus-visible, .t-btn:focus-visible,
input:focus-visible, textarea:focus-visible {
  outline: 2px solid #7253d0 !important;
  outline-offset: 3px;
  border-radius: 6px;
}

/* 8 — Text selection in brand color */
::selection { background: rgba(114, 83, 208, .18); }

/* 9 — Reduced motion: respect user preference, disable all added motion */
@media (prefers-reduced-motion: reduce) {
  .t396 .tn-elem > .tn-atom, .t-btn, .t-submit,
  body.at-js .t-rec[data-at-reveal] {
    transition: none !important;
    transform: none !important;
    opacity: 1 !important;
  }
}

/* ============ v2 — "exceptionally nice" additions ============ */

/* 10 — FAQ: card-ified items instead of bare separator lines */
.t585__wrapper {
  background: #ffffff;
  border-radius: 16px;
  padding: 6px 28px;
  margin-bottom: 14px;
  box-shadow: 0 1px 2px rgba(17,17,17,.04), 0 10px 28px -14px rgba(114,83,208,.14);
  transition: box-shadow .3s ease, transform .3s ease;
}
.t585__wrapper:hover {
  box-shadow: 0 2px 4px rgba(17,17,17,.05), 0 16px 36px -14px rgba(114,83,208,.24);
  transform: translateY(-2px);
}
.t585__border { display: none; }
.t585__circle { transition: background-color .3s ease; }
.t585__wrapper:hover .t585__circle { background-color: rgba(114,83,208,.12); }

/* 11 — Primary buttons: violet gradient + shine sweep on hover */
.t-btn[style*="7253"], .t-submit {
  background-image: linear-gradient(135deg, #7d5fe0 0%, #7253d0 45%, #5a3bbf 100%) !important;
  position: relative;
  overflow: hidden;
}
.t-btn[style*="7253"]::after, .t-submit::after {
  content: "";
  position: absolute;
  top: 0; left: -80%;
  width: 50%; height: 100%;
  background: linear-gradient(100deg, transparent, rgba(255,255,255,.35), transparent);
  transform: skewX(-20deg);
  transition: left .55s ease;
  pointer-events: none;
}
.t-btn[style*="7253"]:hover::after, .t-submit:hover::after { left: 130%; }

/* 12 — Hero: ambient violet glow over the cover artboard */
#rec951244066 .t396__artboard::after,
#rec958004126 .t396__artboard::after,
#rec958349666 .t396__artboard::after,
#rec958355726 .t396__artboard::before {
  content: none; /* placeholder: enabled selectively below */
}
#rec951244066 .t396__artboard { position: relative; }
#rec951244066 .t396__artboard::after {
  content: "";
  position: absolute; inset: 0;
  background:
    radial-gradient(60% 80% at 78% 30%, rgba(141,111,240,.28), transparent 60%),
    radial-gradient(45% 60% at 12% 85%, rgba(102,234,230,.10), transparent 65%);
  pointer-events: none;
  mix-blend-mode: screen;
}

/* 13 — Scroll progress: hairline gradient bar at very top */
#at-progress {
  position: fixed; top: 0; left: 0; height: 3px; width: 0;
  background: linear-gradient(90deg, #472b9b, #7253d0 60%, #66eae6);
  z-index: 99999; border-radius: 0 3px 3px 0;
  transition: width .12s linear;
  pointer-events: none;
}

/* 14 — Thin modern scrollbar (WebKit) in neutral + violet hover */
::-webkit-scrollbar { width: 10px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: #d9d6e6; border-radius: 8px; border: 2px solid #fff; }
::-webkit-scrollbar-thumb:hover { background: #7253d0; }

/* 15 — Smooth in-page anchor scrolling */
html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
