/* WEBSITE-ASK (Haning 10/20): the hero's 中兴新云 AI 智库 version (50% of visits, the globe the other 50%; the reader can switch, and the
   choice holds for the visit) and the one-line ask box under the company section. 中兴新云设计系统：白底、主蓝与深蓝、衬线标题；不用 3D。 */
.home2-ask { display: none; }
.home2-hero[data-hero-variant="ask"] .home2-hero-media,
.home2-hero[data-hero-variant="ask"] .home2-global-screen,
.home2-hero[data-hero-variant="ask"] .home2-hero-copy:not(.home2-ask-copy) { display: none; }
.home2-hero[data-hero-variant="ask"] .home2-ask {
    display: grid; width: 100%; grid-template-columns: minmax(0, 1fr) minmax(0, 520px); gap: clamp(40px, 6vw, 96px); align-items: center;
}
/* The hero lets pointer input through to the globe; the ask area takes it back (the box, the chips and the text). */
.home2-hero[data-hero-variant="ask"] .home2-ask { pointer-events: auto; }
.home2-ask-copy { width: auto; max-width: 600px; }
.home2-ask-title {
    margin: 0; color: var(--home-ink); font-family: var(--ztc-font-serif, serif); font-size: clamp(44px, 4.6vw, 66px); font-weight: 600;
    letter-spacing: -.01em; line-height: 1.1; text-wrap: balance;
}
/* Rotating slogans (Haning 10/20 “左边这个文字可以轮动”): stacked in one grid cell, so the height never jumps. */
.home2-ask-title { display: grid; }
.home2-ask-slogan { grid-area: 1 / 1; opacity: 0; transform: translateY(10px); transition: opacity .6s ease, transform .6s ease; }
.home2-ask-slogan.is-active { opacity: 1; transform: none; }
.home2-ask-l1, .home2-ask-l2 { display: block; }
.home2-ask-l2 { margin-top: 8px; color: var(--home-blue); }
.home2-ask-card { position: relative; z-index: 2; }
.home2-ask-form {
    display: flex; flex-direction: column; gap: 10px; padding: 18px 18px 14px; background: #fff; border: 1px solid rgba(0, 103, 180, .16);
    border-radius: 24px; box-shadow: 0 1px 2px rgba(16, 42, 84, .05), 0 24px 56px -24px rgba(3, 47, 82, .32); transition: border-color .2s, box-shadow .2s;
}
.home2-ask-form:focus-within { border-color: var(--home-blue); box-shadow: 0 0 0 4px rgba(0, 142, 211, .12), 0 24px 56px -24px rgba(3, 47, 82, .36); }
.home2-ask-form textarea {
    width: 100%; min-height: 96px; padding: 4px 6px; border: 0; outline: none; resize: none; background: transparent; color: var(--home-ink);
    font: 400 17px/1.7 var(--ztc-font-sans, sans-serif);
}
.home2-ask-form textarea::placeholder { color: #7A8CA3; }
/* The box shows focus itself (glow and border); no second outline inside it. */
.home2-ask-form textarea:focus, .home2-ask-form textarea:focus-visible { outline: none; box-shadow: none; }
.home2-ask-bar { display: flex; align-items: center; gap: 10px; }
.home2-ask-badge {
    display: inline-flex; align-items: center; justify-content: center; min-width: 30px; height: 22px; padding: 0 7px; border-radius: 999px;
    background: var(--home-blue); color: #fff; font: 700 12px/1 var(--ztc-font-sans, sans-serif); letter-spacing: .06em;
}
.home2-ask-note { flex: 1; color: #5B6F86; font-size: 13px; }
.home2-ask-send {
    display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border: 0; border-radius: 50%;
    background: var(--home-blue); color: #fff; cursor: pointer; transition: background-color .2s, transform .2s;
}
@media (hover: hover) { .home2-ask-send:hover { background: var(--ztc-action-hover, #0076BD); transform: translateY(-1px); } }
.home2-ask-send:focus-visible, .home2-ask-chips button:focus-visible, .home2-askstrip-form button:focus-visible { outline: 2px solid var(--home-blue); outline-offset: 3px; }
.home2-ask-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.home2-ask-chips button {
    min-height: 40px; padding: 8px 14px; border: 1px solid rgba(0, 103, 180, .18); border-radius: 999px; background: rgba(255, 255, 255, .86);
    color: var(--home-ink); font-size: 14px; cursor: pointer; transition: border-color .2s, color .2s;
}
@media (hover: hover) { .home2-ask-chips button:hover { border-color: var(--home-blue); color: var(--home-blue); } }
body.home .home2-hero.is-night .home2-ask-title { color: #EAF6FD; text-shadow: 0 2px 26px rgba(3, 22, 40, .42); }
body.home .home2-hero.is-night .home2-ask-title .home2-ask-l2 { color: var(--home-cyan); }
body.home .home2-hero.is-night .home2-ask-chips button { background: rgba(255, 255, 255, .1); border-color: rgba(234, 246, 253, .3); color: #EAF6FD; }
@media (prefers-reduced-motion: no-preference) {
    .home2-hero[data-hero-variant="ask"] .home2-ask-copy { animation: home2-ask-rise .6s ease-out both; }
    .home2-hero[data-hero-variant="ask"] .home2-ask-card { animation: home2-ask-rise .6s .12s ease-out both; }
}
@keyframes home2-ask-rise { from { opacity: 0; transform: translateY(10px); } }
@media (max-width: 900px) {
    .home2-hero[data-hero-variant="ask"] .home2-ask { grid-template-columns: 1fr; gap: 28px; }
    .home2-ask-title { font-size: clamp(36px, 10vw, 48px); }
}

/* The one-line ask box under the company section */
.home2-askstrip { padding: 0 0 72px; }
.home2-askstrip-inner {
    display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 20px 24px; background: var(--home-paper);
    border: 1px solid var(--home-line); border-radius: 20px;
}
.home2-askstrip-title { display: flex; align-items: center; gap: 10px; margin: 0; color: var(--home-ink); font-size: 17px; font-weight: 600; }
.home2-askstrip-form { display: flex; flex: 0 1 520px; gap: 10px; }
.home2-askstrip-form input {
    flex: 1; min-width: 0; height: 48px; padding: 0 16px; border: 1px solid var(--home-line); border-radius: 12px; background: #fff; color: var(--home-ink);
    font-size: 16px; outline: none; transition: border-color .2s, box-shadow .2s;
}
.home2-askstrip-form input:focus { border-color: var(--home-blue); box-shadow: 0 0 0 4px rgba(0, 142, 211, .12); }
.home2-askstrip-form button {
    height: 48px; padding: 0 22px; border: 0; border-radius: 12px; background: var(--home-blue); color: #fff; font-size: 15px; font-weight: 600; cursor: pointer;
}
@media (hover: hover) { .home2-askstrip-form button:hover { background: var(--ztc-action-hover, #0076BD); } }
@media (max-width: 760px) {
    .home2-askstrip { padding-bottom: 48px; }
    .home2-askstrip-inner { flex-direction: column; align-items: stretch; gap: 14px; padding: 18px 16px; }
    .home2-askstrip-title { font-size: 16px; }
    .home2-askstrip-form { flex-basis: auto; }
}
/* Brand line above the headline: “中兴新云 AI 智库 Beta” (Haning 10/20: name it 中兴新云 AI 智库 to show the AI label; “Beta”, not “公测中”) */
.home2-ask-brand { display: inline-flex; align-items: center; gap: 10px; margin: 0 0 24px; color: var(--home-ink); font-size: 16px; font-weight: 600; letter-spacing: .06em; }
.home2-ask-beta { display: inline-flex; align-items: center; height: 22px; padding: 0 9px; border: 1px solid rgba(0, 142, 211, .35); border-radius: 999px;
    color: var(--home-blue); font: 600 12px/1 var(--ztc-font-sans, sans-serif); letter-spacing: .04em; }
.home2-ask-copy .home2-hero-lead { max-width: 560px; }
body.home .home2-hero.is-night .home2-ask-brand { color: #EAF6FD; }
body.home .home2-hero.is-night .home2-ask-beta { color: var(--home-cyan); border-color: rgba(78, 215, 230, .45); }
@media (max-width: 900px) { .home2-ask-brand { margin-bottom: 18px; font-size: 15px; } }
@media (prefers-reduced-motion: reduce) { .home2-ask-slogan { transition: none; } }

/* Glow around the ask box (Haning 10/20 “像导航栏上那个‘智库’卡片四周会泛光晕一样”): the same brand-colour orbit as the header entry,
   always faintly on here and brighter while the reader points at or types in the box; still without motion for reduced-motion readers. */
@property --home2-ask-orbit { syntax: "<angle>"; initial-value: 0deg; inherits: false; }
@keyframes home2-ask-orbit { to { --home2-ask-orbit: 360deg; } }
.home2-ask-form { position: relative; isolation: isolate; }
.home2-ask-form::before, .home2-ask-form::after {
    content: ""; position: absolute; inset: -2px; z-index: -1; padding: 2px; border-radius: inherit; pointer-events: none;
    background: conic-gradient(from var(--home2-ask-orbit), var(--ztc-brand-primary, #008ED3), var(--ztc-brand-cyan, #4ED7E6), var(--ztc-brand-amber, #F5A623),
                var(--ztc-brand-navy, #0067B4), var(--ztc-brand-cyan, #4ED7E6), var(--ztc-brand-primary, #008ED3));
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0); -webkit-mask-composite: xor;
    mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0); mask-composite: exclude;
    opacity: .5; transition: opacity .3s ease; animation: home2-ask-orbit 6s linear infinite;
}
.home2-ask-form::before { inset: -7px; padding: 7px; filter: blur(12px); opacity: .38; }
.home2-ask-form:is(:hover, :focus-within)::after { opacity: 1; }
.home2-ask-form:is(:hover, :focus-within)::before { opacity: .7; }
@media (prefers-reduced-motion: reduce) { .home2-ask-form::before, .home2-ask-form::after { animation: none; } }
@media (forced-colors: active) { .home2-ask-form::before, .home2-ask-form::after { display: none; } }

/* Hero switch (Haning 10/20 “加一个小型的控制按钮，让它能够自主切换……自主切换这一点非常重要”“地图那边已经有一个控制按钮了”): same white
   pill as the globe's own controls; bottom centre of the hero on desktop, in both versions; hidden while the globe is full screen (the
   screen saver shows the globe only). */
.home2-hero-switch {
    position: absolute; z-index: 5; left: 50%; bottom: 26px; display: inline-flex; width: max-content; gap: 2px; padding: 2px; transform: translateX(-50%);
    border: 1px solid rgba(0, 103, 180, .1); border-radius: 999px; background: rgba(255, 255, 255, .9); box-shadow: 0 6px 18px rgba(10, 43, 76, .075);
    pointer-events: auto;
}
.home2-hero-switch button {
    display: inline-flex; align-items: center; gap: 6px; min-height: 40px; padding: 0 15px; border: 0; border-radius: 999px; background: transparent;
    color: #335071; font: 600 13px/1 var(--ztc-font-sans, sans-serif); white-space: nowrap; cursor: pointer; transition: background-color .2s, color .2s;
}
.home2-hero-switch button[aria-pressed="true"] { background: var(--home-blue); color: #fff; }
@media (hover: hover) { .home2-hero-switch button[aria-pressed="false"]:hover { color: var(--home-blue); } }
.home2-hero-switch button:focus-visible { outline: 2px solid var(--home-blue); outline-offset: 2px; }
.home2-hero-switch svg { width: 15px; height: 15px; flex: none; }
.home2-hero.is-globe-fullscreen .home2-hero-switch { display: none; }
body.home .home2-hero.is-night .home2-hero-switch { background: rgba(3, 21, 39, .82); border-color: rgba(197, 229, 255, .18); box-shadow: 0 6px 20px rgba(1, 8, 18, .22); }
body.home .home2-hero.is-night .home2-hero-switch button[aria-pressed="false"] { color: #C5E5FF; }
/* Phones and tablets: the switch follows the hero text, left-aligned with it, instead of floating at the bottom, so it never covers the ask
   box, the suggested questions or the floating 问智库 button (on tablets it sits between the text and the globe). */
@media (max-width: 991px) {
    .home2-hero-switch { position: relative; left: auto; bottom: auto; order: 1; align-self: flex-start; margin: 4px 0 28px 24px; transform: none; }
}
@media (max-width: 640px) {
    .home2-hero-switch { margin: -24px 0 36px 20px; }
}
/* On laptop screens the globe reaches the right edge and the floating 问智库 button (bottom right of the screen) covered the globe's
   full-screen control (seen on www.ztccloud.com.cn at 1440×900 and 1280×800); move the globe's controls left just enough (at most 60px was
   needed; R30 review S5), keeping them off the sphere as far as possible. */
@media (min-width: 992px) and (max-width: 1640px) {  /* up to 1640: short windows just above 1600 overlapped too (R30 review S4') */
    body.home .home2-hero:not(.is-globe-fullscreen) [data-global-globe] .gg-controls { right: calc(9% + 68px); }
}
/* Without scripts the switch and the ask strip cannot work: hidden (R30 review S7). Forced colours: the pressed version stays visible (S8). */
.home2-hero:not([data-hero-variant]) .home2-hero-switch, body:not(.home2-js) .home2-askstrip { display: none; }
@media (forced-colors: active) {
    .home2-hero-switch button[aria-pressed="true"] { forced-color-adjust: none; background: Highlight; color: HighlightText; }
}