/* =========================================================
   智绘嘉AI HERO - Tablet / iPad V2
   只作用于 769px ~ 1180px
   PC 与手机端不受影响
   ========================================================= */

@media (min-width:769px) and (max-width:1180px){

  html,
  body.zhj-hero-page{
    width:100% !important;
    height:100% !important;
    min-height:100% !important;
    overflow:hidden !important;
  }

  body.zhj-hero-page{
    padding-top:0 !important;
  }

  body.zhj-hero-page .zhj-hero{
    position:fixed !important;
    inset:0 !important;
    width:100% !important;
    max-width:100vw !important;

    height:100vh !important;
    height:100dvh !important;
    min-height:100vh !important;
    min-height:100dvh !important;

    overflow:hidden !important;
    background-position:center center !important;
  }


  /* =====================================
     iPad 改用统一导航
     不再强塞 PC 顶部菜单
     ===================================== */

  body.zhj-hero-page .zhj-hero-nav{
    display:none !important;
  }

  body.zhj-hero-page #zhjNav{
    position:fixed !important;
    left:0 !important;
    top:0 !important;
    right:0 !important;

    z-index:2147483600 !important;
    pointer-events:none !important;
  }

  body.zhj-hero-page #zhjNav .zhj-mobile-bar{
    display:flex !important;

    height:68px !important;
    min-height:68px !important;

    padding:8px 20px !important;

    pointer-events:auto !important;
  }

  body.zhj-hero-page #zhjNav .zhj-mobile-logo img{
    width:164px !important;
    max-width:34vw !important;
  }

  body.zhj-hero-page #zhjNav .zhj-mobile-toggle,
  body.zhj-hero-page #zhjNav .zhj-mobile-user-btn{
    pointer-events:auto !important;
  }

  body.zhj-hero-page #zhjNav .zhj-sidebar,
  body.zhj-hero-page #zhjNav .zhj-sidebar-mask,
  body.zhj-hero-page #zhjNav .zhj-mobile-user-menu{
    pointer-events:auto !important;
  }


  /* =====================================
     HERO 中部
     ===================================== */

  body.zhj-hero-page .zhj-main{
    width:100% !important;
    max-width:100vw !important;

    height:100vh !important;
    height:100dvh !important;

    padding:
      88px
      24px
      168px !important;

    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:flex-start !important;

    overflow:hidden !important;
  }


  /* LOGO 轨道 */

  body.zhj-hero-page .zhj-symbol-stage{
    width:218px !important;
    height:188px !important;

    margin:
      0
      auto
      2px !important;
  }

  body.zhj-hero-page .zhj-symbol-stage:after{
    bottom:-24px !important;
    width:330px !important;
    height:110px !important;
  }

  body.zhj-hero-page .zhj-ring.r1,
  body.zhj-hero-page .zhj-dot.d1{
    width:212px !important;
    height:212px !important;
  }

  body.zhj-hero-page .zhj-ring.r2,
  body.zhj-hero-page .zhj-dot.d2{
    width:158px !important;
    height:158px !important;
  }

  body.zhj-hero-page .zhj-dot.d3{
    width:188px !important;
    height:188px !important;
  }

  body.zhj-hero-page .zhj-symbol{
    width:158px !important;
    height:auto !important;
  }


  /* 标题区域 */

  body.zhj-hero-page .zhj-title{
    margin:0 !important;

    font-size:52px !important;
    line-height:.98 !important;

    letter-spacing:.025em !important;
    white-space:nowrap !important;
  }

  body.zhj-hero-page .zhj-text-wrap{
    width:min(680px,88vw) !important;
    max-width:88vw !important;
  }

  body.zhj-hero-page .zhj-sub{
    margin-top:8px !important;

    font-size:24px !important;
    line-height:1.12 !important;

    text-align:center !important;
    text-align-last:center !important;
    white-space:nowrap !important;
  }

  body.zhj-hero-page .zhj-en{
    margin-top:7px !important;

    font-size:18px !important;
    line-height:1.1 !important;

    letter-spacing:.065em !important;

    text-align:center !important;
    text-align-last:center !important;

    white-space:nowrap !important;
  }

  body.zhj-hero-page .zhj-slogan{
    margin-top:11px !important;

    max-width:90vw !important;

    font-size:19px !important;
    line-height:1.25 !important;

    letter-spacing:.025em !important;

    white-space:normal !important;
  }


  /* 两个按钮 */

  body.zhj-hero-page .zhj-buttons{
    margin-top:16px !important;

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

    gap:18px !important;
  }

  body.zhj-hero-page .zhj-btn{
    min-width:154px !important;
    width:auto !important;

    height:46px !important;

    padding:0 26px !important;

    font-size:16px !important;
  }


  /* =====================================
     iPad 底部五项能力
     改成横向紧凑五卡
     避免 2+2+1 占掉三行高度
     ===================================== */

  body.zhj-hero-page .zhj-features{
    position:absolute !important;

    left:50% !important;
    bottom:18px !important;

    transform:translateX(-50%) !important;

    width:min(1080px,calc(100vw - 30px)) !important;

    display:grid !important;
    grid-template-columns:repeat(5,minmax(0,1fr)) !important;

    gap:9px !important;
  }

  body.zhj-hero-page .zhj-card{
    min-width:0 !important;
    min-height:108px !important;

    padding:10px 7px !important;

    display:flex !important;
    flex-direction:column !important;

    align-items:center !important;
    justify-content:center !important;

    gap:5px !important;

    text-align:center !important;

    border-radius:15px !important;
  }

  body.zhj-hero-page .zhj-card i{
    width:34px !important;
    height:34px !important;

    flex:0 0 34px !important;

    font-size:19px !important;
  }

  body.zhj-hero-page .zhj-card b{
    margin:0 0 2px !important;

    font-size:13px !important;
    line-height:1.2 !important;

    white-space:nowrap !important;
  }

  body.zhj-hero-page .zhj-card p{
    margin:0 !important;

    font-size:10px !important;
    line-height:1.3 !important;

    white-space:normal !important;
  }
}


