/* qm-polish.css — site-wide detail polish (2026-10-21). Remove the <link id="qm-polish-css"> to revert. */
:root{
  --qm-space-1:8px;--qm-space-2:16px;--qm-space-3:24px;--qm-space-4:32px;--qm-space-5:40px;--qm-space-6:48px;--qm-space-8:64px;--qm-space-10:80px;--qm-space-12:96px;--qm-space-16:128px;
  --qm-radius:4px;--qm-ink:#171a20;--qm-ink-2:#393c41;--qm-muted:#5c5e62;--qm-line:#e5e5e5;
}
/* Typography details */
html{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{text-autospace:normal;hanging-punctuation:first allow-end last;font-kerning:normal;font-feature-settings:"kern" 1}
h1,h2,h3,h4,.entry-title{text-wrap:balance}
p,li,figcaption,blockquote{text-wrap:pretty;overflow-wrap:break-word}
table,time,.qm-num,[class*="stat"] strong,[class*="number"],[class*="count"],[class*="metric"]{font-variant-numeric:tabular-nums lining-nums}
abbr,.uppercase{font-variant-caps:all-small-caps}
::selection{background:#171a20;color:#fff}
/* Images: never stretch, never overflow */
figure img,picture img,[class*="card"] img,[class*="thumb"] img,[class*="cover"] img,[class*="hero"] img,[class*="media"] img{object-fit:cover}
img[src$=".svg"],img[class*="logo"],[class*="logo"] img,img[alt*="logo" i],img[alt="icon"]{object-fit:contain}
/* Buttons: one radius, one rhythm */
.wp-block-button__link,.ast-button,.elementor-button,a.button,button.button,.btn,input[type=submit]{border-radius:var(--qm-radius);letter-spacing:.01em;transition:background-color .2s ease,color .2s ease,border-color .2s ease,box-shadow .2s ease}
:where(a,button,input,select,textarea,[tabindex]):focus-visible{outline:2px solid #3e6ae1;outline-offset:2px}
/* Mobile: no sideways scroll, comfortable tap targets */
@media (max-width:600px){
  html,body{overflow-x:clip}
  h1{overflow-wrap:anywhere}
}
@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}

/* ===== Icon + micro-UI system (IBM Carbon Icons, Apache-2.0, self-hosted in ./qm-icons/) ===== */
:root{--qi-chev-down:url(qm-icons/chevron--down.svg);--qi-arrow:url(qm-icons/arrow--right.svg);--qi-menu:url(qm-icons/menu.svg);--qi-close:url(qm-icons/close.svg);--qi-ease:cubic-bezier(.25,.1,.25,1)}
.qi{display:inline-block;width:20px;height:20px;vertical-align:-.2em;background:currentColor;-webkit-mask:var(--qi) center/contain no-repeat;mask:var(--qi) center/contain no-repeat;flex:none}
/* Nav chevrons: replace mixed Astra SVGs with one Carbon chevron */
.ast-header-navigation-arrow .ast-icon.icon-arrow svg,.dropdown-menu-toggle .ast-icon.icon-arrow svg{opacity:0}
.ast-header-navigation-arrow .ast-icon.icon-arrow,.dropdown-menu-toggle .ast-icon.icon-arrow{position:relative;display:inline-block;width:14px;height:14px}
.ast-header-navigation-arrow .ast-icon.icon-arrow::after,.dropdown-menu-toggle .ast-icon.icon-arrow::after{content:"";position:absolute;inset:0;background:currentColor;-webkit-mask:var(--qi-chev-down) center/contain no-repeat;mask:var(--qi-chev-down) center/contain no-repeat;transition:transform .3s var(--qi-ease)}
.menu-item:hover>a .ast-icon.icon-arrow::after,.menu-item:focus-within>a .ast-icon.icon-arrow::after{transform:rotate(180deg)}
/* Arrow affordances: one subtle, consistent hover nudge */
.qm-evidence-arrow,.ql-explore-arrow,.qm-service-arrow,.qm-research-event-arrow,.qa-home-arrow,[class*="-arrow"]:not(.ast-icon):not(.ast-arrow-svg):not(.dropdown-menu-toggle):not(.ast-header-navigation-arrow){display:inline-block;transition:transform .35s var(--qi-ease)}
a:hover>.qm-evidence-arrow,a:hover .ql-explore-arrow,a:hover .qm-service-arrow,a:hover .qm-research-event-arrow,a:hover .qa-home-arrow,a:hover>[class*="-arrow"]:not(.ast-icon):not(.dropdown-menu-toggle){transform:translateX(4px)}
/* Mobile menu toggle: Carbon menu / close */
.mobile-menu-toggle-icon .ast-mobile-svg{opacity:0}
.mobile-menu-toggle-icon{position:relative}
.mobile-menu-toggle-icon::after{content:"";position:absolute;inset:0;margin:auto;width:24px;height:24px;background:currentColor;-webkit-mask:var(--qi-menu) center/contain no-repeat;mask:var(--qi-menu) center/contain no-repeat}
.toggled .mobile-menu-toggle-icon::after,[aria-expanded="true"] .mobile-menu-toggle-icon::after{-webkit-mask-image:var(--qi-close);mask-image:var(--qi-close)}
/* Form inputs */
:where(input[type=text],input[type=email],input[type=tel],input[type=search],input[type=number],select,textarea){border-radius:var(--qm-radius);transition:border-color .2s ease,box-shadow .2s ease}
:where(input,select,textarea):focus{outline:none;border-color:#171a20!important;box-shadow:0 0 0 3px rgba(23,26,32,.12)}
::placeholder{color:#8e8e8e;opacity:1}
:where(select){-webkit-appearance:none;appearance:none;background-image:url(qm-icons/chevron--down.svg);background-repeat:no-repeat;background-position:right 12px center;background-size:14px;padding-right:36px}
/* Scroll indicator + scrollbar */
html{scroll-behavior:smooth;scrollbar-color:rgba(23,26,32,.35) transparent;scrollbar-width:thin}
@media (prefers-reduced-motion:reduce){[class*="-arrow"]{transition:none!important}}

/* ===== Type scale modeled on openai.com (measured 2026-10-22 via headless Chrome):
   display 45.6/52.8 w500 ls -0.029em · card h2 21.7/27.2 w500 ls -0.01em · body/nav 17/28 w400 ls -0.01em · meta 13–14/1.4–1.5 w500
   mobile display 32.2/36.75 ls -0.02em. Chinese only (English weights owned by qm-tesla-english.css). ===== */
html:not([lang^="en"]){--qt-display:clamp(32px,3.6vw,46px);--qt-h2:clamp(24px,2.4vw,32px);--qt-h3:clamp(18px,1.6vw,22px);--qt-body:17px;--qt-small:14px;--qt-meta:13px}
html:not([lang^="en"]) body{font-family:"PingFang SC","Noto Sans SC","Hiragino Sans GB","Microsoft YaHei",-apple-system,BlinkMacSystemFont,"Helvetica Neue",Arial,sans-serif}
html:not([lang^="en"]) :where(p,li){line-height:1.7;letter-spacing:.005em}
html:not([lang^="en"]) :where(small,figcaption,time,.meta,[class*="-meta"],[class*="eyebrow"]){line-height:1.45;font-weight:500}

/* ===== Declutter (restraint over decoration). Lead widget .qm-consult, nav, footer, Baidu kept. ===== */
:where(.ast-scroll-top-icon,#ast-scroll-top,.back-to-top,.scroll-to-top,.widget_tag_cloud,.tagcloud,.sharedaddy,.addtoany_share_save_container,.a2a_kit,.social-share,.post-share,.widget_recent_comments,.widget_meta,.widget_archive,.post-views,.visitor-counter,.cookie-notice-container,#cookie-notice){display:none!important}
.qm-consult{box-shadow:0 1px 2px rgba(0,0,0,.06)!important}
.qm-consult *{text-shadow:none!important}

/* Outline buttons on light backgrounds were white-on-white (e.g. 沟通项目需求) */
html:not(#qmP):not(#qmP2):not(#qmP3) .ui-button.ui-button--outline{color:#171a20!important;border-color:rgba(23,26,32,.4)!important}
html:not(#qmP):not(#qmP2):not(#qmP3) .ui-button.ui-button--outline:hover{background-color:#171a20!important;color:#fff!important;border-color:#171a20!important}

/* Contrast: Tesla grey #8E8E8E on white is 3.3:1 — small labels raised to #5C5E62 (6.4:1) */
html:not(#qmP):not(#qmP2) .ic-step,html:not(#qmP):not(#qmP2) .ic-breadcrumb,html:not(#qmP):not(#qmP2) .ic-breadcrumb a{color:#5c5e62!important}

/* 20261022-img: HTML widgets (full custom case layouts with dark/full-bleed sections) are NOT padded — they carry their own inner padding; padding them caused white strips at the sides on mobile */
@media (max-width:767px){body.single-post #content .elementor-widget-html{padding-left:0!important;padding-right:0!important}}
/* Case detail pages (Elementor single posts): consistent mobile side padding on text, images stay full-bleed */
@media (max-width:767px){
  body.single-post #content :is(.elementor-widget-heading,.elementor-widget-text-editor,.elementor-widget-icon-list,.elementor-widget-button){padding-left:var(--qm-space-3,24px)!important;padding-right:var(--qm-space-3,24px)!important;box-sizing:border-box!important;max-width:100%!important}
  body.single-post #content .e-con-inner :is(.elementor-widget-heading,.elementor-widget-text-editor){margin-left:0!important;margin-right:0!important}
}

/* Footer contact lines (phone / company / address): align to the 24px mobile gutter */
@media (max-width:767px){
  html body.single-post #colophon .elementor-1607 :is(.elementor-element-e5af1e7,.elementor-element-66199ec,.elementor-element-d5caff2){padding-left:9px!important;padding-right:9px!important;box-sizing:border-box!important}
}

/* ===== No light frames/bands around images (owner request 2026-10-22) =====
   Images fill their frame edge to edge; frames never show their own background. */
/* Parallax frames (home featured work, project/system visuals): bleed the image 6% so the moving image never uncovers the frame's grey/dark background */
.hm-parallax-frame{overflow:hidden!important;background-color:transparent!important}
.hm-parallax-frame img{object-fit:cover!important;scale:1.06;transform-origin:50% 50%}
/* Card/feature images that were letterboxed with object-fit:contain */
.qi-feature-media img,.qmc-card-box img,.qmar-image-frame img.qmar-image{object-fit:cover!important;width:100%!important;height:100%!important;padding:0!important;border:0!important;background:none!important}
.qi-feature-media,.qmc-card-box,.qmar-image-frame{background-color:transparent!important;padding:0!important;border:0!important}
/* Generic card media: no padding, border or background band around the picture */
:is([class*="card"],[class*="thumb"],[class*="cover"],[class*="media"],figure) > :is(img,picture,a > img){padding:0!important;border:0!important;background:none!important}
:is([class*="card"],[class*="thumb"],[class*="media"]) img{object-fit:cover}

/* qlp-band 20261022: case list cards — image always fills frame, no grey #EEE band (any browser / lazy-load / reveal state) */
html:not(#qmP):not(#qmP2) .qlp-image{aspect-ratio:16/10;background:transparent!important}
html:not(#qmP):not(#qmP2) .qlp-feature .qlp-image{aspect-ratio:2.2}
html:not(#qmP):not(#qmP2) .qlp-image img{position:absolute;inset:0;width:100%!important;height:100%!important;max-width:none;aspect-ratio:auto;object-fit:cover;object-position:50% 50%;margin:0;padding:0;border:0}
@media(max-width:600px){html:not(#qmP):not(#qmP2) .qlp-feature .qlp-image{aspect-ratio:16/10}}

/* cover 20261022: every listing/card image fills its frame edge-to-edge, no grey/white bands */
html:not(#qmC):not(#qmC2) :is(.ci-image-frame,.qlp-image,.ci-visual,.ci-feature-media){background:transparent!important;background-color:transparent!important;padding:0!important;overflow:hidden}
html:not(#qmC):not(#qmC2) body :is(.ci-case-image,.ci-feature-image,.ci-image-frame img,.qlp-image img,.ci-visual img,.ci-feature-media img){object-fit:cover!important;width:100%!important;height:100%!important;max-width:none!important;background:transparent!important;padding:0!important;border:0!important}
html:not(#qmC):not(#qmC2) body .ci-case[data-portrait="true"] :is(.ci-case-image,img){object-position:50% 22%!important}
html:not(#qmC):not(#qmC2) body .ci-industry .ci-hero-image{object-fit:cover!important;background:transparent!important}
html:not(#qmC):not(#qmC2) :is(.qe-media,.ci-visual-frame,.qe-international .qe-case .qe-media){background:transparent!important;background-color:transparent!important}
html:not(#qmC):not(#qmC2) body :is(.qe-media img,.ci-visual-frame img,a .qm-zoom,.qms-stage-media,img.qms-hero-media){object-fit:cover!important;max-width:none!important;background:transparent!important}
html:not(#qmC):not(#qmC2) body :is(.qe-media img,.ci-visual-frame img){width:100%!important;height:100%!important}

/* 20261022-foot: 内嵌案例页的标题跟随所在区块的文字颜色，
   不再被 Astra 深色主题的全局 h1–h6 白色覆盖（避免浅底白字）。
   特异性 0,0,2：高于 Astra 的 h2，低于 .text-white 等类名。 */
body :where(.elementor-widget-html) :is(h1, h2, h3, h4, h5, h6) { color: inherit; }
/* 案例页自带 .typography-headline 颜色写在 .text-white 之后，导致深底黑字 */
.elementor-widget-html .typography-headline.text-white { color: #fff; }
/* 图标字体不被全站文字字体覆盖（否则显示 location_city 之类的连字原文） */
html:not(#qmI1):not(#qmI2):not(#qmI3):not(#qmI4) body .material-symbols-rounded { font-family: 'Material Symbols Rounded' !important; font-weight: normal; letter-spacing: normal; text-transform: none; }
html:not(#qmI1):not(#qmI2):not(#qmI3):not(#qmI4) body .material-symbols-outlined { font-family: 'Material Symbols Outlined' !important; font-weight: normal; letter-spacing: normal; text-transform: none; }
html:not(#qmI1):not(#qmI2):not(#qmI3):not(#qmI4) body .material-icons { font-family: 'Material Icons' !important; font-weight: normal; letter-spacing: normal; text-transform: none; }
/* 深色区块里的 .highlight 卡片保持半透明深色（tesla-local 统一改白底后变成白底白字） */
html:not(#qmT):not(#qmF) .highlight[style*="rgba(255,255,255,0.1)"] { background: rgba(255,255,255,.08) !important; color: #fff; display: block !important; height: auto !important; padding: 32px 36px !important; margin-top: 48px; }
/* 深色区块（section.text-white）里的玻璃卡片保持半透明，避免白卡白字 */
html:not(#qmT):not(#qmG) section.text-white .glass-card { background-color: rgba(255,255,255,.07) !important; border: 1px solid rgba(255,255,255,.14) !important; }
/* 深色成果区里的注释段落不加浅灰底 */
html:not(#qmT):not(#qmT2):not(#qmT3):not(#qmN) .ql-results .ql-note { background: transparent !important; color: rgba(255,255,255,.8); padding: 0; }

/* 20261023 nomask: case hero shows the image untouched — no scrim, gradient, vignette or text-shadow */
html body .tpl .tpl-hero::before,html body .tpl .tpl-hero::after,html body .tpl.tpl-r2 .tpl-hero::after,
html:not(#qmT) body .tpl .tpl-hero::after,html:not(#qmT) body .tpl.tpl-r2 .tpl-hero::after,
html body #tpl-case .tpl-hero .tpl-hero-in::before,html body #tpl-case .tpl-hero .tpl-hero-in::after,
html.qm-motion-ready.qmc-on .qmc-hero-box::after{background:none!important;background-image:none!important;opacity:0!important;box-shadow:none!important}
html body .tpl:not(.tpl-pending) .tpl-hero::after{content:none!important}
html body .tpl .tpl-hero,html body .tpl .tpl-hero *,html body #tpl-case .tpl-hero .tpl-h1,html body #tpl-case .tpl-hero .tpl-hero-in{text-shadow:none!important}
html body .tpl .tpl-hero img,html body .tpl .tpl-hero picture,html.qm-motion-ready.qmc-on .qmc-hero-box img{filter:none!important}
html:not(#qmT):not(#qmN) body .tpl .tpl-hero,html:not(#qmT):not(#qmN) body .tpl .tpl-hero *,html:not(#qmT):not(#qmN) body .tpl.tpl-r2 .tpl-h1,html:not(#qmT):not(#qmN) body #tpl-case .tpl-hero .tpl-h1{text-shadow:none!important}
html:not(#qmT):not(#qmN) body .tpl:not(.tpl-pending) .tpl-hero::after,html:not(#qmT):not(#qmN) body .tpl .tpl-hero::before,html:not(#qmT):not(#qmN) body #tpl-case .tpl-hero .tpl-hero-in::before{background:none!important;background-image:none!important;opacity:0!important}
html:not(#qmT):not(#qmN) body .qmr-toc,html:not(#qmT):not(#qmN) body .qmr-toc > li,html:not(#qmT):not(#qmN) body .qmr-mg,html:not(#qmT):not(#qmN) body .qmr-mg > div{border:0!important;border-top:0!important;border-bottom:0!important;border-left:0!important;border-right:0!important}
