/* =========================================================
   AIXDSP MOBILE HERO SPLIT
   MOBILE ONLY — desktop remains unchanged.
   ========================================================= */
@media (max-width: 820px){

  :root{
    --aix-hero-top-up: 22px;
    --aix-hero-bottom-down: 165px;
  }

  /* ---------------------------------------------------------
     PRODUCT PAGES
     --------------------------------------------------------- */

  /* SALE LABEL = TOP GROUP */
  .aix-product-page .product-hero .eyebrow,
  .aix-product-page .product-hero .aix-sale-eyebrow{
    display:table !important;
    width:auto !important;
    max-width:calc(100% - 24px) !important;
    margin-left:auto !important;
    margin-right:auto !important;
    text-align:center !important;
    transform:translateY(calc(-1 * var(--aix-hero-top-up))) !important;
  }

  /* PRODUCT TITLE = TOP GROUP */
  .aix-product-page .product-hero h1{
    text-align:center !important;
    margin-left:auto !important;
    margin-right:auto !important;
    transform:translateY(calc(-1 * var(--aix-hero-top-up))) !important;
  }

  /*
   * BOTTOM GROUP
   * Keep original left/right alignment.
   * Only move it down so the center artwork stays clear.
   */
  .aix-product-page .product-hero .hero-copy > p,
  .aix-product-page .product-hero .hero-copy > .price,
  .aix-product-page .product-hero .hero-copy > .hero-actions,
  .aix-product-page .product-hero .hero-copy > .product-actions,
  .aix-product-page .product-hero .hero-copy > .actions,
  .aix-product-page .product-hero .hero-copy > .hero-features,
  .aix-product-page .product-hero .hero-copy > .micro-features,
  .aix-product-page .product-hero .hero-copy > .features,
  .aix-product-page .product-hero .hero-copy > .trust-row{
    position:relative !important;
    top:var(--aix-hero-bottom-down) !important;
  }

  /* Do NOT center the lower group */
  .aix-product-page .product-hero .hero-copy > p{
    text-align:inherit !important;
    margin-left:0 !important;
    margin-right:0 !important;
  }

  .aix-product-page .product-hero .hero-copy > .price,
  .aix-product-page .product-hero .hero-copy > .hero-actions,
  .aix-product-page .product-hero .hero-copy > .product-actions,
  .aix-product-page .product-hero .hero-copy > .actions,
  .aix-product-page .product-hero .hero-copy > .hero-features,
  .aix-product-page .product-hero .hero-copy > .micro-features,
  .aix-product-page .product-hero .hero-copy > .features,
  .aix-product-page .product-hero .hero-copy > .trust-row{
    justify-content:initial !important;
    text-align:initial !important;
  }


  /* ---------------------------------------------------------
     HOMEPAGE
     --------------------------------------------------------- */

  /* sale label = TOP GROUP */
  body.page-index .hero .eyebrow,
  body.page-index .hero .aix-sale-eyebrow,
  .page-index .hero .eyebrow,
  .page-index .hero .aix-sale-eyebrow{
    display:table !important;
    width:auto !important;
    max-width:calc(100% - 24px) !important;
    margin-left:auto !important;
    margin-right:auto !important;
    text-align:center !important;
    transform:translateY(calc(-1 * var(--aix-hero-top-up))) !important;
  }

  /* homepage main title = TOP GROUP */
  body.page-index .hero h1,
  .page-index .hero h1{
    text-align:center !important;
    margin-left:auto !important;
    margin-right:auto !important;
    transform:translateY(calc(-1 * var(--aix-hero-top-up))) !important;
  }

  /* homepage bottom group */
  body.page-index .hero .copy > p,
  body.page-index .hero .copy > .hero-actions,
  body.page-index .hero .copy > .actions,
  body.page-index .hero .copy > .hero-features,
  body.page-index .hero .copy > .trust-row,
  body.page-index .hero .copy > .micro-features,
  .page-index .hero .copy > p,
  .page-index .hero .copy > .hero-actions,
  .page-index .hero .copy > .actions,
  .page-index .hero .copy > .hero-features,
  .page-index .hero .copy > .trust-row,
  .page-index .hero .copy > .micro-features{
    position:relative !important;
    top:var(--aix-hero-bottom-down) !important;
  }

  /* preserve lower-group alignment */
  body.page-index .hero .copy > p,
  .page-index .hero .copy > p{
    text-align:inherit !important;
  }

  body.page-index .hero .copy > .hero-actions,
  body.page-index .hero .copy > .actions,
  body.page-index .hero .copy > .hero-features,
  body.page-index .hero .copy > .trust-row,
  body.page-index .hero .copy > .micro-features,
  .page-index .hero .copy > .hero-actions,
  .page-index .hero .copy > .actions,
  .page-index .hero .copy > .hero-features,
  .page-index .hero .copy > .trust-row,
  .page-index .hero .copy > .micro-features{
    justify-content:initial !important;
    text-align:initial !important;
  }


  /* ---------------------------------------------------------
     DOWNLOADS PAGE
     --------------------------------------------------------- */

  /* breadcrumb / sale-style top line + title = TOP GROUP */
  .aix-downloads-mbg-exact .eyebrow,
  .aix-downloads-mbg-exact .hero-breadcrumb,
  .aix-downloads-mbg-exact h1{
    text-align:center !important;
    margin-left:auto !important;
    margin-right:auto !important;
    transform:translateY(calc(-1 * var(--aix-hero-top-up))) !important;
  }

  /* downloads lower group */
  .aix-downloads-mbg-exact p,
  .aix-downloads-mbg-exact .hero-actions,
  .aix-downloads-mbg-exact .actions,
  .aix-downloads-mbg-exact .hero-side{
    position:relative !important;
    top:var(--aix-hero-bottom-down) !important;
  }

  .aix-downloads-mbg-exact p{
    text-align:inherit !important;
  }


  /* ---------------------------------------------------------
     IMPORTANT: UNDO PREVIOUS BROAD MOBILE CENTERING
     The new layout only centers the top group.
     --------------------------------------------------------- */

  .aix-product-page .product-hero .hero-copy > p,
  body.page-index .hero .copy > p,
  .page-index .hero .copy > p,
  .aix-downloads-mbg-exact p{
    transform:none !important;
  }
}


/* Slightly smaller clear-center gap on short phones */
@media (max-width: 820px) and (max-height: 760px){
  :root{
    --aix-hero-bottom-down: 135px;
  }
}

/* Slightly larger gap on taller phones */
@media (max-width: 820px) and (min-height: 900px){
  :root{
    --aix-hero-bottom-down: 180px;
  }
}