/* =========================================================
   iPad 横屏 / 高度较低
   ========================================================= */

@media
(min-width:769px)
and (max-width:1180px)
and (max-height:820px){

  body.zhj-hero-page .zhj-main{
    padding-top:76px !important;
    padding-bottom:136px !important;
  }

  body.zhj-hero-page .zhj-symbol-stage{
    width:162px !important;
    height:132px !important;
  }

  body.zhj-hero-page .zhj-ring.r1,
  body.zhj-hero-page .zhj-dot.d1{
    width:156px !important;
    height:156px !important;
  }

  body.zhj-hero-page .zhj-ring.r2,
  body.zhj-hero-page .zhj-dot.d2{
    width:116px !important;
    height:116px !important;
  }

  body.zhj-hero-page .zhj-dot.d3{
    width:138px !important;
    height:138px !important;
  }

  body.zhj-hero-page .zhj-symbol{
    width:116px !important;
  }

  body.zhj-hero-page .zhj-title{
    font-size:44px !important;
  }

  body.zhj-hero-page .zhj-sub{
    margin-top:6px !important;
    font-size:21px !important;
  }

  body.zhj-hero-page .zhj-en{
    margin-top:5px !important;
    font-size:16px !important;
  }

  body.zhj-hero-page .zhj-slogan{
    margin-top:7px !important;
    font-size:16px !important;
  }

  body.zhj-hero-page .zhj-buttons{
    margin-top:11px !important;
  }

  body.zhj-hero-page .zhj-btn{
    height:42px !important;
    min-width:142px !important;
    font-size:15px !important;
  }

  body.zhj-hero-page .zhj-features{
    display:grid !important;
    bottom:10px !important;
    gap:8px !important;
  }

  body.zhj-hero-page .zhj-card{
    min-height:88px !important;
    padding:7px 5px !important;
  }

  body.zhj-hero-page .zhj-card i{
    width:28px !important;
    height:28px !important;
    flex-basis:28px !important;
    font-size:16px !important;
  }

  body.zhj-hero-page .zhj-card b{
    font-size:12px !important;
  }

  body.zhj-hero-page .zhj-card p{
    font-size:9px !important;
  }
}

