/* SpeakMind — 东方水墨层 (Ink-wash treatment).
   ALL rules scoped under body.inkwash so it's a clean, reversible toggle.
   Additive only — turning it off restores the v1 "paper" look exactly.
   Restrained sumi-e: rough-edged ink washes (SVG turbulence), dry-brush
   dividers. Ink gray on paper, low opacity — evokes MiMo's eastern calm
   without copying its bamboo/koi imagery or branding. */

/* rough-edged ink wash blobs (warm ink-gray, multiply over paper) */
.inkwash .hero-stage::after {
  content: "";
  position: absolute; z-index: 0; pointer-events: none;
  top: -6%; right: -6%; width: 56%; height: 88%;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='700' height='560'%3E%3Cdefs%3E%3Cfilter id='f' x='-20%25' y='-20%25' width='140%25' height='140%25'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.011' numOctaves='4' seed='9' result='n'/%3E%3CfeDisplacementMap in='SourceGraphic' in2='n' scale='120'/%3E%3C/filter%3E%3CradialGradient id='g' cx='52%25' cy='46%25' r='55%25'%3E%3Cstop offset='0%25' stop-color='%23231d16' stop-opacity='0.55'/%3E%3Cstop offset='62%25' stop-color='%23231d16' stop-opacity='0.16'/%3E%3Cstop offset='100%25' stop-color='%23231d16' stop-opacity='0'/%3E%3C/radialGradient%3E%3C/defs%3E%3Cellipse cx='360' cy='270' rx='250' ry='180' fill='url(%23g)' filter='url(%23f)'/%3E%3C/svg%3E") no-repeat center / contain;
  opacity: .34; mix-blend-mode: multiply;
  -webkit-mask-image: linear-gradient(180deg, #000 72%, transparent);
  mask-image: linear-gradient(180deg, #000 72%, transparent);
}

/* dry-brush divider helper */
.inkwash .rule, .inkwash hr.rule {
  height: 9px; background: none; position: relative; border: none;
}
.inkwash .rule::before {
  content: ""; position: absolute; inset: 0;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1200' height='9' preserveAspectRatio='none'%3E%3Cdefs%3E%3Cfilter id='r'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.7 0.5' numOctaves='2' seed='4' result='n'/%3E%3CfeDisplacementMap in='SourceGraphic' in2='n' scale='9'/%3E%3C/filter%3E%3C/defs%3E%3Crect x='0' y='4' width='1200' height='2' fill='%231c1813' filter='url(%23r)'/%3E%3C/svg%3E") no-repeat center / 100% 100%;
  opacity: .4;
}

/* ink wash painted behind each feature product card (MiMo's bamboo-behind-terminal move, abstracted) */
.inkwash .feat-vis::before {
  content: "";
  position: absolute; z-index: -1; pointer-events: none;
  inset: -16% -14% -20% -16%;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='620' height='560'%3E%3Cdefs%3E%3Cfilter id='f' x='-25%25' y='-25%25' width='150%25' height='150%25'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.013' numOctaves='4' seed='3' result='n'/%3E%3CfeDisplacementMap in='SourceGraphic' in2='n' scale='110'/%3E%3C/filter%3E%3CradialGradient id='g' cx='44%25' cy='52%25' r='56%25'%3E%3Cstop offset='0%25' stop-color='%231c1813' stop-opacity='0.5'/%3E%3Cstop offset='64%25' stop-color='%231c1813' stop-opacity='0.14'/%3E%3Cstop offset='100%25' stop-color='%231c1813' stop-opacity='0'/%3E%3C/radialGradient%3E%3C/defs%3E%3Cellipse cx='300' cy='290' rx='240' ry='190' fill='url(%23g)' filter='url(%23f)'/%3E%3C/svg%3E") no-repeat center / contain;
  opacity: .3; mix-blend-mode: multiply;
}
.inkwash .feat-vis { overflow: visible; }
.inkwash .feat-vis > * { position: relative; }

/* dark band (speed race) — light ink wash on ink, + dry-brush top edge */
.inkwash .band-ink { position: relative; overflow: hidden; }
.inkwash .band-ink::before {
  content: "";
  position: absolute; z-index: 0; pointer-events: none;
  bottom: -10%; left: -8%; width: 60%; height: 120%;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='760' height='620'%3E%3Cdefs%3E%3Cfilter id='f' x='-20%25' y='-20%25' width='140%25' height='140%25'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.01' numOctaves='4' seed='12' result='n'/%3E%3CfeDisplacementMap in='SourceGraphic' in2='n' scale='130'/%3E%3C/filter%3E%3CradialGradient id='g' cx='50%25' cy='50%25' r='55%25'%3E%3Cstop offset='0%25' stop-color='%23f2ead9' stop-opacity='0.5'/%3E%3Cstop offset='66%25' stop-color='%23f2ead9' stop-opacity='0.12'/%3E%3Cstop offset='100%25' stop-color='%23f2ead9' stop-opacity='0'/%3E%3C/radialGradient%3E%3C/defs%3E%3Cellipse cx='380' cy='310' rx='280' ry='210' fill='url(%23g)' filter='url(%23f)'/%3E%3C/svg%3E") no-repeat center / contain;
  opacity: .24;
}
.inkwash .band-ink .wrap { position: relative; z-index: 1; }

/* AI Auto-Edits raw panel — faint ink wash to echo "thinking on paper" */
.inkwash .ae-panel.raw { position: relative; overflow: hidden; }
.inkwash .ae-panel.raw::after {
  content: "";
  position: absolute; z-index: 0; pointer-events: none;
  right: -14%; top: -20%; width: 64%; height: 140%;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='520' height='520'%3E%3Cdefs%3E%3Cfilter id='f' x='-25%25' y='-25%25' width='150%25' height='150%25'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.015' numOctaves='3' seed='21' result='n'/%3E%3CfeDisplacementMap in='SourceGraphic' in2='n' scale='90'/%3E%3C/filter%3E%3CradialGradient id='g' cx='50%25' cy='50%25' r='55%25'%3E%3Cstop offset='0%25' stop-color='%23231d16' stop-opacity='0.45'/%3E%3Cstop offset='66%25' stop-color='%23231d16' stop-opacity='0.12'/%3E%3Cstop offset='100%25' stop-color='%23231d16' stop-opacity='0'/%3E%3C/radialGradient%3E%3C/defs%3E%3Cellipse cx='260' cy='260' rx='190' ry='170' fill='url(%23g)' filter='url(%23f)'/%3E%3C/svg%3E") no-repeat center / contain;
  opacity: .18; mix-blend-mode: multiply;
}
.inkwash .ae-panel.raw > * { position: relative; z-index: 1; }

/* CTA footer — a single calm wash behind the headline */
.inkwash .cta { position: relative; }
.inkwash .cta::before {
  content: "";
  position: absolute; z-index: 0; pointer-events: none;
  left: 50%; top: 38%; transform: translate(-50%, -50%);
  width: min(680px, 80%); height: 360px;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='700' height='420'%3E%3Cdefs%3E%3Cfilter id='f' x='-20%25' y='-20%25' width='140%25' height='140%25'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.012' numOctaves='4' seed='33' result='n'/%3E%3CfeDisplacementMap in='SourceGraphic' in2='n' scale='110'/%3E%3C/filter%3E%3CradialGradient id='g' cx='50%25' cy='50%25' r='52%25'%3E%3Cstop offset='0%25' stop-color='%23231d16' stop-opacity='0.4'/%3E%3Cstop offset='64%25' stop-color='%23231d16' stop-opacity='0.1'/%3E%3Cstop offset='100%25' stop-color='%23231d16' stop-opacity='0'/%3E%3C/radialGradient%3E%3C/defs%3E%3Cellipse cx='350' cy='210' rx='300' ry='150' fill='url(%23g)' filter='url(%23f)'/%3E%3C/svg%3E") no-repeat center / contain;
  opacity: .16; mix-blend-mode: multiply;
}
.inkwash .cta > * { position: relative; z-index: 1; }

/* eyebrow dash → a tiny dry-brush stroke for the eastern accent */
.inkwash .eyebrow[data-no]::after {
  height: 3px; width: 30px; border-radius: 0;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='5' preserveAspectRatio='none'%3E%3Cdefs%3E%3Cfilter id='r'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9 0.6' numOctaves='2' seed='6' result='n'/%3E%3CfeDisplacementMap in='SourceGraphic' in2='n' scale='4'/%3E%3C/filter%3E%3C/defs%3E%3Crect x='0' y='1' width='40' height='3' fill='%23d9481f' filter='url(%23r)'/%3E%3C/svg%3E") no-repeat center / 100% 100%;
}

/* reduce wash strength a touch on small screens (perf + clarity) */
@media (max-width: 640px) {
  .inkwash .hero-stage::after, .inkwash .feat-vis::before { opacity: .22; }
}
@media (prefers-reduced-motion: reduce) {
  .inkwash .hero-stage::after { opacity: .28; }
}