/* Homepage (2026 black and gold redesign). Loaded only by index.html. */
.home-v2 {
  --gold: #e7b54a;
  --gold-hi: #fbe29a;
  --gold-lo: #a87420;
  --gold-grad: linear-gradient(135deg, #fff1c4 0%, #f3cd6b 30%, #e3ad3e 60%, #a87420 100%);
  --ink: #0a0907;
  --ink-2: #13100b;
  --cream: #fbf6ec;
  --muted: #b9ad98;
  --display: "Anton", "Impact", "Arial Narrow", sans-serif;
  background: var(--ink);
}

.hx-wrap { width: min(1200px, 100% - 32px); margin-inline: auto; }
.hx-narrow { width: min(860px, 100% - 32px); }
.hx-section { padding: clamp(64px, 9vw, 120px) 0; position: relative; }
.hx-center { text-align: center; margin-inline: auto; }

.hx-gold {
  background: var(--gold-grad);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.hx-eyebrow {
  font: 700 13px/1 "Inter", sans-serif;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--gold);
  margin: 0 0 16px;
}
.hx-h1, .hx-h2 {
  font-family: var(--display);
  font-weight: 400;
  text-transform: uppercase;
  letter-spacing: .01em;
  line-height: .98;
  color: var(--cream);
  margin: 0 0 20px;
}
.hx-h1 { font-size: clamp(52px, 8.4vw, 118px); text-shadow: 0 6px 40px rgba(0,0,0,.55); }
.hx-h2 { font-size: clamp(38px, 5.4vw, 72px); }
.hx-text { color: var(--muted); font-size: clamp(16px, 1.4vw, 19px); line-height: 1.6; max-width: 620px; margin: 0 0 24px; }
.hx-note { color: var(--muted); text-align: center; margin: 28px auto 0; font-size: 15px; }
.hx-link { color: var(--gold); font-weight: 700; white-space: nowrap; }
.hx-link:hover { color: var(--gold-hi); }

/* Buttons */
.hx-btn {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 56px; padding: 0 30px; border-radius: 999px;
  font: 800 15px/1 "Inter", sans-serif; letter-spacing: .06em; text-transform: uppercase;
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
}
.hx-btn-gold {
  background: var(--gold-grad); color: #1a1206;
  box-shadow: 0 12px 40px rgba(227,173,62,.35), inset 0 1px 0 rgba(255,255,255,.6);
}
.hx-btn-gold:hover { transform: translateY(-2px); box-shadow: 0 18px 50px rgba(227,173,62,.5), inset 0 1px 0 rgba(255,255,255,.6); }
.hx-btn-ghost { border: 1.5px solid rgba(251,226,154,.55); color: var(--cream); background: rgba(10,9,7,.35); backdrop-filter: blur(6px); }
.hx-btn-ghost:hover { border-color: var(--gold-hi); color: var(--gold-hi); }

/* ---------- Hero ---------- */
.hx-hero {
  position: relative; min-height: min(100svh, 980px);
  display: flex; align-items: center; overflow: hidden;
  padding: calc(var(--nav-h, 82px) + 40px) 0 64px;
}
.hx-hero-bg, .hx-hero-bg img { position: absolute; inset: 0; width: 100%; height: 100%; }
.hx-hero-bg img { object-fit: cover; object-position: 62% 40%; }
.hx-hero-shade {
  position: absolute; inset: 0;
  background:
    linear-gradient(90deg, rgba(10,9,7,.94) 0%, rgba(10,9,7,.78) 34%, rgba(10,9,7,.2) 64%, rgba(10,9,7,.05) 100%),
    linear-gradient(0deg, var(--ink) 0%, rgba(10,9,7,0) 28%);
}
.hx-hero-inner { position: relative; z-index: 1; }
.hx-badge {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 10px 18px; border-radius: 999px; margin: 0 0 24px;
  border: 1px solid rgba(251,226,154,.45); background: rgba(10,9,7,.55); backdrop-filter: blur(8px);
  font: 700 13px/1 "Inter", sans-serif; letter-spacing: .14em; text-transform: uppercase; color: var(--gold-hi);
}
.hx-badge span { font-size: 16px; }
.hx-lede { font-size: clamp(17px, 1.6vw, 21px); line-height: 1.55; color: #ece3d2; max-width: 540px; margin: 0 0 32px; }
.hx-ctas { display: flex; flex-wrap: wrap; gap: 14px; margin-bottom: 28px; }
.hx-trust { display: flex; flex-wrap: wrap; gap: 8px 22px; list-style: none; padding: 0; margin: 0; color: #e2d8c4; font-size: 14px; font-weight: 600; }
.hx-trust li::before { content: "✓"; color: var(--gold); margin-right: 8px; font-weight: 900; }

/* ---------- Stat bar ---------- */
.hx-stats { background: var(--gold-grad); color: #1a1206; position: relative; z-index: 2; }
.hx-stats-grid { display: grid; grid-template-columns: repeat(4, 1fr); }
.hx-stats-grid > div { padding: 26px 16px; text-align: center; border-left: 1px solid rgba(26,18,6,.18); }
.hx-stats-grid > div:first-child { border-left: 0; }
.hx-stats strong { display: block; font: 400 clamp(30px, 3.6vw, 48px)/1 var(--display); text-transform: uppercase; }
.hx-stats-grid > div > span { display: block; margin-top: 8px; font-size: 13px; font-weight: 700; letter-spacing: .04em; opacity: .82; }

/* ---------- Model marquee ---------- */
.hx-models { padding: clamp(64px, 8vw, 104px) 0 clamp(48px, 6vw, 80px); overflow: hidden; }
.hx-models-head { text-align: center; margin-bottom: 36px; }
.hx-marquee { mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent); -webkit-mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent); }
.hx-marquee-track { display: flex; gap: 16px; width: max-content; animation: hx-scroll 70s linear infinite; }
.hx-marquee:hover .hx-marquee-track { animation-play-state: paused; }
.hx-marquee img {
  width: clamp(170px, 18vw, 240px); aspect-ratio: 3 / 4; height: auto; object-fit: cover;
  border-radius: 18px; border: 1px solid rgba(251,226,154,.22);
  box-shadow: 0 16px 40px rgba(0,0,0,.5);
}
@keyframes hx-scroll { to { transform: translateX(calc(-50% - 8px)); } }
@media (prefers-reduced-motion: reduce) { .hx-marquee-track { animation: none; } .hx-marquee { overflow-x: auto; } }

/* ---------- Rev share ---------- */
.hx-rev { background: radial-gradient(60% 70% at 85% 50%, rgba(227,173,62,.14), transparent 70%), var(--ink-2); }
.hx-rev-grid { display: grid; grid-template-columns: 1.05fr 1fr; gap: clamp(32px, 5vw, 72px); align-items: center; }
.hx-big { font: 400 clamp(120px, 17vw, 240px)/1 var(--display); margin: 0 0 12px; letter-spacing: -.01em; }
/* "Up to" label above the figure; the figure gets room above and below so the
   gradient text is never clipped (it was at line-height .85). */
.hx-upto { display: block; font: 400 clamp(26px, 3.4vw, 44px)/1 var(--display); letter-spacing: .04em; text-transform: uppercase; color: #fbe29a; margin-bottom: .1em; }
.hx-figure { display: inline-block; line-height: 1; padding: .06em .02em .04em; }
.hx-rev .hx-h2 { font-size: clamp(28px, 3.4vw, 44px); line-height: 1.05; }
.hx-chips { display: flex; flex-wrap: wrap; gap: 10px; list-style: none; padding: 0; margin: 0; }
.hx-chips li {
  padding: 10px 16px; border-radius: 999px; font-size: 14px; font-weight: 700; color: var(--gold-hi);
  border: 1px solid rgba(251,226,154,.35); background: rgba(227,173,62,.08);
}
.hx-rev-media { position: relative; margin: 0; }
.hx-rev-media img { width: 100%; height: auto; aspect-ratio: 16 / 10; object-fit: cover; border-radius: 26px; border: 1px solid rgba(251,226,154,.25); box-shadow: 0 30px 80px rgba(0,0,0,.6); }
.hx-toast {
  position: absolute; left: -18px; bottom: 28px; display: flex; align-items: center; gap: 10px;
  padding: 14px 20px; border-radius: 16px; background: rgba(10,9,7,.85); backdrop-filter: blur(10px);
  border: 1px solid rgba(251,226,154,.4); color: var(--cream); font-weight: 700; font-size: 15px;
  box-shadow: 0 16px 40px rgba(0,0,0,.5);
}

/* ---------- Live sites ---------- */
.hx-live { text-align: center; }
.hx-live-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; margin-top: 40px; text-align: left; }
.hx-site {
  position: relative; display: block; overflow: hidden; border-radius: 18px;
  border: 1px solid rgba(251,226,154,.18); background: #000;
  transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease;
}
.hx-site:hover { transform: translateY(-4px); border-color: rgba(251,226,154,.6); box-shadow: 0 20px 50px rgba(227,173,62,.18); }
.hx-site img { width: 100%; height: 100%; aspect-ratio: 16 / 10; object-fit: cover; object-position: top; opacity: .92; }
.hx-site-feature { grid-column: span 2; grid-row: span 2; }
.hx-site-feature img { aspect-ratio: auto; }
.hx-site-name {
  position: absolute; left: 0; right: 0; bottom: 0; padding: 40px 18px 14px;
  background: linear-gradient(0deg, rgba(10,9,7,.95), transparent);
  font-weight: 800; color: var(--cream); font-size: 15px;
}
.hx-site-name em { font-style: normal; margin-left: 8px; padding: 4px 10px; border-radius: 999px; background: var(--gold-grad); color: #1a1206; font-size: 11px; letter-spacing: .1em; text-transform: uppercase; vertical-align: 2px; }
.hx-site::after {
  content: "● LIVE"; position: absolute; top: 12px; right: 12px; padding: 5px 10px; border-radius: 999px;
  background: rgba(10,9,7,.8); color: #5ef0a6; font-size: 11px; font-weight: 800; letter-spacing: .1em;
}

/* ---------- Niches ---------- */
.hx-niches { text-align: center; background: linear-gradient(180deg, var(--ink) 0%, var(--ink-2) 100%); }
.hx-niche-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 14px; margin-top: 40px; }
.hx-niche {
  position: relative; display: block; overflow: hidden; border-radius: 16px; aspect-ratio: 3 / 4;
  border: 1px solid rgba(251,226,154,.16); background: #000;
}
.hx-niche img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.hx-niche:hover img { transform: scale(1.06); }
.hx-niche > span {
  position: absolute; left: 0; right: 0; bottom: 0; padding: 48px 12px 14px;
  background: linear-gradient(0deg, rgba(10,9,7,.96) 10%, transparent);
  font: 400 clamp(17px, 1.6vw, 22px)/1.05 var(--display); text-transform: uppercase; color: var(--cream); letter-spacing: .02em;
}
.hx-niche:hover > span { color: var(--gold-hi); }
.hx-niche-more {
  display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 12px; padding: 20px;
  background: var(--gold-grad); color: #1a1206; border: 0;
}
.hx-niche-more strong { font: 400 clamp(26px, 2.6vw, 36px)/1 var(--display); text-transform: uppercase; }
.hx-niche-more span { font-size: 14px; font-weight: 600; line-height: 1.4; }
.hx-niche-more em { font-style: normal; font-weight: 800; font-size: 13px; letter-spacing: .08em; text-transform: uppercase; border-bottom: 2px solid #1a1206; }

/* ---------- Leader banner ---------- */
.hx-leader { position: relative; overflow: hidden; padding: clamp(72px, 10vw, 130px) 0; background: radial-gradient(55% 80% at 75% 50%, rgba(227,173,62,.16), transparent 70%), var(--ink); }
.hx-leader-grid { display: grid; grid-template-columns: .9fr 1.1fr; gap: clamp(32px, 5vw, 72px); align-items: center; }
.hx-leader .hx-h2 { font-size: clamp(44px, 5.6vw, 84px); }
.hx-leader .hx-text { margin: 0 0 32px; color: #e8dec9; }
.hx-leader-media { margin: 0; position: relative; }
.hx-leader-media img { width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 26px; border: 1px solid rgba(251,226,154,.3); box-shadow: 0 30px 90px rgba(0,0,0,.65), 0 0 60px rgba(227,173,62,.12); }
@media (max-width: 860px) { .hx-leader-grid { grid-template-columns: 1fr; } .hx-leader-media { order: -1; } }

/* ---------- How it works ---------- */
.hx-how { text-align: center; }
.hx-steps { list-style: none; counter-reset: step; display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; padding: 0; margin: 44px 0 0; text-align: left; }
.hx-steps li {
  counter-increment: step; position: relative; padding: 34px 28px 30px; border-radius: 22px;
  background: linear-gradient(180deg, rgba(227,173,62,.1), rgba(227,173,62,.02)); border: 1px solid rgba(251,226,154,.2);
}
.hx-steps li::before { content: "0" counter(step); display: block; font: 400 64px/1 var(--display); margin-bottom: 14px; background: var(--gold-grad); -webkit-background-clip: text; background-clip: text; color: transparent; }
.hx-steps strong { display: block; font: 400 26px/1.1 var(--display); text-transform: uppercase; color: var(--cream); margin-bottom: 8px; }
.hx-steps span { color: var(--muted); }

/* ---------- Apply ---------- */
.hx-apply { background: radial-gradient(60% 60% at 20% 30%, rgba(227,173,62,.12), transparent 70%), var(--ink-2); }
.hx-apply .apply-grid { display: grid; grid-template-columns: 1fr 1.1fr; gap: clamp(32px, 5vw, 64px); align-items: start; }
.hx-apply .apply-bullets { list-style: none; padding: 0; margin: 0 0 24px; display: grid; gap: 12px; }
.hx-apply .apply-bullets li { color: var(--cream); font-weight: 600; font-size: 17px; }
.hx-apply .apply-bullets li::before { content: "✓"; display: inline-grid; place-items: center; width: 26px; height: 26px; margin-right: 12px; border-radius: 50%; background: var(--gold-grad); color: #1a1206; font-size: 14px; font-weight: 900; }
.hx-apply .form-alt { color: var(--muted); }
.hx-apply .form-alt a { color: var(--gold); font-weight: 700; }
.hx-apply .apply-form { border: 1px solid rgba(251,226,154,.25); background: rgba(10,9,7,.7); }

/* ---------- FAQ + blog ---------- */
.hx-faq .hx-h2, .hx-faq .hx-eyebrow { text-align: center; }
.hx-faq .faq-list { margin-top: 32px; }
.hx-blog-head { display: flex; justify-content: space-between; align-items: end; gap: 16px; margin-bottom: 32px; }
.hx-blog-head .hx-h2 { margin: 0; }
.hx-blog .blog-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.hx-blog .blog-grid > :nth-child(n+4) { display: none; }

/* ---------- Responsive ---------- */
@media (max-width: 1024px) {
  .hx-niche-grid { grid-template-columns: repeat(4, 1fr); }
  .hx-live-grid { grid-template-columns: repeat(2, 1fr); }
  .hx-site-feature, .hx-site:last-child { grid-column: span 2; grid-row: auto; }
  .hx-blog .blog-grid { grid-template-columns: repeat(2, 1fr); }
  .hx-blog .blog-grid > :nth-child(n+3) { display: none; }
}
@media (max-width: 860px) {
  .hx-rev-grid, .hx-apply .apply-grid { grid-template-columns: 1fr; }
  .hx-steps { grid-template-columns: 1fr; }
  .hx-stats-grid { grid-template-columns: repeat(2, 1fr); }
  .hx-stats-grid > div:nth-child(3) { border-left: 0; }
  .hx-stats-grid > div:nth-child(n+3) { border-top: 1px solid rgba(26,18,6,.18); }
  .hx-toast { left: 12px; }
}
@media (max-width: 760px) {
  .hx-hero { display: block; min-height: 0; padding: 0 0 44px; }
  .hx-hero-bg { position: relative; display: block; height: auto; aspect-ratio: 3 / 4; }
  .hx-hero-bg img { object-position: 50% 0; }
  .hx-hero-shade { background: linear-gradient(180deg, rgba(10,9,7,.45) 0%, rgba(10,9,7,0) 14%, rgba(10,9,7,0) 26%, rgba(10,9,7,.88) 44%, var(--ink) 56%); }
  .hx-hero-inner { margin-top: -38vw; }
  .hx-badge { font-size: 11px; letter-spacing: .1em; padding: 9px 14px; }
  .hx-ctas .hx-btn { flex: 1 1 100%; }
  .hx-niche-grid { grid-template-columns: repeat(2, 1fr); gap: 10px; }
  .hx-live-grid { gap: 10px; }
  .hx-blog .blog-grid { grid-template-columns: 1fr; }
  .hx-blog .blog-grid > :nth-child(n+2) { display: none; }
  .hx-blog-head { flex-direction: column; align-items: flex-start; }
}
.hx-text.hx-center { margin-inline: auto; }
.hx-niche.hx-niche-more > span { position: static; padding: 0; background: none; font: 600 14px/1.4 "Inter", sans-serif; text-transform: none; letter-spacing: 0; color: #1a1206; }

/* ======================================================================
   Motion (progressive enhancement; html.js-motion is set by an inline
   script and removed by home.js when the visitor prefers reduced motion).
   Only transform and opacity are animated, so it stays smooth on phones.
   ====================================================================== */
@keyframes hx-up { from { opacity: 0; transform: translateY(28px); } }
@keyframes hx-fade { from { opacity: 0; } }
@keyframes hx-kenburns { from { transform: scale(1.02); } to { transform: scale(1.1) translate(-1.2%, -1%); } }
@keyframes hx-shimmer { to { background-position: -200% 0; } }
@keyframes hx-spark { 0% { transform: translateY(0) scale(.6); opacity: 0; } 15% { opacity: 1; } 100% { transform: translateY(-46vh) scale(1.1); opacity: 0; } }
@keyframes hx-ticker { to { transform: translateX(-50%); } }
@keyframes hx-shine { 0%, 70% { transform: translateX(-120%) skewX(-20deg); } 100% { transform: translateX(260%) skewX(-20deg); } }
@keyframes hx-pulse { 0%, 100% { opacity: 1; } 50% { opacity: .35; } }
@keyframes hx-glow { 0%, 100% { filter: drop-shadow(0 0 0 rgba(231,181,74,0)); } 50% { filter: drop-shadow(0 0 28px rgba(231,181,74,.45)); } }

/* Hero: entrance, slow zoom, shimmer, sparkles */
.js-motion .hx-hero-bg img { animation: hx-kenburns 26s ease-in-out infinite alternate; will-change: transform; }
.js-motion .hx-badge { animation: hx-up .7s cubic-bezier(.2,.8,.2,1) .05s backwards; }
.js-motion .hx-line { display: inline-block; animation: hx-up .8s cubic-bezier(.2,.8,.2,1) backwards; }
.js-motion .hx-line:nth-of-type(1) { animation-delay: .15s; }
.js-motion .hx-line:nth-of-type(2) { animation-delay: .3s; }
.js-motion .hx-lede { animation: hx-up .8s cubic-bezier(.2,.8,.2,1) .45s backwards; }
.js-motion .hx-ctas { animation: hx-up .8s cubic-bezier(.2,.8,.2,1) .6s backwards; }
.js-motion .hx-trust { animation: hx-fade 1s ease .8s backwards; }
.hx-shimmer { background-image: linear-gradient(100deg, #a87420 0%, #e3ad3e 20%, #fff4cf 32%, #e3ad3e 44%, #a87420 60%, #e3ad3e 80%, #fff4cf 92%); background-size: 200% 100%; }
.js-motion .hx-shimmer { animation: hx-shimmer 4.5s linear infinite; }
.hx-sparks { position: absolute; inset: 0; z-index: 0; pointer-events: none; overflow: hidden; }
.hx-sparks i { position: absolute; bottom: -10px; width: 6px; height: 6px; border-radius: 50%; background: radial-gradient(circle, #fff4cf 0%, #e7b54a 45%, rgba(231,181,74,0) 70%); opacity: 0; }
.js-motion .hx-sparks i { animation: hx-spark 9s linear infinite; }
.hx-sparks i:nth-child(1)  { left: 6%;  animation-delay: 0s; }
.hx-sparks i:nth-child(2)  { left: 14%; animation-delay: 2.4s; width: 4px; height: 4px; }
.hx-sparks i:nth-child(3)  { left: 22%; animation-delay: 5.1s; }
.hx-sparks i:nth-child(4)  { left: 31%; animation-delay: 1.2s; width: 8px; height: 8px; }
.hx-sparks i:nth-child(5)  { left: 39%; animation-delay: 6.8s; width: 4px; height: 4px; }
.hx-sparks i:nth-child(6)  { left: 47%; animation-delay: 3.3s; }
.hx-sparks i:nth-child(7)  { left: 55%; animation-delay: 7.7s; width: 5px; height: 5px; }
.hx-sparks i:nth-child(8)  { left: 62%; animation-delay: .7s; }
.hx-sparks i:nth-child(9)  { left: 70%; animation-delay: 4.4s; width: 8px; height: 8px; }
.hx-sparks i:nth-child(10) { left: 77%; animation-delay: 8.2s; width: 4px; height: 4px; }
.hx-sparks i:nth-child(11) { left: 84%; animation-delay: 2s; }
.hx-sparks i:nth-child(12) { left: 90%; animation-delay: 5.9s; width: 5px; height: 5px; }
.hx-sparks i:nth-child(13) { left: 95%; animation-delay: 3.8s; }
.hx-sparks i:nth-child(14) { left: 50%; animation-delay: 6.2s; width: 7px; height: 7px; }
.hx-hero.is-off .hx-hero-bg img, .hx-hero.is-off .hx-sparks i, .hx-hero.is-off .hx-shimmer { animation-play-state: paused; }
@media (max-width: 760px) { .hx-sparks i:nth-child(n+9) { display: none; } }

/* Gold button shine */
.hx-btn-gold, .btn-primary { position: relative; overflow: hidden; isolation: isolate; }
.hx-btn-gold::after, .btn-primary::after {
  content: ""; position: absolute; top: 0; bottom: 0; left: 0; width: 40%; z-index: -1; pointer-events: none;
  background: linear-gradient(90deg, rgba(255,255,255,0), rgba(255,255,255,.55), rgba(255,255,255,0));
  transform: translateX(-120%) skewX(-20deg);
}
.js-motion .hx-btn-gold::after, .js-motion .btn-primary::after { animation: hx-shine 4.2s ease-in-out infinite; }

/* Revenue ticker */
.hx-ticker { overflow: hidden; background: #0f0c07; border-bottom: 1px solid rgba(251,226,154,.18); padding: 14px 0; }
.hx-ticker-track { display: flex; width: max-content; }
.js-motion .hx-ticker-track { animation: hx-ticker 38s linear infinite; }
.hx-ticker span { font: 400 clamp(18px, 1.8vw, 24px)/1 var(--display); text-transform: uppercase; letter-spacing: .04em; color: var(--cream); padding: 0 26px; white-space: nowrap; }
.hx-ticker span::after { content: "✦"; color: var(--gold); margin-left: 52px; font-size: .8em; }
.hx-ticker span:nth-child(odd) { color: var(--gold-hi); }

/* Scroll reveals */
.js-motion [data-reveal] { opacity: 0; transform: translateY(32px); transition: opacity .8s cubic-bezier(.2,.8,.2,1), transform .8s cubic-bezier(.2,.8,.2,1); }
.js-motion [data-reveal].in { opacity: 1; transform: none; }
.js-motion [data-stagger]:not(.in) > * { opacity: 0; }
.js-motion [data-stagger].in > * { animation: hx-up .7s cubic-bezier(.2,.8,.2,1) backwards; animation-delay: calc(var(--i, 0) * 65ms); }

/* Signature details */
.js-motion .hx-glow { animation: hx-glow 3.2s ease-in-out infinite; }
.js-motion .hx-site::after { animation: hx-pulse 1.8s ease-in-out infinite; }
.hx-niche, .hx-site { transition: transform .35s cubic-bezier(.2,.8,.2,1), border-color .25s ease, box-shadow .25s ease; transform-style: preserve-3d; }
.hx-niche::after {
  content: ""; position: absolute; inset: 0; pointer-events: none; opacity: 0; transition: opacity .3s ease;
  background: radial-gradient(circle at var(--mx, 50%) var(--my, 30%), rgba(251,226,154,.28), transparent 55%);
}
.hx-niche:hover { border-color: rgba(251,226,154,.7); box-shadow: 0 24px 60px rgba(227,173,62,.22); }
.hx-niche:hover::after { opacity: 1; }
.hx-niche-more::after { display: none; }
.hx-steps li { transition: transform .3s ease, border-color .3s ease; }
.hx-steps li:hover { transform: translateY(-6px); border-color: rgba(251,226,154,.55); }
.js-motion .hx-stats-grid > div { opacity: 0; }
.js-motion .hx-stats-grid.in > div { animation: hx-up .7s cubic-bezier(.2,.8,.2,1) backwards; opacity: 1; }
.js-motion .hx-stats-grid.in > div:nth-child(2) { animation-delay: .08s; }
.js-motion .hx-stats-grid.in > div:nth-child(3) { animation-delay: .16s; }
.js-motion .hx-stats-grid.in > div:nth-child(4) { animation-delay: .24s; }

@media (prefers-reduced-motion: reduce) {
  .hx-hero-bg img, .hx-sparks, .hx-ticker-track, .hx-btn-gold::after, .btn-primary::after { animation: none !important; }
  .hx-sparks { display: none; }
}
.hx-stats strong, .hx-big { font-variant-numeric: tabular-nums; }

/* ---------- Niche power ---------- */
.hx-power { padding: clamp(64px, 9vw, 120px) 0; background: radial-gradient(50% 70% at 80% 50%, rgba(227,173,62,.14), transparent 70%), var(--ink); }
.hx-power-grid { display: grid; grid-template-columns: 1.1fr .9fr; gap: clamp(32px, 5vw, 72px); align-items: center; }
.hx-power .hx-h2 { font-size: clamp(40px, 5.2vw, 76px); }
.hx-power-points { list-style: none; padding: 0; margin: 0 0 30px; display: grid; gap: 14px; }
.hx-power-points li { display: grid; gap: 2px; padding-left: 40px; position: relative; }
.hx-power-points li::before { content: "✦"; position: absolute; left: 0; top: 0; width: 28px; height: 28px; display: grid; place-items: center; border-radius: 50%; background: var(--gold-grad); color: #1a1206; font-size: 13px; }
.hx-power-points strong { color: var(--cream); font-size: 17px; }
.hx-power-points span { color: var(--muted); font-size: 15px; }
.hx-power-stack { position: relative; height: clamp(340px, 34vw, 460px); }
.hx-power-stack img { position: absolute; top: 50%; width: clamp(150px, 18vw, 260px); height: auto; aspect-ratio: 3 / 4; object-fit: cover; border-radius: 20px; border: 1px solid rgba(251,226,154,.35); box-shadow: 0 24px 60px rgba(0,0,0,.6); }
.hx-power-stack img:nth-child(1) { left: 0; transform: translateY(-50%) rotate(-9deg); }
.hx-power-stack img:nth-child(2) { left: 50%; transform: translate(-50%, -54%); z-index: 2; }
.hx-power-stack img:nth-child(3) { right: 0; transform: translateY(-50%) rotate(9deg); }
@media (max-width: 860px) { .hx-power-grid { grid-template-columns: 1fr; } .hx-power-stack { height: 300px; } .hx-power-stack img { width: 42vw; max-width: 200px; } }

/* ---------- Niche "view" cue ---------- */
.hx-niche-go { display: inline-flex; align-items: center; gap: 6px; margin-top: 8px; padding: 5px 11px; border-radius: 999px; background: rgba(10,9,7,.6); border: 1px solid rgba(251,226,154,.55); font: 700 11px/1 "Inter", sans-serif; letter-spacing: .08em; text-transform: uppercase; color: var(--gold-hi); }
.hx-niche-go b { transition: transform .25s ease; }
.hx-niche:hover .hx-niche-go { background: var(--gold-grad); color: #1a1206; border-color: transparent; }
.hx-niche:hover .hx-niche-go b { transform: translateX(3px); }
.hx-niche > span { display: flex; flex-direction: column; align-items: center; }

/* ---------- Revenue calculator ---------- */
.hx-calc { text-align: center; background: radial-gradient(60% 60% at 50% 40%, rgba(227,173,62,.14), transparent 70%), var(--ink); }
.hx-calc-card { max-width: 960px; margin: 40px auto 0; padding: clamp(24px, 4vw, 48px); border-radius: 28px; border: 1px solid rgba(251,226,154,.3); background: linear-gradient(180deg, rgba(227,173,62,.1), rgba(10,9,7,.6)); box-shadow: 0 30px 90px rgba(0,0,0,.55); }
.hx-calc-input label { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; margin-bottom: 18px; color: var(--muted); font-weight: 700; text-transform: uppercase; letter-spacing: .1em; font-size: 13px; }
.hx-calc-input label strong { font: 400 clamp(34px, 5vw, 56px)/1 var(--display); color: var(--cream); letter-spacing: .01em; }
.hx-calc #calcRevenue { width: 100%; height: 10px; border-radius: 999px; appearance: none; -webkit-appearance: none; background: rgba(255,255,255,.1); outline-offset: 6px; cursor: pointer; }
.hx-calc #calcRevenue::-webkit-slider-thumb { -webkit-appearance: none; width: 30px; height: 30px; border-radius: 50%; background: var(--gold-grad); border: 3px solid #1a1206; box-shadow: 0 0 0 4px rgba(227,173,62,.35), 0 6px 20px rgba(0,0,0,.5); }
.hx-calc #calcRevenue::-moz-range-thumb { width: 26px; height: 26px; border-radius: 50%; background: #e7b54a; border: 3px solid #1a1206; }
.hx-calc-ticks { display: flex; justify-content: space-between; margin-top: 10px; color: var(--muted); font-size: 12px; font-weight: 600; }
.hx-calc-results { display: grid; grid-template-columns: 1.3fr 1fr 1fr; gap: 14px; margin: 32px 0 18px; }
.hx-calc-result { padding: 22px 16px; border-radius: 18px; background: rgba(10,9,7,.55); border: 1px solid rgba(251,226,154,.18); display: grid; gap: 6px; }
.hx-calc-result span { color: var(--muted); font-size: 12px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.hx-calc-result strong { font: 400 clamp(30px, 3.6vw, 44px)/1 var(--display); color: var(--cream); font-variant-numeric: tabular-nums; }
.hx-calc-result em { font-style: normal; color: var(--muted); font-size: 13px; }
.hx-calc-main { background: var(--gold-grad); border: 0; }
.hx-calc-main span, .hx-calc-main em { color: rgba(26,18,6,.75); }
.hx-calc-main strong { color: #1a1206; font-size: clamp(40px, 5vw, 60px); }
.hx-calc-note { color: var(--muted); font-size: 13px; margin: 0 0 24px; }
@media (max-width: 760px) { .hx-calc-results { grid-template-columns: 1fr; } }