:root{
  --sx2-bg:#09090d;
  --sx2-bg2:#101016;
  --sx2-surface:#13131b;
  --sx2-border:rgba(255,255,255,.11);
  --sx2-text:#f8f7fb;
  --sx2-muted:#a8a6b2;
  --sx2-purple:#825cff;
  --sx2-pink:#e749c8;
  --sx2-blue:#5577ff;
}

.sx-home-v2{background:var(--sx2-bg);color:var(--sx2-text)}
.sx-home-v2 .sx-brand img{height:54px;width:auto}
.sx-ai-nav{background:none;border:0;color:#fff;font:inherit;cursor:pointer}

.sx2-hero{
  position:relative;
  padding:120px 0 90px;
  overflow:hidden;
}
.sx2-hero:before{
  content:"";
  position:absolute;
  width:780px;height:780px;
  right:-180px;top:-250px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(130,92,255,.25),rgba(231,73,200,.08) 42%,transparent 70%);
  pointer-events:none;
}
.sx2-hero-grid{
  display:grid;
  grid-template-columns:minmax(0,1.08fr) minmax(420px,.92fr);
  gap:80px;
  align-items:center;
}
.sx2-eyebrow,.sx2-label,.sx2-heading>div>span{
  font:700 12px/1.2 Quantico,sans-serif;
  letter-spacing:.16em;
  color:#b9adff;
}
.sx2-eyebrow{display:flex;gap:10px;align-items:center;margin-bottom:25px}
.sx2-eyebrow span{width:24px;height:2px;background:linear-gradient(90deg,var(--sx2-purple),var(--sx2-pink))}
.sx2-hero h1{
  font-size:clamp(52px,6.1vw,92px);
  line-height:.98;
  letter-spacing:-.055em;
  max-width:900px;
  margin:0;
}
.sx2-hero h1 span{
  display:block;
  background:linear-gradient(95deg,#fff 5%,#a998ff 45%,#f057c6 85%);
  -webkit-background-clip:text;
  color:transparent;
}
.sx2-hero-copy>p{
  max-width:700px;
  color:var(--sx2-muted);
  font-size:19px;
  line-height:1.7;
  margin:30px 0;
}
.sx2-actions{display:flex;gap:14px;flex-wrap:wrap}
.sx2-primary,.sx2-secondary{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:50px;
  border-radius:10px;
  padding:0 20px;
  text-decoration:none;
  font-weight:600;
}
.sx2-primary{
  color:#fff;
  background:linear-gradient(100deg,var(--sx2-purple),var(--sx2-pink));
  box-shadow:0 14px 38px rgba(130,92,255,.25);
}
.sx2-secondary{
  color:#fff;
  border:1px solid var(--sx2-border);
  background:rgba(255,255,255,.035);
}
.sx2-period{margin-top:24px;color:#8f8d99;font-size:13px;display:flex;gap:8px;align-items:center}

.sx2-ai-card{
  position:relative;
  border:1px solid rgba(164,133,255,.25);
  background:linear-gradient(155deg,rgba(27,25,40,.96),rgba(12,12,18,.98));
  border-radius:24px;
  padding:28px;
  box-shadow:0 40px 100px rgba(0,0,0,.45);
}
.sx2-ai-card:after{
  content:"";
  position:absolute;
  inset:-1px;
  border-radius:24px;
  pointer-events:none;
  background:linear-gradient(120deg,rgba(130,92,255,.25),transparent 35%,rgba(231,73,200,.17));
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;
  padding:1px;
}
.sx2-ai-head{display:flex;justify-content:space-between;align-items:flex-start}
.sx2-ai-head div{display:flex;flex-direction:column;gap:6px}
.sx2-ai-head small{color:#9686ff;font:700 10px Quantico;letter-spacing:.16em}
.sx2-ai-head strong{font-size:25px}
.sx2-ai-head>span{font-size:10px;padding:6px 9px;border-radius:30px;background:rgba(91,230,185,.1);color:#6ce3bd}
.sx2-ai-intro{color:#aaa8b5;line-height:1.6;margin:20px 0}
.sx2-ai-prompts{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.sx2-ai-prompts button{
  text-align:left;
  padding:12px;
  border-radius:10px;
  border:1px solid var(--sx2-border);
  background:#111119;
  color:#d8d5df;
  cursor:pointer;
}
.sx2-ai-prompts button:hover{border-color:#765ef0}
.sx2-ai-form{
  display:flex;
  gap:8px;
  margin-top:18px;
  padding:7px;
  border:1px solid var(--sx2-border);
  border-radius:13px;
  background:#09090e;
}
.sx2-ai-form input{flex:1;border:0;background:none;color:#fff;padding:8px;outline:none;min-width:0}
.sx2-ai-form button{border:0;border-radius:9px;padding:0 17px;background:#fff;color:#08080c;font-weight:700;cursor:pointer}
.sx2-ai-foot{font-size:11px;color:#777582;margin-top:12px}
.sx2-ai-result{
  margin-top:16px;
  border:1px solid var(--sx2-border);
  background:rgba(255,255,255,.025);
  padding:16px;
  border-radius:12px;
  color:#d9d7df;
  font-size:14px;
  line-height:1.55;
}

.sx2-logo-strip{border-top:1px solid var(--sx2-border);border-bottom:1px solid var(--sx2-border);padding:26px 0}
.sx2-strip-label{text-align:center;color:#777582;font-size:12px;margin-bottom:20px;text-transform:uppercase;letter-spacing:.12em}
.sx2-logo-grid{display:grid;grid-template-columns:repeat(10,1fr);gap:10px}
.sx2-logo-grid a{
  min-height:78px;
  border:1px solid var(--sx2-border);
  border-radius:12px;
  background:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:12px;
  position:relative;
}
.sx2-logo-grid a span{
  position:absolute;top:6px;left:7px;color:#777;font-size:9px;font-weight:700;
}
.sx2-logo-grid img{max-width:90%;max-height:37px;object-fit:contain}

.sx2-section{padding:100px 0}
.sx2-heading{
  display:grid;
  grid-template-columns:1.2fr .8fr;
  gap:80px;
  align-items:end;
  margin-bottom:45px;
}
.sx2-heading h2{
  font-size:clamp(38px,4.7vw,66px);
  line-height:1.02;
  letter-spacing:-.045em;
  margin:10px 0 0;
}
.sx2-heading>p{color:var(--sx2-muted);font-size:16px;line-height:1.7;margin:0}

.sx2-ranking{border-top:1px solid var(--sx2-border)}
.sx2-rank-row{
  display:grid;
  grid-template-columns:60px 70px 1fr 150px 30px;
  gap:16px;
  align-items:center;
  border-bottom:1px solid var(--sx2-border);
  padding:17px 8px;
  text-decoration:none;
  color:#fff;
}
.sx2-rank-row:hover{background:rgba(255,255,255,.025)}
.sx2-rank-number{font:700 14px Quantico;color:#8374dc}
.sx2-rank-logo{height:48px;width:58px;border-radius:8px;background:#fff;display:flex;align-items:center;justify-content:center;padding:7px}
.sx2-rank-logo img{max-height:100%;max-width:100%}
.sx2-rank-name{display:flex;flex-direction:column;gap:5px}
.sx2-rank-name strong{font-size:18px}
.sx2-rank-name small,.sx2-score small{color:#777582}
.sx2-score{display:flex;flex-direction:column;align-items:flex-end;gap:4px}
.sx2-score strong{font:700 17px Quantico}
.sx2-arrow{color:#7769db}
.sx2-center{text-align:center;margin-top:35px}

.sx2-featured{background:linear-gradient(180deg,#0c0c12,#101019)}
.sx2-featured-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.sx2-partner-card{
  border:1px solid var(--sx2-border);
  border-radius:18px;
  padding:26px;
  background:#111118;
}
.sx2-partner-primary{background:linear-gradient(150deg,#171426,#101017)}
.sx2-sponsored-label{font-size:10px;letter-spacing:.13em;color:#8d86a1;text-transform:uppercase}
.sx2-partner-logo{height:72px;background:#fff;border-radius:10px;margin:25px 0 18px;display:flex;align-items:center;justify-content:center;padding:12px}
.sx2-partner-logo img{max-width:75%;max-height:45px}
.sx2-partner-card h3{font-size:25px;margin:16px 0 10px}
.sx2-partner-card p{color:#9795a1;line-height:1.65;min-height:78px}
.sx2-partner-card a{color:#fff;text-decoration:none;font-weight:600}
.sx2-ai-mark{
  width:68px;height:68px;border-radius:14px;
  display:flex;align-items:center;justify-content:center;
  margin-top:25px;font:700 22px Quantico;
  background:linear-gradient(135deg,var(--sx2-purple),var(--sx2-pink));
}
.sx2-sponsored-note{text-align:right;color:#64626d;font-size:11px;margin-top:14px}

.sx2-market-grid,.sx2-method-grid,.sx2-research-grid,.sx2-pulse-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:14px;
}
.sx2-market-grid article,.sx2-method-grid article,.sx2-research-grid article,.sx2-pulse-grid>div{
  border:1px solid var(--sx2-border);
  border-radius:16px;
  background:var(--sx2-surface);
  padding:24px;
}
.sx2-market-grid small,.sx2-method-grid b,.sx2-research-grid small{font:700 11px Quantico;color:#806ee8;letter-spacing:.1em}
.sx2-market-grid h3,.sx2-method-grid h3,.sx2-research-grid h3{font-size:21px;margin:28px 0 12px}
.sx2-market-grid p,.sx2-method-grid p,.sx2-research-grid p{color:#9795a1;line-height:1.65}
.sx2-market-grid span,.sx2-research-grid span{color:#d8d5df;font-size:13px}

.sx2-profile-showcase{background:#f4f2ef;color:#111}
.sx2-profile-grid{display:grid;grid-template-columns:1fr .85fr;gap:90px;align-items:center}
.sx2-profile-grid h2{font-size:clamp(40px,5vw,68px);line-height:1.02;letter-spacing:-.045em;margin:14px 0 22px}
.sx2-profile-grid>div>p{color:#5b5960;line-height:1.8;max-width:650px}
.sx2-inline-link{color:#111;border-color:#c9c7c4;margin-top:20px}
.sx2-profile-preview{background:#0e0e14;color:#fff;border-radius:22px;padding:28px;box-shadow:0 35px 80px rgba(0,0,0,.22)}
.sx2-profile-top{display:flex;justify-content:space-between;gap:25px;border-bottom:1px solid var(--sx2-border);padding-bottom:22px}
.sx2-profile-top span{font:700 10px Quantico;color:#8e7af0}
.sx2-profile-top strong{font-size:24px}
.sx2-profile-body{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;padding:25px 0}
.sx2-profile-body div{display:flex;flex-direction:column;gap:7px}
.sx2-profile-body small{color:#777582}
.sx2-profile-preview>a{color:#fff;text-decoration:none}

.sx2-pulse-grid>div{display:flex;flex-direction:column;gap:8px}
.sx2-pulse-grid strong{font-size:27px}
.sx2-pulse-grid span{color:#888692;font-size:13px}

.sx2-research-grid{grid-template-columns:repeat(3,1fr)}
.sx2-claim{background:linear-gradient(115deg,#171229,#0b0b11)}
.sx2-claim-inner{display:grid;grid-template-columns:1fr auto;gap:60px;align-items:center}
.sx2-claim h2{font-size:52px;margin:8px 0 13px}
.sx2-claim p{color:#aaa6b4;max-width:690px}
.sx2-claim-actions{display:flex;gap:10px}
.sx2-claim-actions button{font:inherit;cursor:pointer}
.sx2-method-grid{grid-template-columns:repeat(3,1fr)}

.sx-footer button{background:none;border:0;color:inherit;padding:0;text-align:left;font:inherit;cursor:pointer}

@media(max-width:1050px){
  .sx2-hero-grid,.sx2-profile-grid,.sx2-heading,.sx2-claim-inner{grid-template-columns:1fr}
  .sx2-logo-grid{grid-template-columns:repeat(5,1fr)}
  .sx2-featured-grid{grid-template-columns:1fr}
  .sx2-market-grid,.sx2-pulse-grid{grid-template-columns:repeat(2,1fr)}
  .sx2-research-grid,.sx2-method-grid{grid-template-columns:1fr}
}
@media(max-width:650px){
  .sx2-hero{padding:85px 0 60px}
  .sx2-hero h1{font-size:48px}
  .sx2-ai-prompts{grid-template-columns:1fr}
  .sx2-logo-grid{grid-template-columns:repeat(2,1fr)}
  .sx2-rank-row{grid-template-columns:42px 52px 1fr 22px}
  .sx2-score{display:none}
  .sx2-market-grid,.sx2-pulse-grid{grid-template-columns:1fr}
  .sx2-claim h2{font-size:40px}
  .sx2-claim-actions{flex-direction:column}
}

/* =========================================================
   P1.5 PREMIUM OVERRIDE
   ========================================================= */

.sx2-logo-strip{
    padding:38px 0 42px;
    background:#09090d;
    border-top:1px solid rgba(255,255,255,.06);
    border-bottom:1px solid rgba(255,255,255,.06);
    overflow:hidden;
}

.sx2-strip-label{
    text-align:left;
    margin-bottom:28px;
    color:rgba(255,255,255,.34);
    font-size:10px;
    letter-spacing:.17em;
}

.sx2-logo-grid{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:46px;
}

.sx2-logo-grid a{
    min-height:0;
    height:48px;
    flex:1 1 0;
    padding:0;
    border:0;
    border-radius:0;
    background:transparent;
    overflow:visible;
}

.sx2-logo-grid a span{
    display:none;
}

.sx2-logo-grid img{
    max-width:125px;
    max-height:34px;
    width:auto;
    height:auto;
    object-fit:contain;

    filter:
        grayscale(1)
        brightness(3)
        contrast(.6);

    opacity:.30;
    transition:
        opacity .3s ease,
        filter .3s ease,
        transform .3s ease;
}

.sx2-logo-grid a:hover img{
    opacity:.95;
    filter:grayscale(0) brightness(1);
    transform:translateY(-2px);
}


/* hero — larger, calmer, more premium */

.sx2-hero{
    padding:150px 0 115px;
    min-height:760px;
    display:flex;
    align-items:center;
}

.sx2-hero:before{
    width:1000px;
    height:1000px;
    right:-260px;
    top:-380px;
    background:
      radial-gradient(
        circle,
        rgba(141,67,255,.31) 0%,
        rgba(101,63,255,.13) 34%,
        rgba(216,54,201,.06) 51%,
        transparent 70%
      );
}

.sx2-hero:after{
    content:"";
    position:absolute;
    width:650px;
    height:650px;
    left:25%;
    bottom:-480px;
    border-radius:50%;
    background:radial-gradient(
        circle,
        rgba(91,79,255,.12),
        transparent 68%
    );
    pointer-events:none;
}

.sx2-hero-grid{
    grid-template-columns:minmax(0,1.18fr) minmax(430px,.82fr);
    gap:100px;
}

.sx2-hero h1{
    max-width:980px;
    font-size:clamp(66px,6.7vw,106px);
    line-height:.93;
    letter-spacing:-.065em;
}

.sx2-hero-copy>p{
    max-width:660px;
    font-size:18px;
    color:rgba(255,255,255,.55);
}

.sx2-eyebrow{
    margin-bottom:32px;
    color:#a995ff;
}


/* AI product panel */

.sx2-ai-card{
    padding:32px;
    border-radius:28px;
    background:
      linear-gradient(
        155deg,
        rgba(24,20,37,.86),
        rgba(10,10,15,.94)
      );
    border:1px solid rgba(170,136,255,.22);
    backdrop-filter:blur(18px);
    box-shadow:
      0 50px 120px rgba(0,0,0,.50),
      0 0 100px rgba(124,75,255,.08);
}

.sx2-ai-prompts button{
    background:rgba(255,255,255,.035);
    border-color:rgba(255,255,255,.08);
}


/* featured before ranking — stronger premium composition */

.sx2-featured{
    padding-top:105px;
    padding-bottom:105px;
    background:
      radial-gradient(circle at 18% 20%,rgba(121,67,255,.10),transparent 32%),
      #0b0b11;
}

.sx2-featured-grid{
    gap:22px;
}

.sx2-partner-card{
    min-height:365px;
    padding:32px;
    border-radius:24px;
    border:1px solid rgba(255,255,255,.09);
    background:rgba(255,255,255,.018);
}

.sx2-partner-primary{
    background:
      linear-gradient(145deg,rgba(115,65,255,.13),rgba(255,255,255,.015));
}

.sx2-partner-logo{
    height:84px;
    margin:30px 0 28px;
    padding:0;
    background:transparent;
    border-radius:0;
    justify-content:flex-start;
}

.sx2-partner-logo img{
    max-width:190px;
    max-height:58px;
    filter:brightness(2) grayscale(1);
    opacity:.68;
}


/* ranking becomes quieter editorial table */

.sx2-ranking{
    border-top:1px solid rgba(255,255,255,.07);
}

.sx2-rank-row{
    min-height:96px;
    padding:20px 8px;
    border-bottom:1px solid rgba(255,255,255,.07);
}

.sx2-rank-logo{
    width:62px;
    height:44px;
    background:transparent;
    padding:0;
    border-radius:0;
}

.sx2-rank-logo img{
    max-width:58px;
    max-height:32px;
    filter:grayscale(1) brightness(2.2);
    opacity:.48;
}

.sx2-rank-row:hover .sx2-rank-logo img{
    filter:none;
    opacity:1;
}

.sx2-rank-row:hover{
    background:rgba(255,255,255,.018);
}


/* reduce generic card-grid feel */

.sx2-market-grid article,
.sx2-method-grid article,
.sx2-research-grid article,
.sx2-pulse-grid>div{
    background:transparent;
    border-color:rgba(255,255,255,.07);
    border-radius:20px;
}

@media(max-width:1050px){
    .sx2-logo-grid{
        overflow-x:auto;
        justify-content:flex-start;
    }

    .sx2-logo-grid a{
        min-width:120px;
    }
}

/* P1.6 LOGO RAIL */

.sx2-logo-strip{
  padding:44px 0 48px;
}

.sx2-logo-grid{
  gap:52px;
  align-items:center;
}

.sx2-logo-grid a{
  height:42px;
  display:flex;
  align-items:center;
  justify-content:center;
}

.sx2-logo-grid img{
  max-width:130px;
  max-height:30px;

  filter:
    grayscale(1)
    brightness(2.8)
    contrast(.45);

  opacity:.22;
  mix-blend-mode:screen;
}

.sx2-logo-grid a:hover img{
  opacity:.85;
  filter:grayscale(1) brightness(3.5);
}

.sx2-strip-label{
  opacity:.55;
}

/* =========================================================
   P1.6 CINEMATIC HOMEPAGE
   ========================================================= */

.sx2-hero{
  min-height:900px;
  padding:160px 0 100px;
  position:relative;
  isolation:isolate;
}

.sx2-hero:before{
  width:1100px;
  height:1100px;
  right:-300px;
  top:-430px;

  background:
    radial-gradient(
      circle,
      rgba(136,75,255,.30) 0%,
      rgba(110,75,255,.14) 28%,
      rgba(202,65,214,.05) 48%,
      transparent 70%
    );
}

.sx2-hero-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:55px;
  position:relative;
}

.sx2-hero-copy{
  max-width:1220px;
  position:relative;
  z-index:2;
}

.sx2-hero h1{
  max-width:1200px;
  font-size:clamp(76px,8.1vw,132px);
  line-height:.89;
  letter-spacing:-.075em;
}

.sx2-hero h1 span{
  display:inline;
}

.sx2-hero-copy>p{
  max-width:690px;
  font-size:19px;
  line-height:1.7;
  margin-top:34px;
}

.sx2-actions{
  margin-top:34px;
}

.sx2-ai-card{
  width:min(820px,68vw);
  margin-left:auto;
  margin-top:-110px;

  padding:34px;

  border-radius:28px;

  background:
    linear-gradient(
      150deg,
      rgba(26,22,43,.88),
      rgba(10,10,15,.94)
    );

  transform:perspective(1200px) rotateY(-3deg);

  box-shadow:
    0 55px 120px rgba(0,0,0,.58),
    -40px 0 110px rgba(106,69,255,.09);
}

.sx2-ai-head strong{
  font-size:30px;
}

.sx2-ai-intro{
  max-width:560px;
}

.sx2-ai-prompts{
  grid-template-columns:repeat(2,1fr);
}

.sx2-ai-prompts button{
  min-height:54px;
  padding:14px;
}

.sx2-ai-form{
  margin-top:22px;
  min-height:56px;
}

.sx2-period{
  opacity:.65;
}


/* stronger section spacing */

.sx2-section{
  padding:135px 0;
}

.sx2-heading{
  margin-bottom:68px;
}

.sx2-heading h2{
  max-width:840px;
  font-size:clamp(52px,5.5vw,82px);
  line-height:.95;
  letter-spacing:-.06em;
}


/* featured becomes much more editorial */

.sx2-featured-grid{
  grid-template-columns:1.15fr .925fr .925fr;
}

.sx2-partner-card{
  min-height:390px;
  padding:38px;
  background:transparent;
}

.sx2-partner-primary{
  background:
    radial-gradient(circle at 15% 0%,rgba(134,75,255,.17),transparent 42%),
    rgba(255,255,255,.015);
}

.sx2-partner-card h3{
  font-size:30px;
  letter-spacing:-.035em;
}


/* organic table becomes cleaner */

.sx2-rank-row{
  min-height:112px;
  padding:24px 12px;
}

.sx2-rank-number{
  font-size:12px;
  opacity:.65;
}

.sx2-rank-name strong{
  font-size:21px;
}

.sx2-score strong{
  font-size:20px;
}


/* premium surface differentiation */

.sx2-profile-showcase{
  padding-top:150px;
  padding-bottom:150px;
}

.sx2-market{
  position:relative;
}

.sx2-market:before{
  content:"";
  position:absolute;
  width:650px;
  height:650px;
  right:-300px;
  top:-200px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(117,77,255,.08),transparent 68%);
}

@media(max-width:900px){
  .sx2-hero{
    min-height:auto;
  }

  .sx2-hero h1{
    font-size:clamp(54px,12vw,82px);
  }

  .sx2-ai-card{
    width:100%;
    margin:0;
    transform:none;
  }

  .sx2-featured-grid{
    grid-template-columns:1fr;
  }
}

/* ==========================================================
   P1.7 — PREMIUM CLIENT-ORIENTED HOMEPAGE
   ========================================================== */

.sx-home-v2{
  background:#07070b;
}

/* NAV ASK */

.sx-ai-nav--brand{
  display:flex;
  align-items:center;
  gap:7px;
  padding:6px 10px 6px 7px;
  border:1px solid rgba(255,255,255,.10);
  border-radius:999px;
  background:rgba(255,255,255,.025);
}

.sx-ai-nav--brand img{
  width:62px;
  height:auto;
  object-fit:contain;
}

.sx-ai-nav--brand span{
  font-size:12px;
  font-weight:600;
}


/* HERO — TRUE SPLIT */

.sx2-hero--split{
  padding:125px 0 90px;
  min-height:760px;
  background:
    radial-gradient(circle at 83% 45%,rgba(110,58,255,.15),transparent 34%),
    radial-gradient(circle at 63% 80%,rgba(219,59,205,.06),transparent 30%);
}

.sx2-hero--split .sx2-hero-grid{
  display:grid;
  grid-template-columns:minmax(0,.92fr) minmax(520px,1.08fr);
  gap:80px;
  align-items:center;
}

.sx2-hero--split .sx2-hero-copy{
  max-width:none;
}

.sx2-hero--split .sx2-hero h1{
  font-size:clamp(64px,6vw,100px);
  line-height:.94;
  max-width:690px;
}

.sx2-hero--split .sx2-ai-card{
  width:auto;
  margin:0;
  transform:none;
  min-height:470px;
  padding:38px;
}


/* LOGO MARQUEE */

.sx2-logo-strip{
  padding:40px 0 44px;
  background:#08080c;
  overflow:hidden;
}

.sx2-strip-label{
  text-align:center;
  font-size:10px;
  margin-bottom:28px;
  letter-spacing:.20em;
}

.sx2-logo-track{
  overflow:hidden;
  -webkit-mask-image:linear-gradient(
    90deg,
    transparent,
    #000 8%,
    #000 92%,
    transparent
  );
  mask-image:linear-gradient(
    90deg,
    transparent,
    #000 8%,
    #000 92%,
    transparent
  );
}

.sx2-logo-track__inner{
  width:max-content;
  display:flex;
  gap:85px;
  align-items:center;
  animation:sxLogoRail 28s linear infinite;
}

.sx2-logo-track:hover .sx2-logo-track__inner{
  animation-play-state:paused;
}

@keyframes sxLogoRail{
  from{transform:translateX(0)}
  to{transform:translateX(-50%)}
}

.sx2-logo-brand{
  width:190px;
  height:66px;
  display:flex;
  align-items:center;
  justify-content:center;
}

.sx2-logo-brand img{
  max-width:155px;
  max-height:43px;
  object-fit:contain;

  filter:grayscale(1);
  opacity:.36;

  transition:
    filter .3s ease,
    opacity .3s ease,
    transform .3s ease;
}

.sx2-logo-brand:hover img{
  filter:grayscale(0);
  opacity:1;
  transform:scale(1.04);
}

.sx2-logo-brand--featured img{
  max-width:180px;
}


/* FEATURED */

.sx2-featured{
  background:
    radial-gradient(circle at 20% 30%,rgba(111,58,255,.12),transparent 32%),
    #09090f;
}

.sx2-featured-grid{
  gap:18px;
}

.sx2-partner-card{
  min-height:315px;
  padding:30px;
}

.sx2-partner-card:nth-child(1){
  background:
    linear-gradient(140deg,#3030ca 0%,#7213b2 55%,#15101d 100%);
}

.sx2-partner-card:nth-child(2){
  background:
    linear-gradient(140deg,#1586d1 0%,#5922c1 55%,#15101d 100%);
}

.sx2-partner-card:nth-child(3){
  background:
    linear-gradient(140deg,#9b32e4 0%,#441585 53%,#15101d 100%);
}

.sx2-partner-logo{
  height:70px;
  margin:22px 0 18px;
}

.sx2-partner-logo img{
  max-width:175px;
  max-height:54px;
  filter:none;
  opacity:1;
}

.sx2-partner-card h3{
  font-size:26px;
}

.sx2-partner-card p{
  color:rgba(255,255,255,.72);
  min-height:auto;
}


/* STACK / ECOSYSTEM */

.sx2-stack{
  padding:135px 0;
  background:
    radial-gradient(circle at 70% 50%,rgba(82,49,187,.14),transparent 37%),
    #07070b;
}

.sx2-stack-head{
  max-width:900px;
  margin:0 auto 60px;
  text-align:center;
}

.sx2-stack-head>span{
  color:#a48aff;
  font:700 11px Quantico,sans-serif;
  letter-spacing:.17em;
}

.sx2-stack-head h2{
  font-size:clamp(48px,5vw,76px);
  line-height:.96;
  letter-spacing:-.055em;
  margin:14px 0 20px;
}

.sx2-stack-head p{
  color:#9693a0;
  font-size:17px;
  line-height:1.65;
}

.sx2-stack-table{
  border:1px solid rgba(255,255,255,.12);
  border-radius:22px;
  overflow:hidden;
  background:rgba(255,255,255,.015);
}

.sx2-stack-row{
  display:grid;
  grid-template-columns:1.2fr .8fr 1.4fr auto;
  gap:25px;
  align-items:center;
  padding:23px 26px;
  border-bottom:1px solid rgba(255,255,255,.08);
}

.sx2-stack-row:last-child{
  border-bottom:0;
}

.sx2-stack-row>div{
  color:#bbb8c6;
  font-size:13px;
}

.sx2-stack-row strong{
  display:block;
  color:#fff;
  font-size:15px;
}

.sx2-stack-row small{
  display:block;
  color:#777482;
  margin-top:4px;
}

.sx2-stack-row b{
  color:#fff;
  font-size:15px;
}

.sx2-stack-row a,
.sx2-stack-row button{
  color:#a88cff;
  border:0;
  background:none;
  text-decoration:none;
  cursor:pointer;
  font:600 12px Lexend Deca,sans-serif;
  white-space:nowrap;
}

.sx2-stack-header{
  background:rgba(255,255,255,.025);
  color:#fff;
}


/* RESEARCH / BLOG */

.sx2-research-grid{
  grid-template-columns:repeat(3,1fr);
  gap:18px;
}

.sx2-research-grid article{
  overflow:hidden;
  min-height:430px;
  padding:24px;
  border:1px solid rgba(255,255,255,.10);
  border-radius:28px;
  background:#13101e;
}

.sx2-card-visual{
  height:190px;
  border-radius:18px;
  margin-bottom:25px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  border:1px solid rgba(255,255,255,.12);
}

.sx2-card-visual strong{
  font-size:58px;
  line-height:1;
  letter-spacing:-.06em;
}

.sx2-card-visual span{
  font-size:11px;
  margin-top:10px;
  color:rgba(255,255,255,.64);
}

.sx2-research-grid .is-purple .sx2-card-visual{
  background:linear-gradient(135deg,#22206f,#6f19b7);
}

.sx2-research-grid .is-blue .sx2-card-visual{
  background:linear-gradient(135deg,#168fd1,#4416ae);
}

.sx2-research-grid .is-pink .sx2-card-visual{
  background:linear-gradient(135deg,#7426e3,#d342ca);
}

.sx2-research-grid .is-violet .sx2-card-visual{
  background:linear-gradient(135deg,#251b5c,#6516a5);
}

.sx2-research-grid .is-indigo .sx2-card-visual{
  background:linear-gradient(135deg,#1947af,#5c1aa0);
}

.sx2-research-grid article h3{
  font-size:24px;
  margin:15px 0 12px;
}

.sx2-research-grid article a{
  color:#fff;
  text-decoration:none;
  display:inline-block;
  margin-top:15px;
  font-size:13px;
}


/* FAQ */

.sx2-faq{
  padding:140px 0;
  background:
    radial-gradient(circle at 50% 100%,rgba(111,58,255,.12),transparent 42%),
    #07070b;
}

.sx2-faq-head{
  max-width:850px;
  margin:0 auto 60px;
  text-align:center;
}

.sx2-faq-head>span{
  font:700 11px Quantico,sans-serif;
  color:#9d80ff;
  letter-spacing:.18em;
}

.sx2-faq-head h2{
  font-size:clamp(46px,5vw,72px);
  line-height:.98;
  letter-spacing:-.055em;
  margin:12px 0;
}

.sx2-faq-list{
  border-top:1px solid rgba(255,255,255,.12);
}

.sx2-faq-list details{
  border-bottom:1px solid rgba(255,255,255,.12);
  padding:0;
}

.sx2-faq-list summary{
  list-style:none;
  cursor:pointer;
  padding:28px 5px;
  font-size:25px;
  letter-spacing:-.025em;
  position:relative;
}

.sx2-faq-list summary::-webkit-details-marker{
  display:none;
}

.sx2-faq-list summary:after{
  content:"+";
  position:absolute;
  right:8px;
  top:50%;
  transform:translateY(-50%);
  color:#9980ff;
}

.sx2-faq-list details[open] summary:after{
  content:"–";
}

.sx2-faq-list p{
  max-width:850px;
  margin:-6px 0 28px;
  color:#92909b;
  line-height:1.7;
}


/* FOOTER */

.sx3-footer{
  padding:110px 0 28px;
  background:
    radial-gradient(circle at 34% 100%,rgba(75,26,145,.30),transparent 39%),
    #0a0711;
  border-top:1px solid rgba(255,255,255,.08);
}

.sx3-footer-top{
  display:grid;
  grid-template-columns:1.35fr repeat(4,1fr);
  gap:55px;
}

.sx3-footer-brand img{
  width:180px;
  height:auto;
}

.sx3-footer-brand p{
  margin-top:22px;
  max-width:280px;
  color:#85818e;
  line-height:1.65;
  font-size:13px;
}

.sx3-footer-ask{
  margin-top:18px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:999px;
  background:transparent;
  color:#fff;
  padding:11px 16px;
  cursor:pointer;
}

.sx3-footer-col{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:13px;
}

.sx3-footer-col strong{
  color:#a882ff;
  margin-bottom:7px;
}

.sx3-footer-col a{
  color:#777180;
  text-decoration:none;
  font-size:13px;
}

.sx3-footer-col a:hover{
  color:#fff;
}

.sx3-footer-network{
  display:flex;
  gap:24px;
  align-items:center;
  margin-top:90px;
  padding:24px 0;
  border-top:1px solid rgba(255,255,255,.08);
  border-bottom:1px solid rgba(255,255,255,.08);
  font-size:12px;
}

.sx3-footer-network span{
  color:#65616c;
}

.sx3-footer-network a{
  color:#a981ff;
  text-decoration:none;
}

.sx3-footer-bottom{
  display:flex;
  justify-content:space-between;
  gap:25px;
  padding-top:25px;
  color:#5e5a66;
  font-size:11px;
}


/* ASK LAUNCHER */

.ask-ai__launcher{
  gap:11px;
  padding:8px 14px 8px 11px;
}

.ask-ai__launcher-logo{
  width:76px;
  height:auto;
  display:block;
}

.ask-ai__launcher-label{
  font-size:12px;
}


/* responsive */

@media(max-width:1000px){

  .sx2-hero--split .sx2-hero-grid{
    grid-template-columns:1fr;
  }

  .sx2-hero--split .sx2-ai-card{
    width:100%;
  }

  .sx2-stack-row{
    grid-template-columns:1fr;
    gap:9px;
  }

  .sx2-stack-header{
    display:none;
  }

  .sx2-research-grid{
    grid-template-columns:1fr 1fr;
  }

  .sx3-footer-top{
    grid-template-columns:1fr 1fr;
  }
}

@media(max-width:650px){

  .sx2-logo-brand{
    width:145px;
  }

  .sx2-logo-track__inner{
    gap:50px;
  }

  .sx2-research-grid{
    grid-template-columns:1fr;
  }

  .sx3-footer-top{
    grid-template-columns:1fr;
  }

  .sx3-footer-network{
    flex-wrap:wrap;
  }

  .sx3-footer-bottom{
    flex-direction:column;
  }
}

/* ======================================================
   P1.8 — HERO / RESEARCH / FOOTER ART DIRECTION
   ====================================================== */

/* HERO */

.sx2-hero--split{
    min-height:780px;
    padding:120px 0 110px;
    overflow:hidden;
}

.sx2-hero--split .sx2-hero-grid{
    grid-template-columns:minmax(0,.96fr) minmax(520px,1.04fr);
    gap:0;
    align-items:center;
}

.sx2-hero--split .sx2-hero-copy{
    position:relative;
    z-index:3;
    padding-right:50px;
}

.sx2-hero--split .sx2-hero h1{
    font-size:clamp(58px,5.25vw,88px);
    line-height:.94;
    letter-spacing:-.065em;
    max-width:720px;
}

.sx2-hero--split .sx2-ai-card{
    position:relative;
    z-index:2;
    width:calc(100% + 80px);
    margin-left:-80px;
    transform:translateX(75px);
    min-height:460px;

    background:
      radial-gradient(
        circle at 15% 10%,
        rgba(119,79,255,.19),
        transparent 42%
      ),
      linear-gradient(
        145deg,
        rgba(34,27,57,.96),
        rgba(24,14,36,.96)
      );

    border-color:rgba(185,130,255,.24);
    box-shadow:
      -55px 25px 110px rgba(69,40,151,.18),
      0 50px 110px rgba(0,0,0,.43);
}

/* subtle visual bridge between left + right */

.sx2-hero--split .sx2-ai-card:before{
    content:"";
    position:absolute;
    left:-145px;
    top:105px;
    width:190px;
    height:240px;
    background:
      linear-gradient(
        90deg,
        transparent,
        rgba(145,100,255,.07)
      );
    filter:blur(16px);
    pointer-events:none;
}


/* CHAT BRAND */

.ask-ai__brand{
    gap:10px;
}

.ask-ai__brand-logo{
    width:112px;
    height:auto;
    display:block;
}

.ask-ai__brand-ai{
    font:700 8px/1 Quantico,sans-serif;
    letter-spacing:.16em;
    color:#a98cff;
    border:1px solid rgba(161,126,255,.25);
    padding:5px 6px;
    border-radius:999px;
}


/* RESEARCH / CONTENT — BLUSH PREMIUM */

.sx2-research{
    background:
      radial-gradient(
        circle at 88% 10%,
        rgba(229,173,218,.45),
        transparent 31%
      ),
      linear-gradient(
        180deg,
        #f5edef 0%,
        #eee4e9 100%
      );

    color:#111018;
    padding:145px 0;
}

.sx2-research .sx2-heading>div>span{
    color:#8056d7;
}

.sx2-research .sx2-heading h2{
    color:#111018;
}

.sx2-research .sx2-heading>p{
    color:#665e69;
}

.sx2-research-grid{
    gap:18px;
}

.sx2-research-grid article{
    min-height:410px;
    background:
      rgba(255,255,255,.34);

    border:
      1px solid rgba(79,54,90,.12);

    box-shadow:
      0 30px 70px rgba(80,47,73,.06);

    color:#17121c;
}

.sx2-research-grid article h3{
    color:#17121c;
}

.sx2-research-grid article p{
    color:#68606b;
}

.sx2-research-grid article>a{
    color:#311c4a;
}

.sx2-research-grid article small{
    color:#7d55c9;
}

/* Visuals deliberately abstract — no third-party logos */

.sx2-card-visual{
    position:relative;
    overflow:hidden;
    border:0;
    height:190px;
    background:#201332 !important;
}

.sx2-card-visual:before{
    content:"";
    position:absolute;
    width:210px;
    height:210px;
    border-radius:50%;
    left:-45px;
    top:-70px;
    background:
      radial-gradient(
        circle,
        rgba(108,119,255,.95),
        rgba(126,62,231,.5) 43%,
        transparent 68%
      );
}

.sx2-card-visual:after{
    content:"";
    position:absolute;
    width:220px;
    height:220px;
    border-radius:50%;
    right:-70px;
    bottom:-110px;
    background:
      radial-gradient(
        circle,
        rgba(237,63,196,.88),
        rgba(159,51,213,.34) 43%,
        transparent 69%
      );
}

.sx2-card-visual strong,
.sx2-card-visual span{
    position:relative;
    z-index:2;
    color:#fff;
}


/* FEATURED CARDS — slightly smaller */

.sx2-featured{
    padding-top:105px;
    padding-bottom:105px;
}

.sx2-partner-card{
    min-height:285px;
    padding:28px 30px;
}

.sx2-partner-logo{
    height:52px;
    margin:20px 0 15px;
}

.sx2-partner-logo img{
    max-height:44px;
}

.sx2-partner-card h3{
    font-size:24px;
    margin:14px 0 10px;
}

.sx2-partner-card p{
    font-size:14px;
    line-height:1.55;
}


/* FOOTER TRUST */

.sx3-footer-trust{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:80px;
    margin-top:90px;
    padding:50px 0;
    border-top:1px solid rgba(255,255,255,.08);
}

.sx3-footer-trust>div{
    max-width:540px;
}

.sx3-footer-trust span{
    color:#a682ff;
    font:700 10px Quantico,sans-serif;
    letter-spacing:.17em;
}

.sx3-footer-trust h3{
    color:#fff;
    margin:10px 0 14px;
    font-size:26px;
    letter-spacing:-.035em;
}

.sx3-footer-trust p{
    color:#77727f;
    line-height:1.65;
    font-size:13px;
}

.sx3-footer-trust a{
    display:inline-block;
    margin-top:10px;
    color:#aa83ff;
    text-decoration:none;
    font-size:12px;
    font-weight:600;
}

.sx3-footer-disclaimer strong{
    color:#fff;
    font-size:15px;
}


/* REMOVE OLD METHOD/CLAIM SPACING IF CACHE OR MARKUP REMAINS */

.sx2-method,
.sx2-claim{
    display:none !important;
}


@media(max-width:1000px){

    .sx2-hero--split .sx2-hero-grid{
        grid-template-columns:1fr;
        gap:45px;
    }

    .sx2-hero--split .sx2-ai-card{
        width:100%;
        margin-left:0;
        transform:none;
    }

    .sx2-hero--split .sx2-ai-card:before{
        display:none;
    }

    .sx3-footer-trust{
        grid-template-columns:1fr;
        gap:35px;
    }
}

/* =========================================================
   P1.9 FINAL VISUAL CORRECTIONS
   ========================================================= */


/* ---------------------------------------------------------
   FEATURED — NO LOGOS, SMALLER / CLEANER
   --------------------------------------------------------- */

.sx2-partner-logo{
    display:none !important;
}

.sx2-partner-card{
    min-height:255px;
    padding:30px 32px;
    display:flex;
    flex-direction:column;
    justify-content:flex-start;
}

.sx2-sponsored-label{
    margin-bottom:42px;
    color:rgba(255,255,255,.55);
}

.sx2-partner-card h3{
    margin:0 0 18px;
    font-size:27px;
    letter-spacing:-.04em;
}

.sx2-partner-card p{
    margin:0 0 20px;
    max-width:360px;
    color:rgba(255,255,255,.72);
}

.sx2-partner-card a{
    margin-top:auto;
}


/* ---------------------------------------------------------
   CHAT HEADER
   --------------------------------------------------------- */

.ask-ai__brand{
    display:flex;
    align-items:center;
    gap:9px;
}

.ask-ai__brand-logo{
    width:105px;
    height:auto;
    display:block;
}

.ask-ai__brand-title{
    font-size:13px;
    line-height:1;
    color:#fff;
    font-weight:700;
    margin-left:2px;
}

.ask-ai__brand-ai{
    font:700 7px/1 Quantico,sans-serif;
    letter-spacing:.14em;
    color:#ad90ff;
    border:1px solid rgba(173,144,255,.28);
    padding:5px 6px;
    border-radius:999px;
}


/* ---------------------------------------------------------
   RESEARCH / BLOG — DARK HERO-LIKE GRADIENT
   --------------------------------------------------------- */

.sx2-research{
    position:relative;
    overflow:hidden;

    background:
      radial-gradient(
        circle at 82% 10%,
        rgba(204,64,210,.20),
        transparent 34%
      ),
      radial-gradient(
        circle at 18% 80%,
        rgba(98,69,255,.18),
        transparent 35%
      ),
      linear-gradient(
        135deg,
        #08080d 0%,
        #100c1b 48%,
        #160b20 100%
      ) !important;

    color:#fff !important;
}

.sx2-research:before{
    content:"";
    position:absolute;
    width:700px;
    height:700px;
    right:-280px;
    top:-320px;
    border-radius:50%;
    background:
      radial-gradient(
        circle,
        rgba(146,80,255,.18),
        transparent 66%
      );
    pointer-events:none;
}

.sx2-research .sx-shell{
    position:relative;
    z-index:2;
}

.sx2-research .sx2-heading h2{
    color:#fff !important;
}

.sx2-research .sx2-heading>p{
    color:#9995a6 !important;
}

.sx2-research .sx2-heading>div>span{
    color:#aa8cff !important;
}


/* cards closer to SearchAtlas / hero language */

.sx2-research-grid article{
    min-height:390px;

    background:
      linear-gradient(
        155deg,
        rgba(41,27,67,.88),
        rgba(18,13,28,.94)
      ) !important;

    border:
      1px solid rgba(177,132,255,.18) !important;

    box-shadow:
      0 32px 80px rgba(0,0,0,.22);

    color:#fff !important;
}

.sx2-research-grid article h3{
    color:#fff !important;
}

.sx2-research-grid article p{
    color:#aaa5b4 !important;
}

.sx2-research-grid article small{
    color:#aa8cff !important;
}

.sx2-research-grid article>a{
    color:#fff !important;
}


/* richer brand visuals */

.sx2-card-visual{
    background:
      radial-gradient(
        circle at 20% 10%,
        rgba(83,154,255,.78),
        transparent 36%
      ),
      radial-gradient(
        circle at 80% 85%,
        rgba(238,67,198,.72),
        transparent 38%
      ),
      linear-gradient(
        145deg,
        #27105b,
        #11101c
      ) !important;

    border:
      1px solid rgba(255,255,255,.10) !important;

    box-shadow:
      inset 0 0 70px rgba(134,73,255,.08);
}


/* kill obsolete stack CSS visually as insurance */

.sx2-stack{
    display:none !important;
}


/* ---------------------------------------------------------
   MOBILE
   --------------------------------------------------------- */

@media(max-width:650px){

    .ask-ai__brand-logo{
        width:92px;
    }

    .sx2-sponsored-label{
        margin-bottom:28px;
    }

    .sx2-partner-card{
        min-height:230px;
    }
}

/* =========================================================
   P1.10 — SEOEXPERTS PREMIUM MOTION SYSTEM
   ========================================================= */

html{
  scroll-behavior:smooth;
}

/* ---------------------------------------------------------
   SCROLL PROGRESS
   --------------------------------------------------------- */

.sx-scroll-progress{
  position:fixed;
  top:0;
  left:0;
  width:0;
  height:2px;
  z-index:99999;
  pointer-events:none;
  background:linear-gradient(
    90deg,
    #675cff,
    #a65cff,
    #ed49c6
  );
  box-shadow:0 0 18px rgba(177,85,255,.65);
}


/* ---------------------------------------------------------
   GLOBAL REVEAL SYSTEM
   --------------------------------------------------------- */

.sx-motion{
  opacity:0;
  transform:
    translate3d(0,42px,0)
    scale(.985);
  filter:blur(5px);

  transition:
    opacity .85s cubic-bezier(.2,.75,.2,1),
    transform .95s cubic-bezier(.2,.75,.2,1),
    filter .8s ease;

  will-change:transform,opacity;
}

.sx-motion.sx-in{
  opacity:1;
  transform:none;
  filter:blur(0);
}

.sx-motion--left{
  transform:translate3d(-65px,0,0);
}

.sx-motion--right{
  transform:translate3d(65px,0,0);
}

.sx-motion--scale{
  transform:scale(.93);
}

.sx-motion--left.sx-in,
.sx-motion--right.sx-in,
.sx-motion--scale.sx-in{
  transform:none;
}


/* ---------------------------------------------------------
   HERO STAGED ENTRANCE
   --------------------------------------------------------- */

.sx2-hero-copy .sx2-eyebrow,
.sx2-hero-copy h1,
.sx2-hero-copy>p,
.sx2-hero-copy .sx2-actions,
.sx2-hero-copy .sx2-period{
  opacity:0;
  transform:translateY(30px);
  animation:sxHeroIn .85s cubic-bezier(.2,.75,.2,1) forwards;
}

.sx2-hero-copy .sx2-eyebrow{animation-delay:.08s}
.sx2-hero-copy h1{animation-delay:.18s}
.sx2-hero-copy>p{animation-delay:.30s}
.sx2-hero-copy .sx2-actions{animation-delay:.42s}
.sx2-hero-copy .sx2-period{animation-delay:.52s}

@keyframes sxHeroIn{
  to{
    opacity:1;
    transform:none;
  }
}

.sx2-ai-card{
  opacity:0;
  transform:
    translate3d(75px,28px,0)
    scale(.94)
    rotateY(-4deg);

  animation:
    sxAiEnter 1.15s .30s cubic-bezier(.16,.84,.24,1)
    forwards;
}

@keyframes sxAiEnter{
  to{
    opacity:1;
    transform:none;
  }
}


/* ---------------------------------------------------------
   HERO AURORA / MOVEMENT
   --------------------------------------------------------- */

.sx2-hero--split:after{
  content:"";
  position:absolute;
  width:620px;
  height:620px;
  border-radius:50%;
  right:3%;
  top:18%;

  background:
    radial-gradient(
      circle,
      rgba(174,74,255,.16),
      rgba(223,60,201,.06) 40%,
      transparent 69%
    );

  filter:blur(12px);
  pointer-events:none;

  animation:sxAurora 9s ease-in-out infinite alternate;
}

@keyframes sxAurora{
  0%{
    transform:translate3d(-25px,-18px,0) scale(.92);
    opacity:.65;
  }
  50%{
    transform:translate3d(24px,14px,0) scale(1.06);
    opacity:1;
  }
  100%{
    transform:translate3d(-5px,38px,0) scale(.96);
    opacity:.72;
  }
}


/* ---------------------------------------------------------
   AI PANEL — LIVE DEPTH
   --------------------------------------------------------- */

.sx2-ai-card{
  transition:
    transform .35s ease,
    border-color .35s ease,
    box-shadow .35s ease;
}

.sx2-ai-card:hover{
  transform:translateY(-5px);
  border-color:rgba(184,133,255,.38);
  box-shadow:
    -50px 35px 120px rgba(79,44,173,.19),
    0 50px 120px rgba(0,0,0,.48);
}

.sx2-ai-head>span{
  position:relative;
}

.sx2-ai-head>span:before{
  content:"";
  width:6px;
  height:6px;
  border-radius:50%;
  display:inline-block;
  margin-right:5px;
  background:#5fe7b8;
  box-shadow:0 0 0 rgba(95,231,184,.45);
  animation:sxPulse 1.9s infinite;
}

@keyframes sxPulse{
  0%{box-shadow:0 0 0 0 rgba(95,231,184,.38)}
  70%{box-shadow:0 0 0 8px rgba(95,231,184,0)}
  100%{box-shadow:0 0 0 0 rgba(95,231,184,0)}
}


/* ---------------------------------------------------------
   BUTTON MICRO MOTION
   --------------------------------------------------------- */

.sx2-primary,
.sx2-secondary,
.sx-btn,
.sx-ai-nav--brand{
  position:relative;
  overflow:hidden;
  transition:
    transform .22s ease,
    border-color .22s ease,
    box-shadow .22s ease;
}

.sx2-primary:before{
  content:"";
  position:absolute;
  top:-100%;
  left:-30%;
  width:35%;
  height:300%;

  background:
    linear-gradient(
      90deg,
      transparent,
      rgba(255,255,255,.30),
      transparent
    );

  transform:rotate(18deg);
  transition:left .55s ease;
}

.sx2-primary:hover:before{
  left:120%;
}

.sx2-primary:hover,
.sx2-secondary:hover{
  transform:translateY(-3px);
}


/* ---------------------------------------------------------
   FEATURED CARDS
   --------------------------------------------------------- */

.sx2-partner-card{
  position:relative;
  overflow:hidden;

  transition:
    transform .4s cubic-bezier(.2,.75,.2,1),
    box-shadow .4s ease,
    border-color .4s ease;
}

.sx2-partner-card:before{
  content:"";
  position:absolute;
  inset:-40%;
  opacity:0;

  background:
    radial-gradient(
      circle,
      rgba(255,255,255,.18),
      transparent 42%
    );

  transform:translate(-30%,-30%);
  transition:
    opacity .4s ease,
    transform .7s ease;
  pointer-events:none;
}

.sx2-partner-card:hover{
  transform:translateY(-10px) scale(1.012);
  box-shadow:0 36px 80px rgba(0,0,0,.25);
}

.sx2-partner-card:hover:before{
  opacity:1;
  transform:translate(25%,20%);
}


/* gradient gently moves */

.sx2-partner-card:nth-child(1),
.sx2-partner-card:nth-child(2),
.sx2-partner-card:nth-child(3){
  background-size:180% 180%;
  animation:sxGradientMove 10s ease infinite alternate;
}

.sx2-partner-card:nth-child(2){
  animation-delay:-3s;
}

.sx2-partner-card:nth-child(3){
  animation-delay:-6s;
}

@keyframes sxGradientMove{
  0%{background-position:0% 10%}
  100%{background-position:100% 90%}
}


/* ---------------------------------------------------------
   RANKING ROWS
   --------------------------------------------------------- */

.sx2-rank-row{
  transition:
    transform .24s ease,
    background .24s ease,
    border-color .24s ease;
}

.sx2-rank-row:hover{
  transform:translateX(9px);
  background:
    linear-gradient(
      90deg,
      rgba(122,81,255,.06),
      transparent 75%
    );
}

.sx2-rank-row:hover .sx2-rank-number{
  color:#b28cff;
  transform:scale(1.1);
}

.sx2-rank-number{
  transition:
    color .25s ease,
    transform .25s ease;
}


/* ---------------------------------------------------------
   RESEARCH CARDS — DEPTH / TILT READY
   --------------------------------------------------------- */

.sx2-research-grid article{
  transform-style:preserve-3d;

  transition:
    transform .30s ease,
    border-color .3s ease,
    box-shadow .3s ease;
}

.sx2-research-grid article:hover{
  border-color:rgba(185,137,255,.36) !important;
  box-shadow:
    0 42px 95px rgba(0,0,0,.30),
    0 0 60px rgba(112,64,255,.08);
}

.sx2-card-visual{
  transition:transform .45s cubic-bezier(.2,.75,.2,1);
}

.sx2-research-grid article:hover .sx2-card-visual{
  transform:translateY(-7px) scale(1.025);
}


/* animated visual orbs */

.sx2-card-visual:before{
  animation:sxVisualOrbA 8s ease-in-out infinite alternate;
}

.sx2-card-visual:after{
  animation:sxVisualOrbB 10s ease-in-out infinite alternate;
}

@keyframes sxVisualOrbA{
  from{transform:translate(-12px,-7px) scale(.94)}
  to{transform:translate(30px,15px) scale(1.08)}
}

@keyframes sxVisualOrbB{
  from{transform:translate(12px,10px) scale(1)}
  to{transform:translate(-28px,-14px) scale(.90)}
}


/* ---------------------------------------------------------
   FAQ
   --------------------------------------------------------- */

.sx2-faq-list details{
  transition:
    background .25s ease,
    padding .25s ease;
}

.sx2-faq-list details:hover{
  background:
    linear-gradient(
      90deg,
      rgba(117,76,255,.045),
      transparent 65%
    );
}

.sx2-faq-list summary{
  transition:
    color .22s ease,
    padding-left .22s ease;
}

.sx2-faq-list details:hover summary{
  padding-left:14px;
  color:#b69cff;
}


/* ---------------------------------------------------------
   NAV AFTER SCROLL
   --------------------------------------------------------- */

.sx-header{
  transition:
    background .32s ease,
    border-color .32s ease,
    backdrop-filter .32s ease;
}

.sx-header.sx-header--scrolled{
  background:rgba(8,8,13,.78);
  backdrop-filter:blur(20px);
  border-bottom:1px solid rgba(255,255,255,.07);
}


/* ---------------------------------------------------------
   FOOTER LINKS
   --------------------------------------------------------- */

.sx3-footer-col a,
.sx3-footer-network a{
  position:relative;
  transition:
    color .2s ease,
    transform .2s ease;
}

.sx3-footer-col a:hover{
  transform:translateX(4px);
}

.sx3-footer-network a:hover{
  color:#fff;
}


/* ---------------------------------------------------------
   REDUCED MOTION ACCESSIBILITY
   --------------------------------------------------------- */

@media(prefers-reduced-motion:reduce){

  html{
    scroll-behavior:auto;
  }

  *,
  *:before,
  *:after{
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
  }

  .sx-motion{
    opacity:1 !important;
    transform:none !important;
    filter:none !important;
  }
}

/* Hero moving bridge */

.sx2-hero--split .sx2-ai-card{
  translate:
    var(--sx-mouse-x,0)
    var(--sx-mouse-y,0);
}

.sx2-hero--split .sx2-hero-copy{
  transition:transform .2s linear;
}

/* visual separator that breathes */

.sx2-hero--split .sx2-ai-card:after{
  background:
    linear-gradient(
      115deg,
      rgba(112,85,255,.36),
      transparent 31%,
      rgba(232,68,196,.23)
    );

  animation:sxBorderGlow 6s ease-in-out infinite alternate;
}

@keyframes sxBorderGlow{
  from{opacity:.38}
  to{opacity:.82}
}

/* =========================================================
   P1.11 — HERO SCALE + ATLAS-STYLE SPLIT MOTION
   ========================================================= */

.sx2-hero--split .sx2-hero-grid{
  grid-template-columns:minmax(0,.88fr) minmax(560px,1.12fr);
  gap:28px;
}

.sx2-hero--split .sx2-hero-copy{
  max-width:650px;
  padding-right:18px;
}

.sx2-hero--split .sx2-hero h1{
  max-width:640px;
  font-size:clamp(54px,4.8vw,80px);
  line-height:.93;
  letter-spacing:-.06em;
}

.sx2-hero--split .sx2-hero-copy>p{
  max-width:560px;
  font-size:17px;
  line-height:1.65;
}

.sx2-hero--split .sx2-ai-card{
  width:calc(100% + 34px);
  margin-left:-34px;
}


/* Atlas-style entrance */

.sx2-hero-copy{
  opacity:0;
  transform:
    translate3d(-70px,40px,0)
    scale(.97);

  animation:
    sxHeroLeftAtlas 1.05s
    cubic-bezier(.16,.84,.24,1)
    forwards;
}

.sx2-ai-card{
  opacity:0;
  transform:
    translate3d(90px,55px,0)
    scale(.94);

  animation:
    sxHeroRightAtlas 1.15s .12s
    cubic-bezier(.16,.84,.24,1)
    forwards;
}

@keyframes sxHeroLeftAtlas{
  0%{
    opacity:0;
    transform:
      translate3d(-70px,40px,0)
      scale(.97);
  }

  70%{
    opacity:1;
    transform:
      translate3d(8px,-3px,0)
      scale(1.005);
  }

  100%{
    opacity:1;
    transform:none;
  }
}

@keyframes sxHeroRightAtlas{
  0%{
    opacity:0;
    transform:
      translate3d(90px,55px,0)
      scale(.94);
  }

  72%{
    opacity:1;
    transform:
      translate3d(-8px,-4px,0)
      scale(1.008);
  }

  100%{
    opacity:1;
    transform:none;
  }
}


/* subtle crossing glow between the two halves */

.sx2-hero--split .sx2-hero-grid:before{
  content:"";
  position:absolute;

  left:47%;
  top:21%;

  width:260px;
  height:390px;

  background:
    radial-gradient(
      ellipse at center,
      rgba(139,91,255,.15),
      rgba(221,64,203,.06) 45%,
      transparent 72%
    );

  filter:blur(22px);

  animation:
    sxHeroBridge 5.5s ease-in-out
    infinite alternate;

  pointer-events:none;
  z-index:1;
}

@keyframes sxHeroBridge{
  from{
    transform:
      translate3d(-18px,-10px,0)
      scale(.92);
    opacity:.50;
  }

  to{
    transform:
      translate3d(18px,14px,0)
      scale(1.08);
    opacity:.92;
  }
}


/* mouse depth remains subtle, not jumpy */

.sx2-hero--split .sx2-ai-card{
  transition:
    translate .18s linear,
    box-shadow .35s ease,
    border-color .35s ease;
}


@media(max-width:1000px){

  .sx2-hero--split .sx2-hero-grid{
    grid-template-columns:1fr;
    gap:45px;
  }

  .sx2-hero--split .sx2-hero-copy{
    max-width:none;
  }

  .sx2-hero--split .sx2-hero h1{
    max-width:760px;
    font-size:clamp(52px,10vw,76px);
  }

  .sx2-hero--split .sx2-ai-card{
    width:100%;
    margin-left:0;
  }

  .sx2-hero--split .sx2-hero-grid:before{
    display:none;
  }
}

/* Disable older nested hero entrance animation.
   Parent-level Atlas entrance now controls the hero. */

.sx2-hero-copy .sx2-eyebrow,
.sx2-hero-copy h1,
.sx2-hero-copy>p,
.sx2-hero-copy .sx2-actions,
.sx2-hero-copy .sx2-period{
  opacity:1 !important;
  transform:none !important;
  animation:none !important;
}

/* =========================================================
   P1.12 — TRUE SCROLL-DRIVEN HERO
   ========================================================= */

/* smaller left headline */
.sx2-hero--split .sx2-hero h1{
    max-width:560px !important;
    font-size:clamp(48px,4.15vw,70px) !important;
    line-height:.94 !important;
    letter-spacing:-.058em !important;
}

.sx2-hero--split .sx2-hero-copy{
    max-width:590px !important;
    padding-right:35px !important;
}

.sx2-hero--split .sx2-hero-copy>p{
    max-width:510px;
    font-size:16px;
}


/* kill previous load-based hero motion */
.sx2-hero-copy,
.sx2-ai-card{
    animation:none !important;
    opacity:1 !important;
}


/* real Atlas-style scroll composition */

.sx2-hero--split{
    --hero-progress:0;
    --hero-left-x:-42px;
    --hero-right-x:70px;
    --hero-left-y:28px;
    --hero-right-y:46px;
    --hero-left-scale:.965;
    --hero-right-scale:.93;

    min-height:860px;
}

.sx2-hero--split .sx2-hero-copy{
    transform:
        translate3d(
            var(--hero-left-x),
            var(--hero-left-y),
            0
        )
        scale(var(--hero-left-scale));

    will-change:transform;
}

.sx2-hero--split .sx2-ai-card{
    transform:
        translate3d(
            var(--hero-right-x),
            var(--hero-right-y),
            0
        )
        scale(var(--hero-right-scale));

    will-change:transform;

    width:calc(100% + 45px);
    margin-left:-45px;
}


/* overlap glow lives in the meeting point */

.sx2-hero--split .sx2-hero-grid:after{
    content:"";
    position:absolute;

    left:43%;
    top:21%;

    width:330px;
    height:420px;

    background:
      radial-gradient(
        ellipse,
        rgba(133,86,255,.18),
        rgba(227,68,202,.07) 43%,
        transparent 70%
      );

    filter:blur(26px);
    opacity:calc(.35 + (var(--hero-progress) * .5));

    transform:
        scale(calc(.85 + (var(--hero-progress) * .25)));

    pointer-events:none;
    z-index:1;
}


/* AI panel gains depth while approaching */

.sx2-hero--split .sx2-ai-card{
    box-shadow:
      calc(-25px * var(--hero-progress))
      calc(25px + 20px * var(--hero-progress))
      calc(70px + 55px * var(--hero-progress))
      rgba(55,30,125,.18),
      0 35px 90px rgba(0,0,0,.42);
}


/* subtle content parallax inside right card */

.sx2-ai-head,
.sx2-ai-intro,
.sx2-ai-prompts,
.sx2-ai-form{
    transform:
        translateY(
            calc((1 - var(--hero-progress)) * 12px)
        );
}


/* mobile = no cinematic collision */

@media(max-width:1000px){

    .sx2-hero--split{
        min-height:auto;
    }

    .sx2-hero--split .sx2-hero h1{
        max-width:680px !important;
        font-size:clamp(46px,9vw,68px) !important;
    }

    .sx2-hero--split .sx2-hero-copy,
    .sx2-hero--split .sx2-ai-card{
        transform:none !important;
    }

    .sx2-hero--split .sx2-ai-card{
        width:100%;
        margin-left:0;
    }
}

/* =========================================================
   P1.13 — HERO TYPOGRAPHY + CLEAN RANKING COPY
   ========================================================= */

.sx2-hero--split{
    overflow:visible !important;
}

.sx2-hero--split .sx-shell{
    overflow:visible !important;
}

.sx2-hero--split .sx2-hero-grid{
    overflow:visible !important;
    grid-template-columns:minmax(0,.84fr) minmax(560px,1.16fr);
    column-gap:46px;
}

.sx2-hero--split .sx2-hero-copy{
    max-width:540px !important;
    padding-left:4px;
    padding-right:26px !important;
    overflow:visible !important;
}

.sx2-hero--split .sx2-hero h1{
    max-width:525px !important;
    font-size:clamp(40px,3.4vw,57px) !important;
    line-height:.96 !important;
    letter-spacing:-.052em !important;

    /* prevents glyph edges/dots being clipped */
    padding-left:.035em;
    padding-right:.09em;
    padding-bottom:.10em;

    overflow:visible !important;
}


/* ranking is now a cleaner client decision surface */

#agencies .sx2-heading>p{
    max-width:470px;
    color:#9996a4;
}

.sx2-rank-name small{
    color:#9b92ad;
    font-size:12px;
    transition:color .2s ease;
}

.sx2-rank-row:hover .sx2-rank-name small{
    color:#bd9cff;
}


/* slightly softer heading scale */

#agencies .sx2-heading h2{
    max-width:720px;
    font-size:clamp(45px,4.7vw,70px);
}

@media(max-width:1000px){

    .sx2-hero--split .sx2-hero-grid{
        grid-template-columns:1fr;
    }

    .sx2-hero--split .sx2-hero-copy{
        max-width:680px !important;
    }

    .sx2-hero--split .sx2-hero h1{
        max-width:650px !important;
        font-size:clamp(42px,8vw,62px) !important;
    }
}

.sx2-ai-result{
    white-space:normal;
    line-height:1.65;
}

.sx2-ai-result p{
    margin:0 0 10px;
}

.sx2-ai-result ol{
    margin:10px 0 12px;
    padding-left:22px;
}

.sx2-ai-result li{
    margin:5px 0;
}

.sx2-ai-result strong{
    color:#fff;
    font-weight:650;
}

/* P1.14 — AI ANSWER FORMATTING */

.sx2-ai-result{
    padding:18px 20px;
    line-height:1.58;
    font-size:13px;
}

.sx2-ai-result p{
    margin:0 0 12px;
}

.sx2-ai-result p:last-child{
    margin-bottom:0;
}

.sx2-ai-result ol{
    margin:12px 0 14px;
    padding:0;
    list-style:none;
    counter-reset:sx-ai-rank;
}

.sx2-ai-result ol li{
    counter-increment:sx-ai-rank;
    display:grid;
    grid-template-columns:24px 1fr;
    gap:8px;
    padding:7px 0;
    border-bottom:1px solid rgba(255,255,255,.07);
}

.sx2-ai-result ol li:before{
    content:counter(sx-ai-rank,decimal-leading-zero);
    color:#aa8cff;
    font:700 10px Quantico,sans-serif;
    padding-top:3px;
}

.sx2-ai-result ol li:last-child{
    border-bottom:0;
}

/* =========================================================
   P2.0 — FEATURED LISTING COMPONENT
   ========================================================= */

.sx-featured-listing{
    padding:70px 0 42px;
    background:#09090d;
}

.sx-featured-listing__head{
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-bottom:14px;
    padding:0 6px;
}

.sx-featured-listing__head span{
    color:#d8d4df;
    font-size:16px;
    font-weight:650;
}

.sx-featured-listing__head a{
    color:#8d84a0;
    text-decoration:none;
    font-size:11px;
}

.sx-featured-listing__box{
    overflow:hidden;

    border:
      1px solid rgba(170,128,255,.12);

    border-radius:20px;

    background:
      linear-gradient(
        145deg,
        rgba(113,74,176,.075),
        rgba(255,255,255,.012)
      );
}

.sx-featured-row{
    min-height:150px;

    display:grid;
    grid-template-columns:1fr auto;
    gap:45px;
    align-items:center;

    padding:25px 28px;

    border-bottom:
      1px solid rgba(255,255,255,.065);

    position:relative;

    transition:
      background .25s ease,
      transform .25s ease;
}

.sx-featured-row:last-child{
    border-bottom:0;
}

.sx-featured-row:hover{
    background:
      linear-gradient(
        90deg,
        rgba(132,83,255,.055),
        rgba(232,68,196,.025),
        transparent
      );
}

.sx-featured-row__main{
    max-width:760px;
}

.sx-featured-row__flag{
    display:inline-block;

    margin-bottom:8px;

    color:#a78aff;

    font:700 8px/1 Quantico,sans-serif;
    letter-spacing:.16em;
    text-transform:uppercase;
}

.sx-featured-row h3{
    margin:0 0 9px;

    color:#fff;

    font-size:23px;
    letter-spacing:-.035em;
}

.sx-featured-row p{
    margin:0;

    max-width:690px;

    color:#9995a4;

    font-size:13px;
    line-height:1.55;
}

.sx-featured-row__tags{
    display:flex;
    flex-wrap:wrap;
    gap:7px;

    margin-top:13px;
}

.sx-featured-row__tags span{
    padding:5px 8px;

    border:
      1px solid rgba(255,255,255,.075);

    border-radius:999px;

    color:#8e8998;

    font-size:9px;
}

.sx-featured-row__actions{
    display:flex;
    gap:9px;
    align-items:center;
}

.sx-featured-btn{
    min-width:120px;
    height:42px;

    display:inline-flex;
    align-items:center;
    justify-content:center;

    padding:0 15px;

    border-radius:9px;

    text-decoration:none;

    font-size:11px;
    font-weight:650;

    transition:
      transform .2s ease,
      border-color .2s ease,
      background .2s ease;
}

.sx-featured-btn:hover{
    transform:translateY(-2px);
}

.sx-featured-btn--soft{
    color:#fff;

    border:
      1px solid rgba(255,255,255,.13);

    background:
      rgba(255,255,255,.018);
}

.sx-featured-btn--primary{
    color:#fff;

    border:
      1px solid rgba(164,112,255,.20);

    background:
      linear-gradient(
        105deg,
        rgba(116,72,255,.78),
        rgba(202,65,211,.78)
      );
}

.sx-featured-listing__note{
    padding:10px 6px 0;

    color:#5f5b68;

    font-size:9px;
    text-align:right;
}


/* transition directly into organic ranking */

.sx-featured-listing + #agencies,
.sx-featured-listing + .sx2-section{
    padding-top:72px;
}


/* old featured cards no longer used */

.sx2-featured{
    display:none !important;
}


@media(max-width:760px){

    .sx-featured-row{
        grid-template-columns:1fr;
        gap:18px;
    }

    .sx-featured-row__actions{
        justify-content:flex-start;
    }

    .sx-featured-btn{
        flex:1;
    }
}

/* P2.0.1 — ranking intro above Featured */

.sx2-ranking-intro{
    padding:110px 0 26px;
    background:#09090d;
}

.sx2-ranking-intro .sx2-heading{
    margin-bottom:0;
}

.sx2-ranking-intro + .sx-featured-listing{
    padding-top:22px;
}

.sx-featured-listing + #agencies{
    padding-top:54px;
}

#agencies .sx2-heading{
    display:none;
}

/* =========================================================
   P2.0.2 — FEATURED + ORGANIC = ONE CONTINUOUS LIST
   ========================================================= */

.sx-featured-listing{
    padding-bottom:0;
}

.sx-featured-listing__box{
    border-radius:20px 20px 0 0;
    border-bottom:0;
}

.sx-featured-listing__note{
    display:none;
}

.sx-featured-listing + #agencies{
    padding-top:0 !important;
}

#agencies{
    background:#09090d;
}

#agencies .sx-shell{
    padding-top:0;
}

/* organic ranking visually continues featured */

#agencies .sx2-ranking{
    border:
      1px solid rgba(170,128,255,.12);

    border-top:
      1px solid rgba(255,255,255,.07);

    border-radius:0 0 20px 20px;

    overflow:hidden;

    background:
      linear-gradient(
        145deg,
        rgba(113,74,176,.045),
        rgba(255,255,255,.008)
      );
}

#agencies .sx2-rank-row{
    padding-left:28px;
    padding-right:28px;
}

/* ranking footer intro comes AFTER #10 */

.sx-ranking-list-footer{
    display:grid;
    grid-template-columns:1.15fr .85fr;
    gap:65px;

    padding:65px 28px 30px;
}

.sx-ranking-list-footer span{
    color:#a88cff;
    font:700 10px Quantico,sans-serif;
    letter-spacing:.17em;
}

.sx-ranking-list-footer h2{
    margin:10px 0 0;

    max-width:620px;

    color:#fff;

    font-size:clamp(40px,4vw,64px);
    line-height:.98;
    letter-spacing:-.055em;
}

.sx-ranking-list-footer p{
    align-self:end;

    max-width:470px;

    margin:0;

    color:#9692a1;

    font-size:14px;
    line-height:1.65;
}

/* Top100 CTA feels like end of same module */

#agencies .sx2-center{
    margin-top:0;
    padding:0 28px 48px;
    text-align:left;
}

@media(max-width:800px){

    .sx-ranking-list-footer{
        grid-template-columns:1fr;
        gap:22px;
    }
}

/* =========================================================
   P2.0.3 — FEATURED + ORGANIC SAME WIDTH / SAME CONTAINER
   ========================================================= */

.sx-featured-listing .sx-shell,
#agencies .sx-shell{
    max-width:1240px !important;
    margin-left:auto !important;
    margin-right:auto !important;
    padding-left:24px !important;
    padding-right:24px !important;
}

/* exact same outer width */
.sx-featured-listing__box,
#agencies .sx2-ranking{
    width:100%;
    box-sizing:border-box;
}

/* organic ranking should not span viewport */
#agencies{
    width:100%;
    overflow:hidden;
}

#agencies .sx2-ranking{
    margin-left:0 !important;
    margin-right:0 !important;
}

/* keep organic rows aligned with featured text */
#agencies .sx2-rank-row{
    padding-left:28px !important;
    padding-right:28px !important;
}

/* intro line between featured and organic stays inside same width */
#agencies .sx-ranking-list-footer{
    padding-left:28px;
    padding-right:28px;
}

/* CTA also follows same inner grid */
#agencies .sx2-center{
    padding-left:28px;
    padding-right:28px;
}

/* tighten vertical connection between both parts */
.sx-featured-listing{
    padding-bottom:0 !important;
}

.sx-featured-listing + #agencies{
    padding-top:0 !important;
}

/* subtle continuation */
.sx-featured-listing__box{
    border-radius:20px 20px 0 0 !important;
}

#agencies .sx2-ranking{
    border-radius:0 0 20px 20px !important;
}


/* desktop: slightly narrower premium column */
@media(min-width:1400px){

    .sx-featured-listing .sx-shell,
    #agencies .sx-shell{
        max-width:1180px !important;
    }
}

@media(max-width:700px){

    .sx-featured-listing .sx-shell,
    #agencies .sx-shell{
        padding-left:14px !important;
        padding-right:14px !important;
    }

    #agencies .sx2-rank-row{
        padding-left:18px !important;
        padding-right:18px !important;
    }
}

/* P2.0.4 — heading directly above complete agency list */

.sx-ranking-list-head{
    padding:72px 0 18px;
    background:#09090d;
}

.sx-ranking-list-head .sx-shell{
    max-width:1180px !important;
    margin:0 auto;
    padding-left:24px !important;
    padding-right:24px !important;
}

.sx-ranking-list-head .sx2-heading{
    margin-bottom:0;
}

.sx-ranking-list-head + .sx-featured-listing{
    padding-top:10px !important;
}

/* old footer heading definitely gone visually */
.sx-ranking-list-footer{
    display:none !important;
}

/* CTA stays after organic #10 */
#agencies .sx2-center{
    padding-top:34px;
    padding-bottom:60px;
}

/* =========================================================
   P2.0.5 — TRUE UNIFIED AGENCY LIST
   ========================================================= */

.sx-agency-list{
    padding:76px 0 95px;
    background:#09090d;
}

.sx-agency-list>.sx-shell{
    width:100%;
    max-width:1180px !important;
    margin:0 auto !important;
    padding:0 24px !important;
    box-sizing:border-box;
}

.sx-agency-list__heading{
    margin-bottom:24px !important;
}


/* Only disclaimer link above Featured */

.sx-featured-listing__head{
    min-height:25px;
    margin:0 0 8px;
    padding:0 3px;

    display:flex;
    justify-content:flex-end;
    align-items:center;
}

.sx-featured-listing__head a{
    font-size:10px;
    color:#777181;
    text-decoration:none;
}

.sx-featured-listing__head a:hover{
    color:#b598ff;
}


/* Both are literally same width now */

.sx-featured-listing__box,
.sx-agency-list .sx2-ranking{
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    box-sizing:border-box !important;

    border-left:1px solid rgba(170,128,255,.12);
    border-right:1px solid rgba(170,128,255,.12);
}


/* top half */

.sx-featured-listing__box{
    border-top:1px solid rgba(170,128,255,.12);
    border-bottom:0;

    border-radius:18px 18px 0 0 !important;
}


/* organic half */

.sx-agency-list .sx2-ranking{
    border-top:1px solid rgba(255,255,255,.07) !important;
    border-bottom:1px solid rgba(170,128,255,.12);

    border-radius:0 0 18px 18px !important;

    background:
      linear-gradient(
        145deg,
        rgba(113,74,176,.035),
        rgba(255,255,255,.006)
      );
}


/* exact same internal horizontal rhythm */

.sx-featured-row,
.sx-agency-list .sx2-rank-row{
    padding-left:28px !important;
    padding-right:28px !important;
}


/* no artificial gap */

.sx-featured-listing__box + .sx2-ranking{
    margin-top:0 !important;
}


/* organic row dimensions */

.sx-agency-list .sx2-rank-row{
    min-height:106px;
}


/* CTA after complete list */

.sx-agency-list .sx2-center{
    margin:0;
    padding:34px 0 0;
    text-align:left;
}


/* neutralize all old layout rules */

.sx-featured-listing{
    padding:0 !important;
    margin:0 !important;
    background:none !important;
}

.sx-ranking-list-head,
.sx-ranking-list-footer,
.sx-featured-listing__note{
    display:none !important;
}


/* mobile */

@media(max-width:700px){

    .sx-agency-list>.sx-shell{
        padding-left:14px !important;
        padding-right:14px !important;
    }

    .sx-featured-row,
    .sx-agency-list .sx2-rank-row{
        padding-left:18px !important;
        padding-right:18px !important;
    }
}

/* P2.0.6 — COMPLETE AGENCY MODULE */

.sx-agency-list__frame{
    width:100%;
    overflow:hidden;

    border:1px solid rgba(170,128,255,.12);
    border-radius:20px;

    background:
      linear-gradient(
        145deg,
        rgba(113,74,176,.045),
        rgba(255,255,255,.006)
      );
}

/* heading is now the top of the same box */
.sx-agency-list__heading{
    padding:46px 28px 38px;
    margin:0 !important;

    border-bottom:1px solid rgba(255,255,255,.07);
}

/* disclaimer sits directly below heading */
.sx-featured-listing__head{
    padding:13px 28px 8px;
    margin:0;
}

/* remove duplicate outer borders */
.sx-featured-listing__box,
.sx-agency-list .sx2-ranking{
    border-left:0 !important;
    border-right:0 !important;
    border-radius:0 !important;
}

.sx-featured-listing__box{
    border-top:0 !important;
}

.sx-agency-list .sx2-ranking{
    border-bottom:0 !important;
}

/* Top100 CTA is the bottom of the same module */
.sx-agency-list .sx2-center{
    padding:32px 28px 42px;
    border-top:1px solid rgba(255,255,255,.07);
}

/* slightly tighter entire section */
.sx-agency-list{
    padding-top:52px;
}

@media(max-width:700px){
    .sx-agency-list__heading{
        padding:32px 18px 28px;
    }

    .sx-featured-listing__head{
        padding-left:18px;
        padding-right:18px;
    }

    .sx-agency-list .sx2-center{
        padding-left:18px;
        padding-right:18px;
    }
}

/* =========================================================
   P2.0.7 — RESTORE UNIFIED LIST HEADING
   ========================================================= */

#agencies .sx2-heading.sx-agency-list__heading{
    display:grid !important;
    grid-template-columns:1.15fr .85fr;
    gap:60px;
    align-items:end;

    padding:38px 28px 30px;
    margin:0 !important;

    border-bottom:1px solid rgba(255,255,255,.07);
}

#agencies .sx-agency-list__heading h2{
    margin:9px 0 0;
    max-width:650px;

    font-size:clamp(42px,4.3vw,66px);
    line-height:.96;
    letter-spacing:-.055em;
}

#agencies .sx-agency-list__heading > p{
    max-width:430px;
    margin:0 0 4px;

    color:#9692a1;
    font-size:14px;
    line-height:1.65;
}

/* disclaimer directly under heading, right aligned */
#agencies .sx-featured-listing__head{
    min-height:30px;
    padding:10px 28px 6px;
}

/* pull complete module slightly upward */
.sx-agency-list{
    padding-top:34px !important;
}

@media(max-width:800px){
    #agencies .sx2-heading.sx-agency-list__heading{
        grid-template-columns:1fr;
        gap:18px;
        padding:30px 18px 25px;
    }
}

/* =========================================================
   P2.0.8 — HERO CLIP FIX + BACK TO TOP
   ========================================================= */

/* Keep hero headline fully inside its own left column */
.sx2-hero--split{
    overflow:hidden !important;
}

.sx2-hero--split .sx2-hero-grid{
    overflow:visible !important;
}

.sx2-hero--split .sx2-hero-copy{
    width:100%;
    max-width:540px !important;
    padding-left:22px !important;
    padding-right:34px !important;
    box-sizing:border-box;
    overflow:visible !important;
}

.sx2-hero--split .sx2-hero h1{
    width:100%;
    max-width:500px !important;

    font-size:clamp(38px,3.2vw,54px) !important;
    line-height:.96 !important;
    letter-spacing:-.05em !important;

    margin-left:0 !important;

    /* breathing room for wide S glyph + final period */
    padding-left:.08em !important;
    padding-right:.18em !important;
    padding-bottom:.12em !important;

    overflow:visible !important;
}

/* keep motion, but never drag headline outside canvas */
.sx2-hero--split .sx2-hero-copy{
    transform:
      translate3d(
        max(var(--hero-left-x), -6px),
        var(--hero-left-y),
        0
      )
      scale(var(--hero-left-scale));
}


/* ---------------------------------------------------------
   BACK TO TOP
   --------------------------------------------------------- */

.sx-back-top{
    position:fixed;
    right:24px;
    bottom:24px;

    width:46px;
    height:46px;

    display:flex;
    align-items:center;
    justify-content:center;

    border:1px solid rgba(167,128,255,.24);
    border-radius:50%;

    background:
      linear-gradient(
        145deg,
        rgba(39,29,64,.92),
        rgba(14,12,21,.94)
      );

    color:#fff;

    font-size:20px;
    text-decoration:none;

    box-shadow:
      0 15px 45px rgba(0,0,0,.32),
      0 0 35px rgba(128,75,255,.10);

    backdrop-filter:blur(12px);

    opacity:0;
    visibility:hidden;
    transform:translateY(12px);

    transition:
      opacity .25s ease,
      visibility .25s ease,
      transform .25s ease,
      border-color .25s ease;

    z-index:9990;
}

.sx-back-top.is-visible{
    opacity:1;
    visibility:visible;
    transform:none;
}

.sx-back-top:hover{
    transform:translateY(-3px);
    border-color:rgba(184,145,255,.5);
}

@media(max-width:700px){
    .sx-back-top{
        right:14px;
        bottom:14px;
        width:42px;
        height:42px;
    }
}

/* P2.0.9 — final hero containment */

.sx2-hero--split .sx2-hero-copy{
    transform:
      translate3d(
        0,
        var(--hero-left-y),
        0
      )
      scale(var(--hero-left-scale)) !important;

    transform-origin:left center;
    padding-left:28px !important;
    padding-right:42px !important;
    overflow:visible !important;
}

.sx2-hero--split .sx2-hero h1{
    max-width:485px !important;
    font-size:clamp(36px,3vw,50px) !important;
    line-height:.97 !important;
    letter-spacing:-.047em !important;

    padding-left:.06em !important;
    padding-right:.22em !important;
    padding-bottom:.16em !important;

    overflow:visible !important;
}

/* right panel keeps the cinematic movement */
.sx2-hero--split .sx2-ai-card{
    transform:
      translate3d(
        var(--hero-right-x),
        var(--hero-right-y),
        0
      )
      scale(var(--hero-right-scale));
}

/* hide branded placeholder in ranking rows */

.sx2-rank-logo img[src*="logo-placeholder.webp"]{
    display:none;
}

.sx2-rank-logo:has(img[src*="logo-placeholder.webp"]){
    width:0;
    min-width:0;
    padding:0;
    margin:0;
}

/* =========================================================
   P2.0.10 — 50/50 HERO + SMALLER HEADLINE
   ========================================================= */

.sx2-hero--split .sx2-hero-grid{
    grid-template-columns:minmax(0,1fr) minmax(0,1fr) !important;
    gap:42px !important;
    align-items:center;
}

/* left side */
.sx2-hero--split .sx2-hero-copy{
    width:100%;
    max-width:none !important;
    padding-left:18px !important;
    padding-right:10px !important;
    box-sizing:border-box;
}

.sx2-hero--split .sx2-hero h1{
    width:100%;
    max-width:610px !important;

    font-size:clamp(34px,2.55vw,46px) !important;
    line-height:.98 !important;
    letter-spacing:-.045em !important;

    padding-left:.04em !important;
    padding-right:.12em !important;
    padding-bottom:.12em !important;

    overflow:visible !important;
}

/* slightly wider copy so text forms longer lines */
.sx2-hero--split .sx2-hero-copy>p{
    max-width:590px !important;
    font-size:16px;
    line-height:1.65;
}

/* right side = true 50% */
.sx2-hero--split .sx2-ai-card{
    width:100% !important;
    max-width:none !important;
    margin-left:0 !important;

    min-height:455px;
    box-sizing:border-box;
}

/* reduce collision / overshoot */
.sx2-hero--split .sx2-hero-copy{
    transform:
      translate3d(
        0,
        var(--hero-left-y),
        0
      )
      scale(var(--hero-left-scale)) !important;
}

.sx2-hero--split{
    padding-left:0;
    padding-right:0;
}

@media(max-width:1000px){

    .sx2-hero--split .sx2-hero-grid{
        grid-template-columns:1fr !important;
    }

    .sx2-hero--split .sx2-hero h1{
        max-width:680px !important;
        font-size:clamp(38px,8vw,58px) !important;
    }

    .sx2-hero--split .sx2-ai-card{
        width:100% !important;
    }
}

/* Hero AI brand header */

.sx2-ai-head{
    align-items:center;
}

.sx2-ai-brand{
    display:flex;
    align-items:center;
    gap:10px;
}

.sx2-ai-brand__logo{
    width:132px;
    height:auto;
    display:block;
}

.sx2-ai-brand__ask{
    color:#fff;
    font-size:13px;
    font-weight:700;

    padding:5px 8px;

    border:1px solid rgba(173,144,255,.24);
    border-radius:999px;

    background:rgba(255,255,255,.025);
}

.sx2-ai-head>span{
    margin-left:auto;
}

/* hero ai header: overline + single ask pill */

.sx2-ai-head{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:16px;
}

.sx2-ai-head__left{
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    gap:10px;
}

.sx2-ai-head__left small{
    display:block;
    margin:0;
    font-size:11px;
    line-height:1;
    letter-spacing:.22em;
    text-transform:uppercase;
    color:#9f8cff;
    font-weight:700;
}

.sx2-ai-askpill{
    display:inline-flex;
    align-items:center;
    gap:10px;
    padding:8px 14px;
    border-radius:999px;
    text-decoration:none;
    border:1px solid rgba(173,144,255,.20);
    background:rgba(255,255,255,.03);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
    transition:all .2s ease;
}

.sx2-ai-askpill:hover{
    border-color:rgba(212,114,255,.35);
    background:rgba(255,255,255,.05);
    transform:translateY(-1px);
}

.sx2-ai-askpill__logo{
    width:72px;
    height:auto;
    display:block;
}

.sx2-ai-askpill__text{
    color:#fff;
    font-size:15px;
    font-weight:700;
    line-height:1;
}

.sx2-ai-head > span{
    margin-left:auto;
}

/* P2.0.11 — AI label + Ask pill in one row */

.sx2-ai-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
}

.sx2-ai-head__left{
    display:flex;
    flex-direction:row !important;
    align-items:center !important;
    gap:12px !important;
}

.sx2-ai-head__left small{
    margin:0 !important;
    white-space:nowrap;
    font-size:10px;
    letter-spacing:.20em;
}

.sx2-ai-askpill{
    margin:0 !important;
    padding:7px 12px;
}

.sx2-ai-askpill__logo{
    width:68px;
}

.sx2-ai-askpill__text{
    font-size:14px;
}

.sx2-ai-head > span{
    margin-left:auto;
    flex-shrink:0;
}

/* P2.0.12 — SEOEXPERTS AI + Ask pill in one row */

.sx2-ai-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
}

.sx2-ai-head__left{
    display:flex !important;
    flex-direction:row !important;
    align-items:center !important;
    gap:12px !important;
}

.sx2-ai-head__left small{
    margin:0 !important;
    white-space:nowrap;
    font-size:10px;
    line-height:1;
    letter-spacing:.20em;
}

.sx2-ai-askpill{
    display:inline-flex;
    align-items:center;
    gap:8px;
    margin:0 !important;
    padding:6px 11px;
    border-radius:999px;
}

.sx2-ai-askpill__logo{
    width:64px;
    height:auto;
}

.sx2-ai-askpill__text{
    font-size:13px;
    line-height:1;
}

.sx2-ai-head > span{
    margin-left:auto;
    flex-shrink:0;
}

/* =========================================================
   RESEARCH HERO IMAGES — LOCKED
   ========================================================= */

.sx2-research-grid .sx2-card-visual{
    overflow:hidden;
    position:relative;
}

.sx2-research-grid .sx2-card-visual.has-image{
    padding:0;
}

.sx2-research-grid .sx2-card-visual.has-image img{
    display:block;
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center;
    transform:scale(1);
    transition:transform .55s cubic-bezier(.2,.7,.2,1);
}

.sx2-research-grid article:hover .sx2-card-visual.has-image img{
    transform:scale(1.045);
}

