/* 首页关键词：独立主题摄影、墨绿渐层与可展开的解释。 */
.vision-story.future-overview { margin-bottom: 28px; }
.future-overview > .vision-chapter { padding: 28px 0 8px; }

.future-keywords {
  width: calc(100% - 112px);
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 0 28px;
  font-family: Taipei, 'PingFang SC', 'Microsoft YaHei', sans-serif;
}

.future-card-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
}

.future-card {
  --card-image: url('assets/关键词-意图生成.jpg');
  --card-position: 50% 50%;
  --card-filter: grayscale(.72) sepia(.24) hue-rotate(76deg) saturate(1.02) contrast(1.08) brightness(.98);
  appearance: none;
  display: block;
  position: relative;
  isolation: isolate;
  width: 100%;
  min-width: 0;
  height: 432px;
  margin: 0;
  padding: 0;
  overflow: hidden;
  border: 0;
  border-radius: 30px;
  background: #0a1d13;
  color: #fff;
  font-family: Taipei, 'PingFang SC', 'Microsoft YaHei', sans-serif;
  text-align: left;
  cursor: pointer;
  box-shadow: 0 8px 25px rgb(15 37 23 / 4%);
  transition: transform 220ms ease, box-shadow 220ms ease;
  -webkit-tap-highlight-color: transparent;
}

.future-card-image {
  position: absolute;
  inset: -1px;
  z-index: 0;
  display: block;
  background-image: var(--card-image);
  background-size: cover;
  background-position: var(--card-position);
  filter: var(--card-filter);
  transform: scale(1.015);
  transition: transform 500ms ease, filter 400ms ease;
  pointer-events: none;
}

.future-card::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    linear-gradient(180deg, rgb(6 25 15 / 10%) 0%, transparent 24%, rgb(8 29 19 / 24%) 42%, rgb(7 25 17 / 83%) 62%, #071911 91%),
    linear-gradient(110deg, rgb(46 79 54 / 9%), transparent 62%);
  pointer-events: none;
}

.future-card-grain {
  position: absolute;
  inset: 0;
  z-index: 2;
  display: block;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  background-size: 180px 180px;
  opacity: .065;
  mix-blend-mode: soft-light;
  filter: grayscale(1);
  pointer-events: none;
}

.future-card-top {
  position: absolute;
  top: 27px;
  left: 30px;
  right: 27px;
  z-index: 3;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 15px;
  color: #fff;
  text-shadow: 0 1px 8px rgb(0 0 0 / 32%);
}

.future-card-number { font-size: 11px; font-weight: 400; letter-spacing: .12em; }
.future-card-symbol {
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  border-radius: 14px;
  background: rgb(16 39 26 / 30%);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  color: #fff;
  font-size: 20px;
  line-height: 1;
  transition: background-color 180ms ease, transform 180ms ease;
}

.future-card-copy {
  position: absolute;
  z-index: 3;
  right: 30px;
  bottom: 103px;
  left: 30px;
  display: block;
  pointer-events: none;
}

.future-card-en {
  display: block;
  margin-bottom: 11px;
  color: rgb(235 245 232 / 78%);
  font-size: 11px;
  font-weight: 400;
  letter-spacing: .12em;
  line-height: 1.65;
  text-transform: uppercase;
}

.future-card-title {
  display: block;
  margin: 0;
  color: #fff;
  font-size: 39px;
  font-weight: 700;
  line-height: 1.24;
  letter-spacing: -.045em;
  text-wrap: balance;
}

.future-card-summary {
  display: block;
  max-width: 24em;
  margin-top: 14px;
  color: rgb(240 247 236 / 82%);
  font-size: 13px;
  font-weight: 400;
  line-height: 1.85;
  letter-spacing: .005em;
}

.future-card-cta {
  position: absolute;
  bottom: 29px;
  left: 30px;
  right: 30px;
  z-index: 3;
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  min-height: 46px;
  padding: 12px 22px;
  border-radius: 999px;
  background: #fff;
  color: #183924;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.5;
  transition: background-color 180ms ease, transform 180ms ease;
}

.future-card[data-concept='intent'] { --card-image:url('assets/关键词-意图生成.jpg'); --card-position:48% 56%; }
.future-card[data-concept='symbiosis'] { --card-image:url('assets/关键词-人机共生.jpg'); --card-position:52% 40%; --card-filter:grayscale(.78) sepia(.3) hue-rotate(76deg) saturate(1.1) contrast(1.09) brightness(.94); }
.future-card[data-concept='prior'] { --card-image:url('assets/关键词-意图先验.jpg'); --card-position:42% 35%; --card-filter:grayscale(.95) sepia(.27) hue-rotate(74deg) saturate(.85) contrast(1.04); }
.future-card[data-concept='routing'] { --card-image:url('assets/关键词-任务调度.jpg'); --card-position:53% 36%; --card-filter:grayscale(.72) sepia(.27) hue-rotate(76deg) saturate(1.15) contrast(1.12) brightness(.98); }
.future-card[data-concept='evolution'] { --card-image:url('assets/关键词-非线性演化.jpg'); --card-position:64% 34%; --card-filter:grayscale(.55) sepia(.2) hue-rotate(76deg) saturate(.9) contrast(1.06) brightness(1.12); }
.future-card[data-concept='compound'] { --card-image:url('assets/关键词-智能复利.jpg'); --card-position:50% 77%; --card-filter:grayscale(1) sepia(.34) hue-rotate(73deg) saturate(1.1) contrast(1.04); }

