@layer hunter-aaas-v1 {
  #hm-aaas-v1-root {
    --aaas-bg: #050505;
    --aaas-text: #f8fafc;
    --aaas-muted: #a8b0c4;
    --aaas-line: rgba(255, 255, 255, 0.12);
    --aaas-gold: #f4c766;
    --aaas-cyan: #20d9ff;
    --aaas-violet: #9b6bff;
    color: var(--aaas-text);
    background: var(--aaas-bg);
    isolation: isolate;
  }

  #hm-aaas-v1-root * {
    box-sizing: border-box;
  }

  .hm-aaas {
    min-height: 100vh;
    overflow: clip;
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    background:
      linear-gradient(180deg, rgba(255, 255, 255, 0.035), transparent 520px),
      linear-gradient(90deg, rgba(32, 217, 255, 0.055), transparent 30%, rgba(155, 107, 255, 0.085) 76%, transparent),
      #050505;
  }

  .hm-aaas a,
  .hm-aaas button {
    font: inherit;
  }

  .hm-aaas-shell {
    width: min(1180px, calc(100% - 40px));
    margin: 0 auto;
  }

  .hm-aaas-hero {
    position: relative;
    min-height: calc(100vh - 80px);
    display: grid;
    align-items: center;
    padding: 112px 0 84px;
  }

  .hm-aaas-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
      linear-gradient(rgba(255, 255, 255, 0.028) 1px, transparent 1px),
      linear-gradient(90deg, rgba(255, 255, 255, 0.022) 1px, transparent 1px);
    background-size: 88px 88px;
    mask-image: linear-gradient(180deg, black 0%, transparent 82%);
    opacity: 0.44;
    pointer-events: none;
  }

  .hm-aaas-hero-grid {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(340px, 0.84fr);
    gap: 58px;
    align-items: center;
  }

  .hm-aaas-eyebrow,
  .hm-aaas-kicker {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: rgba(32, 217, 255, 0.9);
    font-size: 12px;
    font-weight: 900;
    letter-spacing: 0.15em;
    text-transform: uppercase;
  }

  .hm-aaas-eyebrow::before,
  .hm-aaas-kicker::before {
    content: "";
    width: 34px;
    height: 1px;
    background: linear-gradient(90deg, var(--aaas-cyan), rgba(32, 217, 255, 0));
  }

  .hm-aaas h1 {
    max-width: 760px;
    margin: 26px 0 24px;
    color: #fff;
    font-size: clamp(42px, 5.4vw, 74px);
    line-height: 1.03;
    letter-spacing: 0;
    font-weight: 950;
  }

  .hm-aaas-lead {
    max-width: 760px;
    margin: 0;
    color: #d5d9e6;
    font-size: clamp(17px, 1.7vw, 21px);
    line-height: 1.78;
  }

  .hm-aaas-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    margin-top: 34px;
  }

  .hm-aaas-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 48px;
    padding: 0 25px;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, 0.14);
    cursor: pointer;
    text-decoration: none;
    transition: transform 0.22s ease, border-color 0.22s ease, background 0.22s ease, box-shadow 0.22s ease;
  }

  .hm-aaas-btn:hover {
    transform: translateY(-2px);
  }

  .hm-aaas-btn-primary {
    border-color: rgba(32, 217, 255, 0.34);
    background: linear-gradient(135deg, #20d9ff, #8f5bff);
    color: #061016;
    font-weight: 900;
    box-shadow: 0 20px 44px rgba(32, 217, 255, 0.18);
  }

  .hm-aaas-btn-ghost {
    color: #fff;
    background: rgba(255, 255, 255, 0.055);
  }

  .hm-aaas-console {
    position: relative;
    overflow: hidden;
    min-height: 420px;
    padding: 28px;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 30px;
    background:
      linear-gradient(145deg, rgba(255, 255, 255, 0.068), rgba(255, 255, 255, 0.018)),
      linear-gradient(135deg, rgba(32, 217, 255, 0.14), transparent 32%, rgba(155, 107, 255, 0.18)),
      rgba(8, 10, 18, 0.88);
    box-shadow: 0 34px 100px rgba(0, 0, 0, 0.46);
  }

  .hm-aaas-console::after {
    content: "";
    position: absolute;
    inset: 14px;
    border: 1px solid rgba(255, 255, 255, 0.07);
    border-radius: 22px;
    pointer-events: none;
  }

  .hm-aaas-console-head {
    display: flex;
    align-items: center;
    gap: 9px;
    margin-bottom: 30px;
  }

  .hm-aaas-console-head span {
    width: 11px;
    height: 11px;
    border-radius: 50%;
    background: #ef4444;
  }

  .hm-aaas-console-head span:nth-child(2) {
    background: #f4c766;
  }

  .hm-aaas-console-head span:nth-child(3) {
    background: #22c55e;
  }

  .hm-aaas-console-head b {
    margin-left: auto;
    color: var(--aaas-cyan);
    font-size: 11px;
    letter-spacing: 0.14em;
  }

  .hm-aaas-console h2 {
    margin: 0;
    font-size: 24px;
    font-weight: 930;
  }

  .hm-aaas-console p {
    margin: 8px 0 22px;
    color: var(--aaas-muted);
  }

  .hm-aaas-signal-list {
    position: relative;
    z-index: 1;
    display: grid;
    gap: 12px;
  }

  .hm-aaas-signal {
    display: grid;
    grid-template-columns: minmax(0, 0.55fr) minmax(0, 1fr);
    gap: 18px;
    align-items: center;
    padding: 16px 18px;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 18px;
    background: rgba(0, 0, 0, 0.24);
    animation: aaasFloat 4.5s ease-in-out infinite;
    animation-delay: calc(var(--d) * -0.55s);
  }

  .hm-aaas-signal strong {
    color: #fff;
    font-size: 14px;
  }

  .hm-aaas-signal span {
    color: #b8c0d4;
    font-size: 13px;
    line-height: 1.5;
  }

  .hm-aaas-section {
    position: relative;
    padding: 96px 0;
  }

  .hm-aaas-market {
    display: grid;
    grid-template-columns: minmax(0, 0.72fr) minmax(0, 1fr);
    gap: 54px;
    align-items: start;
    padding: 42px;
    border: 1px solid rgba(32, 217, 255, 0.2);
    border-radius: 30px;
    background:
      linear-gradient(120deg, rgba(32, 217, 255, 0.12), transparent 44%),
      rgba(255, 255, 255, 0.035);
  }

  .hm-aaas-market h2,
  .hm-aaas-section-head h2,
  .hm-aaas-use-wrap h2,
  .hm-aaas-final h2 {
    margin: 12px 0 0;
    color: #fff;
    font-size: clamp(34px, 4.8vw, 58px);
    line-height: 1.08;
    letter-spacing: 0;
    font-weight: 950;
  }

  .hm-aaas-market p,
  .hm-aaas-final p {
    margin: 0;
    color: #d0d5e4;
    font-size: 18px;
    line-height: 1.78;
  }

  .hm-aaas-module-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 18px;
  }

  .hm-aaas-card {
    min-height: 260px;
    padding: 26px;
    border: 1px solid var(--aaas-line);
    border-radius: 26px;
    background:
      linear-gradient(145deg, rgba(255, 255, 255, 0.075), rgba(255, 255, 255, 0.02)),
      rgba(0, 0, 0, 0.22);
    transform: translateY(32px);
    opacity: 0;
    transition: opacity 0.55s ease, transform 0.65s cubic-bezier(.16, 1, .3, 1), border-color 0.22s ease, background 0.22s ease;
    transition-delay: calc(var(--i) * 45ms);
  }

  .hm-aaas-card.is-visible {
    opacity: 1;
    transform: translateY(0);
  }

  .hm-aaas-card:hover {
    border-color: rgba(32, 217, 255, 0.34);
    background:
      linear-gradient(145deg, rgba(32, 217, 255, 0.11), rgba(155, 107, 255, 0.075)),
      rgba(255, 255, 255, 0.036);
  }

  .hm-aaas-card small {
    display: inline-flex;
    color: var(--aaas-cyan);
    font-size: 12px;
    font-weight: 900;
    letter-spacing: 0.14em;
  }

  .hm-aaas-card h3 {
    margin: 54px 0 14px;
    color: #fff;
    font-size: 23px;
    line-height: 1.18;
    font-weight: 930;
  }

  .hm-aaas-card p {
    margin: 0;
    color: #b8c0d4;
    font-size: 15px;
    line-height: 1.72;
  }

  .hm-aaas-path {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
    margin-top: 34px;
  }

  .hm-aaas-step {
    padding: 24px;
    border: 1px solid var(--aaas-line);
    border-radius: 22px;
    background: rgba(255, 255, 255, 0.04);
    opacity: 0;
    transform: translateY(26px) scale(0.985);
    transition: opacity 0.55s ease, transform 0.65s cubic-bezier(.16, 1, .3, 1);
  }

  .hm-aaas-step.is-visible {
    opacity: 1;
    transform: translateY(0) scale(1);
  }

  .hm-aaas-step b {
    color: var(--aaas-gold);
    font-size: 13px;
  }

  .hm-aaas-step strong {
    display: block;
    margin-top: 28px;
    color: #fff;
    font-size: 18px;
  }

  .hm-aaas-step p {
    margin: 10px 0 0;
    color: #aeb6ca;
    font-size: 14px;
    line-height: 1.68;
  }

  .hm-aaas-section-use {
    padding-top: 112px;
    background:
      linear-gradient(180deg, transparent, rgba(32, 217, 255, 0.035) 34%, transparent 74%),
      linear-gradient(90deg, rgba(255, 255, 255, 0.018) 1px, transparent 1px),
      linear-gradient(rgba(255, 255, 255, 0.014) 1px, transparent 1px);
    background-size: auto, 72px 72px, 72px 72px;
  }

  .hm-aaas-use-wrap {
    text-align: left;
  }

  .hm-aaas-use-head {
    display: grid;
    grid-template-columns: minmax(0, 0.82fr) minmax(320px, 0.68fr);
    gap: 48px;
    align-items: end;
    margin-bottom: 34px;
  }

  .hm-aaas-use-head h2 {
    margin: 0;
    max-width: 720px;
  }

  .hm-aaas-use-head p {
    margin: 0;
    color: #c4ccdd;
    font-size: 17px;
    line-height: 1.78;
  }

  .hm-aaas-use-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
  }

  .hm-aaas-use-card {
    position: relative;
    min-height: 222px;
    overflow: hidden;
    padding: 22px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 24px;
    background:
      linear-gradient(135deg, rgba(255, 255, 255, 0.082), rgba(255, 255, 255, 0.018)),
      rgba(4, 7, 13, 0.72);
    opacity: 0;
    transform: translateY(34px) scale(0.985);
    transition:
      opacity 0.62s ease,
      transform 0.76s cubic-bezier(.16, 1, .3, 1),
      border-color 0.24s ease,
      background 0.24s ease,
      box-shadow 0.24s ease;
    transition-delay: calc(var(--i) * 38ms);
  }

  .hm-aaas-use-card::before {
    content: "";
    position: absolute;
    inset: 0;
    opacity: 0.45;
    background:
      linear-gradient(120deg, rgba(32, 217, 255, 0.18), transparent 34%),
      linear-gradient(180deg, transparent 0 45%, rgba(255, 255, 255, 0.05) 45% 46%, transparent 46% 100%);
    pointer-events: none;
  }

  .hm-aaas-use-card::after {
    content: "";
    position: absolute;
    inset: auto 18px 18px 18px;
    height: 1px;
    background: linear-gradient(90deg, rgba(32, 217, 255, 0), rgba(32, 217, 255, 0.65), rgba(244, 199, 102, 0));
    transform: scaleX(0.2);
    transform-origin: left;
    transition: transform 0.42s cubic-bezier(.16, 1, .3, 1);
  }

  .hm-aaas-use-card.is-visible {
    opacity: 1;
    transform: translateY(0) scale(1);
  }

  .hm-aaas-use-card:hover {
    transform: translateY(-7px) scale(1.01);
    border-color: rgba(32, 217, 255, 0.3);
    box-shadow: 0 24px 70px rgba(0, 0, 0, 0.28);
  }

  .hm-aaas-use-card:hover::after {
    transform: scaleX(1);
  }

  .hm-aaas-use-card:nth-child(2)::before {
    background:
      linear-gradient(155deg, rgba(244, 199, 102, 0.18), transparent 36%),
      repeating-linear-gradient(90deg, rgba(255, 255, 255, 0.045) 0 1px, transparent 1px 18px);
  }

  .hm-aaas-use-card:nth-child(3)::before {
    background:
      linear-gradient(140deg, rgba(155, 107, 255, 0.2), transparent 42%),
      linear-gradient(45deg, transparent 0 48%, rgba(255, 255, 255, 0.046) 48% 50%, transparent 50% 100%);
    background-size: auto, 28px 28px;
  }

  .hm-aaas-use-card:nth-child(4)::before {
    background:
      linear-gradient(180deg, rgba(44, 255, 172, 0.15), transparent 46%),
      radial-gradient(circle at 0 0, rgba(255, 255, 255, 0.05) 0 1px, transparent 1px 100%);
    background-size: auto, 18px 18px;
  }

  .hm-aaas-use-card:nth-child(5)::before {
    background:
      linear-gradient(115deg, rgba(32, 217, 255, 0.14), transparent 40%),
      repeating-linear-gradient(135deg, rgba(255, 255, 255, 0.035) 0 1px, transparent 1px 16px);
  }

  .hm-aaas-use-card:nth-child(6)::before {
    background:
      linear-gradient(130deg, rgba(244, 199, 102, 0.15), transparent 38%),
      linear-gradient(90deg, transparent 0 32%, rgba(255, 255, 255, 0.045) 32% 33%, transparent 33% 100%);
    background-size: auto, 40px 40px;
  }

  .hm-aaas-use-card:nth-child(7)::before {
    background:
      linear-gradient(150deg, rgba(255, 83, 112, 0.16), transparent 42%),
      repeating-linear-gradient(0deg, rgba(255, 255, 255, 0.035) 0 1px, transparent 1px 20px);
  }

  .hm-aaas-use-card:nth-child(8)::before {
    background:
      linear-gradient(120deg, rgba(155, 107, 255, 0.18), transparent 36%),
      conic-gradient(from 180deg at 50% 50%, transparent 0 24%, rgba(255, 255, 255, 0.038) 24% 25%, transparent 25% 100%);
  }

  .hm-aaas-use-card small,
  .hm-aaas-use-card h3,
  .hm-aaas-use-card p {
    position: relative;
    z-index: 1;
  }

  .hm-aaas-use-card small {
    display: inline-flex;
    color: rgba(244, 199, 102, 0.94);
    font-size: 11px;
    font-weight: 900;
    letter-spacing: 0.13em;
    text-transform: uppercase;
  }

  .hm-aaas-use-card h3 {
    margin: 56px 0 12px;
    color: #fff;
    font-size: 19px;
    line-height: 1.22;
    font-weight: 930;
  }

  .hm-aaas-use-card p {
    margin: 0;
    color: #b8c1d3;
    font-size: 14px;
    line-height: 1.72;
  }

  .hm-aaas-final {
    padding: 80px 0 112px;
  }

  .hm-aaas-final-panel {
    display: grid;
    grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr);
    gap: clamp(28px, 4vw, 56px);
    align-items: center;
    padding: 42px;
    border: 1px solid rgba(244, 199, 102, 0.22);
    border-radius: 30px;
    background:
      linear-gradient(120deg, rgba(244, 199, 102, 0.13), transparent 45%, rgba(155, 107, 255, 0.14)),
      rgba(255, 255, 255, 0.04);
  }

  .hm-aaas-final-panel h2 {
    margin-top: 0;
    max-width: 640px;
    font-size: clamp(38px, 4.5vw, 62px);
    line-height: 1.06;
  }

  .hm-aaas-final-panel p {
    max-width: 620px;
    margin: 0;
    justify-self: end;
  }

  @keyframes aaasFloat {
    0%, 100% { transform: translate3d(0, 0, 0); }
    50% { transform: translate3d(0, -6px, 0); }
  }

  @media (max-width: 980px) {
    .hm-aaas-hero-grid,
    .hm-aaas-market,
    .hm-aaas-final-panel {
      grid-template-columns: 1fr;
    }

    .hm-aaas-module-grid {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .hm-aaas-path {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .hm-aaas-use-head {
      grid-template-columns: 1fr;
      gap: 18px;
    }

    .hm-aaas-use-grid {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .hm-aaas-final-panel p {
      justify-self: start;
    }
  }

  @media (max-width: 640px) {
    .hm-aaas-shell {
      width: min(100% - 28px, 1180px);
    }

    .hm-aaas-hero {
      padding: 88px 0 54px;
    }

    .hm-aaas-hero-grid {
      gap: 28px;
    }

    .hm-aaas-actions,
    .hm-aaas-btn {
      width: 100%;
    }

    .hm-aaas-console,
    .hm-aaas-market,
    .hm-aaas-final-panel {
      padding: 22px;
      border-radius: 22px;
    }

    .hm-aaas-signal {
      grid-template-columns: 1fr;
      gap: 6px;
    }

    .hm-aaas-module-grid,
    .hm-aaas-path,
    .hm-aaas-use-grid {
      grid-template-columns: 1fr;
    }

    .hm-aaas-section {
      padding: 64px 0;
    }

    .hm-aaas-card {
      min-height: auto;
      padding: 23px;
    }

    .hm-aaas-card h3 {
      margin-top: 34px;
    }

    .hm-aaas-use-card {
      min-height: auto;
      padding: 22px;
    }

    .hm-aaas-use-card h3 {
      margin-top: 38px;
    }
  }

  @media (prefers-reduced-motion: reduce) {
    .hm-aaas-signal {
      animation: none;
    }

    .hm-aaas-card,
    .hm-aaas-step,
    .hm-aaas-use-card,
    .hm-aaas-btn {
      transition: none;
    }
  }
}