/* Desktop customer support, aligned with developer.deeprobotics.cn, 2026-10-09. */
.desktop-support-icon,.desktop-eyebrow,.desktop-hero-title,.desktop-footer,.desktop-brand-label,.desktop-contact-label,.desktop-services-label,.desktop-service-action,.desktop-more-title,.desktop-nav,.desktop-card-kicker{display:none}
.hero-picture{display:contents}
.desktop-animated-icon{display:none}
.service-home .desktop-expanded-service{display:none}
@media(min-width:1024px){
  html,body{background:#fff;color:#242424}
  body{padding:0!important}
  .app.service-home{--bg:#fff;--blue:#3976f6;--muted:#7d8a9c;width:100%;min-height:100svh;height:auto;margin:0;padding:0;border-radius:0;box-shadow:none;background:#fff;overflow:visible;display:block;font-family:"Source Han Sans SC","Noto Sans CJK SC","PingFang SC","Microsoft YaHei",sans-serif}
  .service-home .topbar{height:64px;min-height:64px;margin:0;padding:0 24px;position:sticky;top:0;display:flex;align-items:center;gap:24px;background:linear-gradient(#4e82bd,#5b8dca);border:0;border-bottom:1px solid #24456726;box-shadow:none;backdrop-filter:none;z-index:40}
  .service-home .brand{display:flex;align-items:center;gap:14px;flex:none}
  .service-home .brand picture{display:flex}
  .service-home .brand img.portal-brand-logo{width:126px!important;height:auto!important;display:block}
  .desktop-brand-label{display:block;border-left:1px solid #ffffff50;padding-left:14px;font-size:14px;font-weight:600;line-height:28px;letter-spacing:0;color:#f7f9ff;white-space:nowrap}
  .desktop-nav{display:flex;align-items:center;gap:4px;margin:auto}
  .desktop-nav a,.desktop-nav button{display:block;padding:11px 15px;border-radius:10px;background:transparent;color:#f7f9ff;font-size:14px;font-weight:500;line-height:20px;text-decoration:none;cursor:pointer;white-space:nowrap;transition:background .18s}
  .desktop-nav .is-active{background:#3976f6}
  .desktop-nav a:hover,.desktop-nav button:hover{background:#ffffff20}
  .service-home .topbar-actions{gap:18px;margin-left:auto;flex:none}
  .service-home .login-shortcut{height:36px;min-width:68px;padding:0 18px;border:1px solid #ffffff65;border-radius:10px;box-shadow:none;background:#ffffff12;color:#fff;font-size:14px;font-weight:500}
  .service-home .login-shortcut:hover{background:#ffffff26;border-color:#fff}
  .service-home .login-shortcut.logged-in{max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .service-home .customer-btn{display:flex;align-items:center;gap:8px;width:auto;height:36px;padding:0;border:0;border-radius:0;background:none;box-shadow:none;color:#fff}
  .service-home .customer-btn svg{width:22px;height:22px}
  .desktop-contact-label{display:inline;font-size:14px;white-space:nowrap}
  .service-home .customer-menu{right:24px;top:58px;background:#fff;border:1px solid #e1e9f5;border-radius:16px;box-shadow:0 12px 40px #1e2e4421}
  .service-home .hero{position:relative;min-height:560px;height:clamp(560px,calc(100svh - 250px),720px);margin:0;padding:0;overflow:hidden;display:block;isolation:isolate;border-radius:0;box-shadow:none;background:radial-gradient(circle at 72% 22%,#ffffff4d,transparent 28rem),linear-gradient(#4e82bd 0%,#8eb6e3 34%,#dceafb 64%,#fff 100%)}
  .service-home .hero::before,.service-home .hero::after{display:none}
  .service-home .hero-copy{position:absolute;left:max(7.2vw,calc((100vw - 1560px)/2));top:clamp(120px,13vw,180px);width:auto;max-width:none;padding:0;text-align:left;z-index:2;text-shadow:0 2px 18px #133c6b3d}
  .mobile-hero-title,.mobile-more-title{display:none}
  .desktop-hero-title,.desktop-more-title{display:block}
  .service-home .hero-copy h1{margin:0;color:#fff;font-size:clamp(48px,5vw,82px);font-weight:700;line-height:1.12;letter-spacing:-.055em;white-space:nowrap}
  .service-home .hero-copy p{margin:26px 0 0;font-size:clamp(17px,1.45vw,21px);font-weight:300;line-height:1.65;white-space:nowrap;letter-spacing:.035em;color:#ffffffe0}
  .service-home .hero-img{position:absolute;display:block;left:auto;right:max(6vw,calc((100vw - 1560px)/2));top:auto;bottom:-46px;width:70%;height:auto;max-height:none;max-width:1160px;object-fit:contain;margin:0;border-radius:0;opacity:1;mix-blend-mode:normal;filter:none;box-shadow:none;mask-image:none;-webkit-mask-image:none;pointer-events:none;z-index:1}
  .service-home .services{position:relative;z-index:3;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px;align-items:stretch;width:calc(100% - 48px);max-width:1512px;height:auto;margin:-96px auto 0;padding:0;border:0}
  .service-home .service-card{position:relative;display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;gap:0;min-width:0;min-height:220px;height:auto;margin:0;padding:26px;background:#fff;border:1px solid #1978ff2e;border-radius:20px;box-shadow:0 14px 26px #1e2e4421;color:#242424;overflow:hidden;transition:transform .18s,border-color .18s,box-shadow .18s;text-align:left;cursor:pointer}
  .service-home .service-card::after{content:"";position:absolute;left:0;right:0;bottom:0;height:4px;background:#3976f6}
  .service-home .service-card:hover{transform:translateY(-4px);background:#fff;border-color:#1978ff73;box-shadow:0 20px 34px #1e2e442b}
  .service-home .service-card:active{transform:translateY(-1px)}
  .desktop-card-kicker{display:block;color:#8897aa;font-size:10px;line-height:16px;font-weight:500;letter-spacing:.12em}
  .service-home .service-card h2{margin:16px 0 10px;font-size:20px;line-height:1.35;font-weight:500;letter-spacing:-.025em}
  .service-home .service-card p{margin:0;font-size:13px;line-height:1.6;font-weight:400;color:#7d8a9c;white-space:normal}
  .service-home .icon{position:absolute;right:22px;bottom:24px;display:grid;place-items:center;width:48px;height:48px;margin:0;background:#3976f6;border:0;border-radius:16px;box-shadow:none;color:#fff}
  .service-home .icon svg{width:26px;height:26px;stroke-width:1.6}
  .service-home [data-icon-hover] .icon{width:54px;height:54px;background:transparent;border-radius:0}
  .service-home [data-icon-hover] .icon > svg{display:none}
  .service-home .desktop-animated-icon{display:block;width:100%;height:100%;line-height:0}
  .service-home .desktop-animated-icon > svg{display:block;width:100%;height:100%;filter:none}
  .service-home .chev,.service-home #openChatTop{display:none}
  .service-home .desktop-expanded-service{display:flex;text-decoration:none}
  .desktop-card-icon{width:26px;height:26px;filter:brightness(0) invert(1)}
  .service-home #openChatTop .icon svg{display:none}
  .desktop-support-icon{display:block;width:26px;height:26px;filter:brightness(0) invert(1)}
  .desktop-service-action{position:absolute;left:26px;bottom:30px;display:flex;align-items:center;justify-content:flex-start;gap:8px;min-height:24px;margin-top:26px;padding:0;color:#3976f6;font-size:14px;line-height:24px;font-weight:400}
  .desktop-action-arrow{width:18px;height:18px;filter:invert(43%) sepia(96%) saturate(2910%) hue-rotate(208deg) brightness(98%) contrast(97%)}
  .desktop-footer{display:flex;justify-content:space-between;align-items:center;gap:20px;width:calc(100% - 64px);max-width:1496px;min-height:62px;margin:0 auto;padding:20px 0;font-size:12px;color:#8793a3}
  .desktop-footer a{color:inherit;text-decoration:none}
  .desktop-footer a span{margin-left:9px;color:#526278;font-size:13px}
  .desktop-footer a:hover{color:#3976f6}
  .service-home button:focus-visible,.service-home a:focus-visible{outline:3px solid #1978ff88;outline-offset:4px}
  .service-home .topbar button:focus-visible,.service-home .topbar a:focus-visible{outline-color:#fff}
  @media(max-width:1199px){
    .service-home .topbar{gap:18px;padding:0 20px}
    .desktop-nav a,.desktop-nav button{padding:10px}
    .desktop-contact-label{display:none}
    .service-home .hero-copy{left:6vw;top:125px}
    .service-home .hero-img{bottom:-10px}
    .service-home .service-card{padding:24px 18px}
    .service-home .icon{right:16px;width:42px;height:42px;border-radius:13px}
    .service-home [data-icon-hover] .icon{width:46px;height:46px}
    .desktop-service-action{left:18px;font-size:12px;bottom:28px}
    .desktop-action-arrow{display:none}
    .desktop-card-kicker{font-size:9px}
    .service-home .service-card p{font-size:13px}
    .service-home .service-card h2{font-size:19px}
  }
  /* ---------- 弹窗：统一居中卡片，报修表单双栏 ---------- */
  .sheet-backdrop { padding: 40px; background: rgba(15, 18, 22, .42); }
  .sheet {
    box-shadow: 0 44px 140px rgba(0, 0, 0, .28);
    transition: transform .28s cubic-bezier(.22, .8, .2, 1);
  }
  #feedbackSheet, #progressSheet, #progressDetailSheet, #loginSheet { padding: 40px; }
  #feedbackSheet .sheet,
  #progressSheet .sheet,
  #progressDetailSheet .sheet,
  #loginSheet .login-card {
    bottom: auto;
    width: min(640px, 100%);
    max-height: min(86vh, 980px);
    padding: 34px 36px;
    border-radius: 26px;
    border: 0;
    box-shadow: 0 44px 140px rgba(0, 0, 0, .28);
    transform: translateY(26px) scale(.99);
    transition: transform .28s cubic-bezier(.22, .8, .2, 1);
  }
  #feedbackSheet.open .sheet,
  #progressSheet.open .sheet,
  #progressDetailSheet.open .sheet,
  #loginSheet.open .login-card { transform: translateY(0) scale(1); }
  #feedbackSheet .sheet { width: min(880px, 100%); }
  #progressDetailSheet .sheet { width: min(840px, 100%); }
  #loginSheet .login-card { width: min(480px, 100%); border-radius: 24px; }
  .sheet-handle { display: none !important; }
  .sheet-head h3 { font-size: 26px; letter-spacing: -.02em; }

  /* 报修表单双栏排布：行内成对字段保持并排
     子元素序号：1 设备类型 2 序列号 3 公司 4 联系行 5 邮箱 6 频率行 7 描述 8 附件 */
  #feedbackForm { display: grid; grid-template-columns: 1fr 1fr; gap: 18px 22px; align-items: start; }
  #feedbackForm > .field { margin: 0; }
  #feedbackForm > div:nth-of-type(1),
  #feedbackForm > div:nth-of-type(5),
  #feedbackForm > div:nth-of-type(7),
  #feedbackForm > div:nth-of-type(8),
  #feedbackForm > .field-row,
  #feedbackForm > .primary-btn { grid-column: 1 / -1; }
  #feedbackForm > .field-row { display: grid; grid-template-columns: 1fr 1fr; gap: 18px 22px; }
  #feedbackForm .field input,
  #feedbackForm .field select,
  #feedbackForm .field textarea {
    min-height: 48px;
    border-radius: 12px;
    border-color: #d2d7dc;
    background: #fff;
    font-size: 15px;
  }
  #feedbackForm .field label { font-size: 13px; }

  /* ---------- AI 对话工作台：居中双栏工作区 ---------- */
  .chat-workspace {
    padding: 48px;
    align-items: center;
    background: rgba(15, 20, 28, .4);
    -webkit-backdrop-filter: blur(6px);
    backdrop-filter: blur(6px);
  }
  .chat-workspace .chat-sheet {
    width: min(1220px, 100%);
    max-width: min(1220px, 100%);
    height: min(880px, calc(var(--chat-viewport-height, 100svh) - 96px));
    max-height: calc(var(--chat-viewport-height, 100svh) - 96px);
    border: 0;
    border-radius: 28px;
    box-shadow: 0 44px 140px rgba(0, 0, 0, .3);
    transform: translateY(22px) scale(.99);
    transition: transform .28s cubic-bezier(.22, .8, .2, 1);
  }
  .chat-workspace.open .chat-sheet { transform: translateY(0) scale(1); }
  .chat-sidebar {
    grid-column: 1;
    width: 264px;
    padding: 26px 20px;
    background: #f5f5f7;
    border-right: 1px solid #e6e8eb;
  }
  .chat-main { grid-column: 2; }
  .sidebar-scrim { display: none !important; }
  .chat-menu { display: none !important; }
  .chat-mobile-new { display: none !important; }
  body.sidebar-open .chat-sidebar { transform: none; }

  #moreFeaturesSheet{inset:0;width:auto;height:auto;max-height:none;margin:0;transform:none;padding:32px;border-radius:0}
  #moreFeaturesSheet .more-features-dialog{width:min(520px,100%);max-height:calc(100svh - 64px);border-radius:24px;margin:0;}

  /* ---------- 通用控件：苹果风格按钮 ---------- */
  .primary-btn {
    min-height: 50px;
    border-radius: 980px;
    background: #0071e3;
    font-size: 16px;
    font-weight: 500;
    box-shadow: none;
    transition: background .18s ease, transform .12s ease;
  }
  .primary-btn:hover { background: #0077ed; }
  .primary-btn:active { transform: scale(.98); }
  .sms-btn {
    border-radius: 980px;
    min-height: 48px;
    font-weight: 500;
  }
  .close-btn { width: 38px; height: 38px; border-radius: 980px; }

  /* 弹窗内滚动条弱化 */
  .sheet::-webkit-scrollbar,
  .chat-history-list::-webkit-scrollbar,
  .chat-list::-webkit-scrollbar,
  .detail-scroll::-webkit-scrollbar { width: 8px; }
  .sheet::-webkit-scrollbar-thumb,
  .chat-history-list::-webkit-scrollbar-thumb,
  .chat-list::-webkit-scrollbar-thumb,
  .detail-scroll::-webkit-scrollbar-thumb {
    background: rgba(0, 0, 0, .18);
    border-radius: 99px;
  }

  /* 提示条：顶部居中 */
  .toast { top: 84px !important; }

  /* 减少动态效果用户：弹窗直接就位 */
  @media (prefers-reduced-motion: reduce) {
    .service-home .service-card,
    .sheet,
    #feedbackSheet .sheet,
    #progressSheet .sheet,
    #progressDetailSheet .sheet,
    #loginSheet .login-card,
    .chat-workspace .chat-sheet { transition: none; }
  }
}

/* Desktop hero: independent grid columns, centered as a single composition.
   Keep every override at the existing desktop breakpoint to preserve mobile. */
@media (min-width: 1024px) {
  .service-home .hero {
    display: grid;
    grid-template-columns: clamp(300px, 30vw, 420px) minmax(0, 1fr);
    grid-template-rows: minmax(0, 1fr);
    column-gap: clamp(24px, 2vw, 40px);
    align-items: center;
    padding: 40px max(32px, calc((100% - 1680px) / 2)) 120px;
    box-sizing: border-box;
  }
  .service-home .hero-copy {
    position: static;
    inset: auto;
    width: 100%;
    min-width: 0;
    max-width: 100%;
    padding: 0;
    margin: 0;
    transform: none;
    align-self: center;
  }
  .service-home .hero-copy h1 {
    font-size: clamp(40px, 4.15vw, 72px);
    white-space: normal;
    overflow-wrap: anywhere;
  }
  .service-home .hero-copy p {
    font-size: clamp(14px, 1.2vw, 19px);
    white-space: normal;
    overflow-wrap: anywhere;
  }
  .service-home .hero-picture {
    display: flex;
    align-items: center;
    justify-content: center;
    position: static;
    min-width: 0;
    width: 100%;
    height: 100%;
    min-height: 0;
    max-width: 100%;
    margin: 0;
    transform: none;
  }
  .service-home .hero-img {
    position: static;
    inset: auto;
    width: 100%;
    height: auto;
    min-width: 0;
    min-height: 0;
    max-width: min(100%, calc((clamp(560px, calc(100svh - 250px), 720px) - 160px) * 2.5));
    max-height: none;
    margin: 0;
    transform: none;
    flex: 0 0 auto;
    object-fit: contain;
    object-position: center;
  }
}