/* 静态细点阵只覆盖照片的局部，文字区域保持干净。 */
.future-card::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 2;
  background-image: radial-gradient(circle, rgb(211 247 216 / 78%) .65px, transparent .95px);
  background-size: 4px 4px;
  mask-image: linear-gradient(145deg, transparent 9%, #000 32%, transparent 69%);
  opacity: .18;
  mix-blend-mode: screen;
  pointer-events: none;
  transition: opacity 300ms ease;
}
@media (hover:hover) {
  .future-card:hover::after { opacity: .28; }
  .future-card:hover .future-card-image { filter: var(--card-filter) brightness(1.06); }
}

.future-card:focus-visible {
  outline: 3px solid #2d664b;
  outline-offset: 5px;
}

@media (hover: hover) {
  .future-card:hover { transform: translateY(-4px); box-shadow: 0 17px 36px rgb(15 37 23 / 12%); }
  .future-card:hover .future-card-image { transform: scale(1.055); }
  .future-card:hover .future-card-symbol { background: rgb(255 255 255 / 22%); transform: translate(1px, -1px); }
  .future-card:hover .future-card-cta { background: #edf5e8; }
}
.future-card:active { transform: translateY(-1px); }

/* 解释弹窗不承载摄影纹理，保证连续文字阅读。 */
body:has(.future-dialog[open]) { overflow: hidden; }
dialog.future-dialog {
  width: calc(100% - 64px);
  max-width: 760px;
  max-height: 85vh;
  max-height: 85dvh;
  margin: auto;
  padding: 0;
  border: 0;
  border-radius: 28px;
  background: #fff;
  color: #38463c;
  overflow: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  scrollbar-color: #c5d4c4 transparent;
  box-shadow: 0 30px 100px rgb(8 28 16 / 22%);
  font-family: Taipei, 'PingFang SC', 'Microsoft YaHei', sans-serif;
}
dialog.future-dialog::backdrop {
  background: rgb(15 35 22 / 38%);
  backdrop-filter: blur(7px);
  -webkit-backdrop-filter: blur(7px);
}
.future-dialog-inner { position: relative; padding: 44px; }
.future-dialog-close {
  position: absolute;
  top: 20px;
  right: 20px;
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: #f1f5ef;
  color: #5b7461;
  font-size: 27px;
  font-weight: 400;
  line-height: 1;
  cursor: pointer;
  transition: background-color 180ms ease, color 180ms ease;
}
.future-dialog-close:hover { background: #e3eddf; color: #244e32; }
.future-dialog-header { margin-bottom: 28px; padding-right: 28px; }
.future-dialog-index { color: #699170; font-size: 12px; font-weight: 700; line-height: 1.7; letter-spacing: .055em; }
dialog.future-dialog #future-dialog-title {
  margin: 13px 0 16px;
  color: #264f35;
  font-size: 35px;
  font-weight: 700;
  line-height: 1.35;
  letter-spacing: -.035em;
}
dialog.future-dialog #future-dialog-lead { margin: 0; color: #617365; font-size: 16px; line-height: 1.95; }
#future-dialog-body > p { margin: 0 0 19px; color: #667069; font-size: 16px; line-height: 2; }
#future-dialog-body h3 { margin: 28px 0 12px; color: #345d3f; font-size: 20px; font-weight: 700; line-height: 1.6; }
#future-dialog-body ul { margin: 14px 0 23px; padding-left: 23px; color: #667069; font-size: 15px; line-height: 1.95; }
#future-dialog-body li { padding-left: 3px; margin: 8px 0; }
#future-dialog-body li::marker { color: #89a387; }
#future-dialog-body strong { color: #31583d; font-weight: 700; }
.future-dialog-example { margin: 26px 0; padding: 24px 26px; border-radius: 18px; background: #eef5eb; }
.future-dialog-example > span { display: block; margin-bottom: 11px; color: #5e7e60; font-size: 12px; font-weight: 700; line-height: 1.7; }
.future-dialog-example > p { margin: 0; color: #5f735f; font-size: 15px; line-height: 1.95; }
.future-dialog-footer { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-top: 31px; padding-top: 25px; border-top: 1px solid #edf2eb; }
.future-dialog-footer > span { color: #91a08f; font-size: 12px; line-height: 1.8; }
.future-dialog-dismiss { flex: none; min-height: 43px; padding: 11px 24px; border: 0; border-radius: 999px; background: #2d664b; color: #fff; font-size: 13px; font-weight: 700; line-height: 1.6; cursor: pointer; transition: background-color 180ms ease; }
.future-dialog-dismiss:hover { background: #214f36; }
.future-dialog-close:focus-visible, .future-dialog-dismiss:focus-visible { outline: 3px solid #89ac8a; outline-offset: 4px; }

@media (min-width: 801px) and (max-width: 1100px) {
  .future-card-grid { gap: 18px; }
  .future-card { height: 418px; border-radius: 27px; }
  .future-card-top { top: 24px; left: 25px; right: 23px; }
  .future-card-copy { left: 25px; right: 25px; bottom: 99px; }
  .future-card-title { font-size: 32px; }
  .future-card-en { font-size: 10px; margin-bottom: 12px; letter-spacing: .05em; }
  .future-card-summary { font-size: 12px; line-height: 1.85; margin-top: 13px; }
  .future-card-cta { bottom: 27px; left: 25px; right: 25px; min-height: 42px; padding: 10px 20px; }
}

@media (prefers-reduced-motion: reduce) {
  .future-card, .future-card::after, .future-card-image, .future-card-symbol, .future-card-cta, .future-dialog-close, .future-dialog-dismiss { transition: none; }
  .future-card:hover, .future-card:active, .future-card:hover .future-card-symbol { transform: none; }
  .future-card:hover .future-card-image { transform: scale(1.015); }
}

/* 首页按未来、企业、基础设施、落地方式、当前实践依次展开。 */
.home-chapter { width:calc(100% - 112px);max-width:1280px;margin:0 auto;padding:68px 0; }
.home-chapter .future-keywords { width:100%;max-width:none;padding:0;margin:36px 0 0; }
.home-chapter strong { color:#2b4c37; }
.home-chapter .future-card-title { color:#fff; }
.home-vision-statement { display:grid;grid-template-columns:130px 1fr;gap:28px;margin-top:38px;padding:28px 0 0; }
.home-vision-statement>span { font-size:14px;font-weight:700;color:#53725b;padding-top:3px; }
.home-vision-statement p { font-size:17px;line-height:1.9;color:#738075;margin:0;max-width:920px; }
.enterprise-symbiosis { margin:42px 0 28px; }
.enterprise-symbiosis>h3 { font-size:28px;line-height:1.5;margin-bottom:24px; }
.enterprise-prior>div { padding-top:30px; }
.enterprise-prior .prior-example { background:white; }
.future-infrastructure { padding-top:48px; }
.kernel-access { display:grid;grid-template-columns:1fr 1fr;gap:26px;margin-top:38px; }
.kernel-access article { padding:38px 40px;border-radius:26px;background:#eaf2e6; }
.kernel-access article:first-child { background:#244c37;color:white; }
.kernel-access article>span { font-size:12px;font-weight:700;letter-spacing:.06em;opacity:.68; }
.kernel-access h3 { font-size:36px;line-height:1.5;margin:22px 0 16px; }
.kernel-access p { font-size:17px;line-height:1.95;margin:0;color:#637563; }
.kernel-access article:first-child p { color:#e1eadf; }
.method-practice { display:grid;grid-template-columns:1fr 1fr;gap:44px;margin-top:40px; }
.method-practice h3 { font-size:23px;margin-bottom:14px; }
.method-practice p { font-size:16px;line-height:1.95;color:#6c786e;margin:0; }
.method-loop { background:#f2f6ef;border-radius:22px;padding:27px 34px;margin:32px 0 0; }
.method-loop strong,.method-loop span { display:block; }
.method-loop strong { font-size:20px;line-height:1.7; }
.method-loop span { color:#75816f;font-size:15px;margin-top:8px; }
.current-practice-grid { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin:36px 0; }
.current-practice-grid article { display:flex;flex-direction:column;padding:30px;background:#f3f6f1;border-radius:24px; }
.current-practice-grid article>span { color:#739076;font-size:13px;font-weight:700; }
.current-practice-grid h3 { font-size:23px;line-height:1.5;margin:20px 0 15px; }
.current-practice-grid p { font-size:15px;line-height:1.95;color:#6c786e;margin-bottom:24px; }
.current-practice-grid .text-button { margin-top:auto;align-self:flex-start;color:#315c40;font-weight:700; }
.future-practice { padding-bottom:28px; }
@media(min-width:801px) and (max-width:1100px){.home-chapter{padding:52px 0}.kernel-access article{padding:30px}.kernel-access h3{font-size:30px}.current-practice-grid{gap:18px}.current-practice-grid article{padding:24px}.current-practice-grid h3{font-size:21px}.method-loop strong{font-size:18px}}
