/* Generated file. Source: shared/brand/styles/web-home.css. Do not edit directly. Run: node tools/brand/sync-shared-brand.mjs */
:root{
  --hero-scan-on: 3px;
  --hero-scan-off: 3px;
  --fz-body: 16px;
  --fz-body-lg: 17px;
  --fz-body-sm: 14.5px;
  --fz-body-xs: 13.5px;
  --fz-prod-title: 36px;
  --fz-svc-num: 9.5px;
  --fz-svc-name: 22px;
  --fz-svc-desc: 13px;
  --prod-logo-width: 78%;
  --prod-logo-box: 152px;
  --prod-head-h: 140px;
  --prod-foot-h: 184px;
}

/* —— HERO —— */
#hero{
  min-height:100dvh;padding-top:56px;
  display:grid;grid-template-rows:1fr auto;
  position:relative;z-index:1;
}

.hero-body{
  display:grid;grid-template-columns:1fr 1fr;
  border-bottom:1px solid var(--line);
}

.hero-left{
  padding:72px 52px 72px 40px;
  display:flex;flex-direction:column;justify-content:flex-end;
  border-right:1px solid var(--line);
  position:relative;overflow:hidden;
}

/* corner bracket decoration */
.hero-left::before{
  content:'';
  position:absolute;top:40px;left:40px;
  width:32px;height:32px;
  border-top:1px solid var(--R);
  border-left:1px solid var(--R);
  opacity:0.6;
}
.hero-left::after{
  content:'';
  position:absolute;bottom:40px;right:52px;
  width:24px;height:24px;
  border-bottom:1px solid var(--B);
  border-right:1px solid var(--B);
  opacity:0.4;
}

/* glitch title */
.hero-h1{
  font-family:var(--font-hero) !important;
  font-size:clamp(52px,9.6vw,132px);
  font-weight:700;line-height:.84;letter-spacing:-.05em;
  margin-bottom:20px;
  position:relative;
  text-transform:uppercase;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
}
.hero-h1 > div{white-space:nowrap;display:block;width:100%}
.hero-h1 .line1,
.hero-h1 .line2{
  font-weight:700;
  color:transparent;
  -webkit-text-fill-color:transparent;
  background-image:repeating-linear-gradient(
    0deg,
    rgba(232,230,224,0.98) 0px,
    rgba(232,230,224,0.98) var(--hero-scan-on),
    rgba(232,230,224,0.28) var(--hero-scan-on),
    rgba(232,230,224,0.28) calc(var(--hero-scan-on) + var(--hero-scan-off))
  );
  background-size:100% calc(var(--hero-scan-on) + var(--hero-scan-off));
  -webkit-background-clip:text;
  background-clip:text;
  text-shadow:0 0 24px rgba(232,230,224,0.2);
  display:inline-block;
  transform:scaleX(0.85);
  transform-origin:left center;
}
.hero-h1 .line3{
  color:transparent;
  font-weight:700;
  -webkit-text-stroke:2px var(--R);
  position:relative;
  display:inline-block;
  transform:scaleX(0.85);
  transform-origin:left center;
  text-shadow:0 0 12px rgba(239,39,6,0.25);
}
/* glitch effect on line3 */
.hero-h1 .line3::before{
  content:attr(data-text);
  position:absolute;left:2px;top:0;
  color:var(--R);clip-path:polygon(0 20%,100% 20%,100% 40%,0 40%);
  animation:glitch1 4s steps(1) infinite;
  opacity:0;
}
.hero-h1 .line3::after{
  content:attr(data-text);
  position:absolute;left:-2px;top:0;
  color:var(--B);clip-path:polygon(0 60%,100% 60%,100% 80%,0 80%);
  animation:glitch2 4s steps(1) infinite;
  opacity:0;
}
@keyframes glitch1{0%,89%{opacity:0}90%{opacity:1;transform:translateX(3px)}91%,100%{opacity:0}}
@keyframes glitch2{0%,91%{opacity:0}92%{opacity:1;transform:translateX(-2px)}93%,100%{opacity:0}}

.hero-slogan{
  font-size:9px;letter-spacing:.28em;text-transform:uppercase;
  color:var(--muted);margin-bottom:48px;
  padding-top:20px;border-top:1px solid var(--line);
  display:flex;align-items:center;gap:8px;
  font-weight:400;
}
.slogan-mark{width:12px;height:1px}

.hero-desc{
  font-size:var(--fz-body-lg);line-height:1.9;color:var(--muted);font-weight:300;
  max-width:430px;margin-bottom:40px;
}

.hero-btns{display:flex;gap:12px;flex-wrap:wrap}
.hero-meta-link{
  margin-top:18px;
  font-size:8px;
  letter-spacing:.2em;
  text-transform:uppercase;
}
.hero-meta-link a{
  color:var(--muted);
  text-decoration:none;
  border-bottom:1px solid var(--line);
  padding-bottom:2px;
  transition:color .2s,border-color .2s;
}
.hero-meta-link a:hover{color:var(--text);border-color:var(--text)}

/* hero right — dynamic calibration panel */
.hero-right{
  display:block;
  padding:20px;
  position:relative;
  align-content:end;
  background:
    radial-gradient(circle at 75% 18%,rgba(7,137,210,0.1),transparent 34%),
    radial-gradient(circle at 18% 82%,rgba(239,39,6,0.08),transparent 36%),
    linear-gradient(180deg,rgba(255,255,255,0.015),transparent 48%),
    linear-gradient(135deg,rgba(7,137,210,0.03),rgba(239,39,6,0.02));
}
.hero-calibration-panel{
  position:relative;
  min-height:360px;
  border:1px solid var(--line);
  overflow:hidden;
  background:
    linear-gradient(180deg,rgba(255,255,255,0.03),rgba(255,255,255,0.01)),
    repeating-linear-gradient(0deg,rgba(255,255,255,0.015) 0,rgba(255,255,255,0.015) 1px,transparent 1px,transparent 8px),
    linear-gradient(135deg,rgba(10,10,12,0.92),rgba(16,16,20,0.88));
  box-shadow:inset 0 0 0 1px rgba(7,137,210,0.06);
}
.hero-calibration-panel::before{
  content:'';
  position:absolute;inset:0;
  background:
    linear-gradient(90deg,rgba(255,255,255,0.02) 1px,transparent 1px),
    linear-gradient(0deg,rgba(255,255,255,0.015) 1px,transparent 1px);
  background-size:42px 42px,42px 42px;
  opacity:.28;
  pointer-events:none;
}
.hero-calibration-panel::after{
  content:'';
  position:absolute;left:-10%;right:-10%;top:-20%;
  height:56px;
  background:linear-gradient(180deg,transparent,rgba(255,255,255,0.08),transparent);
  opacity:.4;
  animation:panelScan 8s ease-in-out infinite;
  pointer-events:none;
}
.hero-calibration-header{
  position:absolute;top:16px;left:18px;right:18px;
  display:flex;justify-content:space-between;align-items:center;
  z-index:2;
  font-size:8px;letter-spacing:.24em;text-transform:uppercase;
  color:var(--muted);
}
.hero-calibration-status{
  display:inline-flex;align-items:center;gap:8px;
}
.hero-calibration-status::before{
  content:'';
  width:7px;height:7px;border-radius:50%;
  background:var(--G);
  box-shadow:0 0 12px rgba(67,163,22,0.6);
  animation:statusPulse 2.8s ease-in-out infinite;
}
.hero-calibration-grid{
  position:absolute;left:18px;bottom:22px;
  display:grid;
  grid-template-columns:repeat(4,42px);
  gap:7px;
  z-index:2;
}
.hero-calibration-swatch{
  width:42px;height:30px;border:1px solid rgba(255,255,255,0.08);
  background:var(--swatch);
  box-shadow:inset 0 0 0 1px rgba(10,10,12,0.35);
  animation:swatchPulse 7s ease-in-out infinite;
  animation-delay:var(--delay,0s);
  transition:transform .3s ease,filter .3s ease,border-color .3s ease;
}
.hero-calibration-panel:hover .hero-calibration-swatch{
  transform:translateY(-2px);
  filter:saturate(1.12);
  border-color:rgba(255,255,255,0.16);
}
.hero-calibration-chart{
  position:absolute;top:64px;right:26px;bottom:72px;left:210px;
  min-width:220px;
  z-index:2;
}
.hero-calibration-chart svg{
  width:100%;height:100%;
  overflow:visible;
}
.hero-calibration-chart .chart-grid{
  stroke:rgba(255,255,255,0.08);
  stroke-width:1;
}
.hero-calibration-chart .chart-axis{
  stroke:rgba(255,255,255,0.14);
  stroke-width:1.2;
}
.hero-calibration-chart .chart-line-a,
.hero-calibration-chart .chart-line-b{
  fill:none;
  stroke-linecap:round;
  stroke-linejoin:round;
  stroke-width:2.4;
}
.hero-calibration-chart .chart-line-a{
  stroke:rgba(239,39,6,0.88);
  stroke-dasharray:6 10;
  animation:dashDrift 12s linear infinite;
}
.hero-calibration-chart .chart-line-b{
  stroke:rgba(7,137,210,0.92);
  stroke-dasharray:14 8;
  animation:dashDrift 14s linear infinite reverse;
}
.hero-calibration-chart .chart-node{
  fill:var(--Y);
  stroke:#0A0A0C;
  stroke-width:1.2;
  animation:nodePulse 3.8s ease-in-out infinite;
}
.hero-calibration-chart .chart-node.alt{
  fill:var(--B);
  animation-delay:1.2s;
}
.hero-calibration-label{
  position:absolute;
  font-size:8px;letter-spacing:.22em;text-transform:uppercase;
  color:var(--muted);
  z-index:2;
}
.hero-calibration-label.red{color:rgba(239,39,6,0.8)}
.hero-calibration-label.blue{color:rgba(7,137,210,0.85)}
.hero-calibration-label.green{color:rgba(67,163,22,0.85)}
.hero-calibration-label.profile{top:84px;left:24px}
.hero-calibration-label.linearize{right:28px;top:88px}
.hero-calibration-label.gamut{right:30px;bottom:42px}
.hero-calibration-legend{
  position:absolute;right:24px;bottom:22px;
  display:flex;flex-direction:column;gap:6px;
  z-index:2;
}
.hero-calibration-legend span{
  font-size:7.5px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--muted);
}
@keyframes panelScan{
  0%,100%{transform:translateY(-120px);opacity:.18}
  45%{transform:translateY(130px);opacity:.42}
  70%{transform:translateY(220px);opacity:.08}
}
@keyframes statusPulse{
  0%,100%{transform:scale(1);opacity:.8}
  50%{transform:scale(1.35);opacity:1}
}
@keyframes swatchPulse{
  0%,100%{filter:brightness(1) saturate(1)}
  50%{filter:brightness(1.12) saturate(1.06)}
}
@keyframes dashDrift{
  from{stroke-dashoffset:0}
  to{stroke-dashoffset:-120}
}
@keyframes nodePulse{
  0%,100%{transform:scale(1);opacity:.84}
  50%{transform:scale(1.18);opacity:1}
}

/* stats bar */
.hero-stats{
  display:grid;grid-template-columns:repeat(3,1fr);
  border-top:1px solid var(--line);
}
.hstat{
  padding:16px 24px;border-right:1px solid var(--line);
  display:flex;align-items:center;gap:10px;
  position:relative;overflow:hidden;transition:background .2s;
}
.hstat:last-child{border-right:none}
.hstat:hover{background:rgba(255,255,255,0.02)}
.hstat::before{
  content:'';position:absolute;top:0;left:0;right:0;height:1px;
  transform:scaleX(0);transform-origin:left;transition:transform .4s ease;
}
.hstat:hover::before{transform:scaleX(1)}
.hstat:nth-child(1)::before{background:var(--R)}
.hstat:nth-child(2)::before{background:var(--Y)}
.hstat:nth-child(3)::before{background:var(--B)}
.hstat:nth-child(4)::before{background:var(--G)}
.hstat-n{font-family:'Bebas Neue',sans-serif;font-size:34px;font-weight:700;letter-spacing:.02em}

/* —— HERO PHASE 1 —— */
#hero{
  min-height:100dvh;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:72px 0 0;
  border-bottom:1px solid var(--line);
  background:
    radial-gradient(circle at 50% 18%,rgba(255,255,255,0.045),transparent 32%),
    radial-gradient(circle at 16% 24%,rgba(239,39,6,0.08),transparent 26%),
    radial-gradient(circle at 84% 24%,rgba(7,137,210,0.09),transparent 28%),
    linear-gradient(180deg,rgba(255,255,255,0.015),transparent 26%);
  overflow:hidden;
}
.hero-poster{
  position:relative;
  width:min(1180px,calc(100% - 56px));
  min-height:calc(100dvh - 104px);
  padding:86px 40px 74px;
  display:flex;
  align-items:center;
  justify-content:center;
}
.hero-poster::before{
  content:'';
  position:absolute;
  inset:20px;
  border:1px solid rgba(255,255,255,0.04);
  pointer-events:none;
}
.hero-poster::after{
  content:'';
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg,rgba(255,255,255,0.03) 1px,transparent 1px),
    linear-gradient(0deg,rgba(255,255,255,0.022) 1px,transparent 1px);
  background-size:56px 56px;
  opacity:.12;
  mask-image:radial-gradient(circle at 50% 48%,rgba(0,0,0,0.9) 0%,rgba(0,0,0,0.78) 48%,transparent 82%);
  pointer-events:none;
}
.hero-center{
  position:relative;
  z-index:2;
  max-width:780px;
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
}
.hero-copy{
  max-width:560px;
  margin:24px auto 0;
  display:flex;
  flex-direction:column;
  gap:10px;
}
.hero-pledge{
  margin:0;
  font-size:18px;
  line-height:1.75;
  color:var(--text);
}
.hero-positioning{
  margin:0;
  font-size:15px;
  line-height:1.9;
  color:var(--muted);
}
.hero-btns{
  justify-content:center;
  margin-top:28px;
}
.hero-meta-link{
  margin-top:18px;
  text-align:center;
}
.hero-target-window,
.hero-linear-stack,
.hero-gamut-frame{
  width:100%;
  max-width:152px;
  margin:auto;
}
.hero-orbit{
  --hero-orbit-scale:1;
  --hero-orbit-canvas-bottom-inset:0px;
  --hero-orbit-canvas-inline-inset:0px;
  --hero-orbit-status-code-letter-spacing:.12em;
}
.hero-orbit-canvas{
  width:100%;
  margin-inline:0;
  height:100%;
  min-height:0;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  padding-inline:var(--hero-orbit-canvas-inline-inset);
  padding-bottom:var(--hero-orbit-canvas-bottom-inset);
  box-sizing:border-box;
}
.hero-orbit-canvas > *{
  min-width:0;
}
  .hero-target-window{
    border:1px solid rgba(255,255,255,0.08);
    background:rgba(255,255,255,0.015);
  }
.hero-target-toolbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  padding:7px 9px;
  border-bottom:1px solid rgba(255,255,255,0.08);
  font-size:6.5px;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--muted);
}
.hero-target-dots{
  display:flex;
  gap:4px;
}
.hero-target-dots span{
  width:5px;
  height:5px;
  border-radius:50%;
  background:rgba(255,255,255,0.18);
}
.hero-target-grid{
  display:grid;
  grid-template-columns:repeat(8,1fr);
  gap:1.5px;
  padding:6px 6px 5px;
}
.hero-target-chip{
  aspect-ratio:1/1;
  background:var(--chip);
  border:1px solid rgba(255,255,255,0.06);
  box-shadow:inset 0 0 0 1px rgba(10,10,12,0.22);
  animation:targetChipPulse 8s ease-in-out infinite;
  animation-delay:var(--delay,0s);
}
.hero-target-chip.neutral{
  opacity:.96;
}
.hero-target-chip.skin{
  filter:saturate(.92);
}
.hero-target-chip.accent{
  filter:saturate(1.08);
}
.hero-linear-stack{
  display:grid;
  gap:8px;
}
.hero-linear-row{
  display:grid;
  grid-template-columns:12px 1fr;
  align-items:center;
  gap:10px;
  opacity:.52;
  animation:linearRowActive 8s linear infinite;
}
.hero-linear-row.row-c{animation-delay:0s}
.hero-linear-row.row-m{animation-delay:2s}
.hero-linear-row.row-y{animation-delay:4s}
.hero-linear-row.row-k{animation-delay:6s}
.hero-linear-row-label{
  font-size:8px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--muted);
}
.hero-linear-track{
  position:relative;
  display:grid;
  grid-template-columns:repeat(16,1fr);
  gap:2px;
  height:18px;
  padding:2px;
  border:1px solid rgba(255,255,255,0.08);
  background:rgba(255,255,255,0.015);
  overflow:hidden;
  transition:border-color .25s, box-shadow .25s, background .25s;
}
.hero-linear-row:is(.row-c,.row-m,.row-y,.row-k) .hero-linear-track{
  box-shadow:inset 0 0 0 1px rgba(255,255,255,0.02);
}
.hero-linear-row.row-c .hero-linear-track{--scan-glow:rgba(69,199,255,0.26)}
.hero-linear-row.row-m .hero-linear-track{--scan-glow:rgba(255,114,203,0.24)}
.hero-linear-row.row-y .hero-linear-track{--scan-glow:rgba(255,225,77,0.24)}
.hero-linear-row.row-k .hero-linear-track{--scan-glow:rgba(217,222,227,0.2)}
.hero-linear-cell{
  background:var(--cell);
  border:1px solid rgba(255,255,255,0.04);
}
.hero-scan-head{
  position:absolute;
  left:-18px;
  top:1px;
  bottom:1px;
  width:18px;
  border:1px solid rgba(255,255,255,0.28);
  background:
    linear-gradient(90deg,rgba(255,255,255,0) 0%,rgba(255,255,255,0.12) 30%,rgba(255,255,255,0.44) 72%,rgba(255,255,255,0.1) 100%),
    linear-gradient(180deg,rgba(255,255,255,0.36),rgba(255,255,255,0.1));
  box-shadow:
    0 0 14px rgba(255,255,255,0.2),
    -18px 0 20px rgba(255,255,255,0.12);
  animation:scanPass 8s linear infinite;
}
.hero-linear-row.row-c .hero-scan-head{animation-delay:0s}
.hero-linear-row.row-m .hero-scan-head{animation-delay:2s}
.hero-linear-row.row-y .hero-scan-head{animation-delay:4s}
.hero-linear-row.row-k .hero-scan-head{animation-delay:6s}
.hero-gamut-frame{
  display:flex;
  align-items:center;
  justify-content:center;
}
.hero-orbit-tr .hero-gamut-frame{
  max-width:116px;
}
.hero-gamut-art{
  position:relative;
  width:152px;
  height:152px;
  display:flex;
  align-items:center;
  justify-content:center;
}
.hero-orbit-tr .hero-gamut-art{
  width:116px;
  height:123px;
}
.hero-gamut-bitmap{
  display:block;
  width:152px;
  height:152px;
  object-fit:contain;
}
.hero-orbit-tr .hero-gamut-bitmap{
  width:116px;
  height:123px;
}
.hero-gamut-overlay{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
}
.hero-gamut-overlay .gamut-shape{
  fill:none;
  stroke-width:8;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.hero-gamut-overlay .gamut-axis{
  fill:none;
  stroke:rgba(245,247,250,0.88);
  stroke-width:3;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.hero-gamut-overlay .gamut-tick{
  stroke:rgba(245,247,250,0.82);
  stroke-width:2.5;
}
.hero-gamut-overlay .gamut-axis-text{
  font:500 22px/1 "Noto Sans SC","Helvetica Neue",Arial,sans-serif;
  letter-spacing:.01em;
  fill:rgba(245,247,250,0.84);
}
.hero-gamut-overlay .gamut-axis-label{
  font:italic 500 32px/1 Georgia,"Times New Roman",serif;
  fill:rgba(245,247,250,0.92);
}
.hero-gamut-overlay .gamut-label{
  font:600 34px/1 "Noto Sans SC","Helvetica Neue",Arial,sans-serif;
  letter-spacing:.01em;
  paint-order:stroke fill;
  fill:rgba(245,247,250,0.92);
  stroke:rgba(8,10,14,0.5);
  stroke-width:5px;
}
.hero-gamut-overlay .gamut-stage{
  opacity:0;
  animation:gamutStage 16s linear infinite;
}
.hero-gamut-overlay .stage-prophoto{animation-delay:0s}
.hero-gamut-overlay .stage-adobe{animation-delay:4s}
.hero-gamut-overlay .stage-cmyk{animation-delay:8s}
.hero-gamut-overlay .stage-srgb{animation-delay:12s}
.hero-status-list{
  display:flex;
  flex-direction:column;
  gap:9px;
}
.status-line{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  font-size:8px;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:var(--muted);
}
.status-line strong{
  color:var(--text);
  font-weight:400;
}
.status-line-1,.status-line-2,.status-line-3{
  animation:statusPulseLine 8s ease-in-out infinite;
}
.status-line-2{animation-delay:2s}
.status-line-3{animation-delay:4s}
.hero-status-code{
  margin-top:14px;
  padding-top:12px;
  border-top:1px solid rgba(255,255,255,0.08);
  display:flex;
  flex-direction:column;
  gap:6px;
}
.hero-status-code span{
  display:block;
  width:max-content;
  max-width:100%;
  overflow:hidden;
  white-space:nowrap;
  font-family:var(--font-mono);
  font-size:7px;
  letter-spacing:.12em;
  color:rgba(232,230,224,0.7);
  animation:codeType 5.4s steps(28,end) infinite;
}
.hero-status-code span:nth-child(2){animation-delay:1.2s}
.hero-status-code span:nth-child(3){animation-delay:2.4s}
.hero-status-code span::after{
  content:'_';
  margin-left:4px;
  color:rgba(232,230,224,0.85);
  animation:cursorBlink .9s step-end infinite;
}
.hero-story-link{
  margin-top:18px;
  font-size:12px;
  line-height:1.7;
}
.hero-story-link a{
  color:var(--muted);
  text-decoration:none;
  border-bottom:1px solid var(--line);
  padding-bottom:2px;
}
.hero-story-link a:hover{
  color:var(--text);
  border-color:var(--text);
}
@keyframes targetChipPulse{
  0%,100%{filter:brightness(1) saturate(.98)}
  50%{filter:brightness(1.08) saturate(1.04)}
}
@keyframes scanPass{
  0%{left:-18px;opacity:0}
  4%{left:-18px;opacity:0}
  8%{left:-18px;opacity:1}
  12%{left:0%;opacity:1}
  22%{left:calc(100% - 18px);opacity:1}
  24%{left:calc(100% - 18px);opacity:1}
  26%{left:calc(100% - 18px);opacity:0}
  100%{left:calc(100% - 18px);opacity:0}
}
@keyframes linearRowActive{
  0%,100%{opacity:.5}
  8%,24%{opacity:1}
  26%,100%{opacity:.52}
}
@keyframes gamutStage{
  0%,100%{opacity:0}
  6%,100%{opacity:.95}
}
@keyframes statusPulseLine{
  0%,100%{opacity:.62}
  30%,46%{opacity:1}
}
@keyframes codeType{
  0%,100%{max-width:0;opacity:.46}
  18%,82%{max-width:100%;opacity:.9}
}
@keyframes cursorBlink{
  0%,50%{opacity:1}
  51%,100%{opacity:0}
}
@media(max-width:860px){
  .hero-linear-row{animation-duration:12s}
  .hero-scan-head{animation-duration:12s}
  .status-line-1,
  .status-line-2,
  .status-line-3{animation-duration:12s}
  .hero-orbit::after{animation-duration:18s;opacity:.05}
  .hero-calibration-panel::after{animation-duration:16s;opacity:.18}
  .hero-target-chip{animation:none}
  .hero-calibration-swatch{animation:none}
  .hero-gamut-overlay .gamut-stage{animation-duration:24s;opacity:.74}
  .hero-status-code span{animation:none;opacity:.84}
  .hero-status-code span::after{animation:none;opacity:.45}
}
@media(max-width:480px){
  .hero-linear-row{animation-duration:14s}
  .hero-scan-head{animation-duration:14s}
  .status-line-1,
  .status-line-2,
  .status-line-3{animation-duration:14s}
  .hero-orbit::after{animation-duration:24s;opacity:.04}
  .hero-calibration-panel::after{animation-duration:22s;opacity:.14}
  .hero-gamut-overlay .gamut-stage{animation-duration:30s;opacity:.7}
  .hero-calibration-status::before{animation-duration:4.8s;box-shadow:0 0 8px rgba(67,163,22,0.42)}
}

/* —— COLOR STRIP —— */
.cstrip{display:flex;height:3px;background:var(--line)}
.cstrip span{flex:1;height:100%}

/* —— PRODUCTS —— */
#products{border-bottom:1px solid var(--line)}
.prod-grid{display:grid;grid-template-columns:1fr 1fr}

.prod{
  padding:0;
  position:relative;overflow:hidden;
  min-height:476px;
  display:flex;flex-direction:column;
  background:linear-gradient(180deg,rgba(255,255,255,0.016),rgba(255,255,255,0.006));
  transition:background .2s ease,border-color .2s ease,transform .2s ease,box-shadow .2s ease;
}
.prod::before{
  content:'';
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(180deg,rgba(255,255,255,0.022),transparent 26%,rgba(255,255,255,0.012) 58%,rgba(0,0,0,0.12) 100%),
    repeating-linear-gradient(180deg,rgba(255,255,255,0.015) 0 1px,rgba(255,255,255,0) 1px 6px);
  opacity:.3;
  transition:opacity .2s ease;
}
.prod-light::before{opacity:.26}
.prod-dark::before{opacity:.4}
.prod:hover::before{opacity:.52}
.prod::after{
  content:'';
  position:absolute;
  left:0;right:0;bottom:0;
  height:2px;
  transform:scaleX(0);
  transform-origin:left;
  transition:transform .2s ease;
  background:var(--product-tone-accent);
  pointer-events:none;
}
.prod:hover::after{transform:scaleX(1)}
/* —— text block: top of card —— */

/* —— logo zone: fills all remaining height —— */
.prod-logo-zone{
  flex:1;
  display:flex;align-items:center;justify-content:center;
  padding:10px 34px 54px;
  position:relative;
  overflow:hidden;
  min-height:136px;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
  background:
    linear-gradient(180deg,rgba(255,255,255,0.018),rgba(255,255,255,0.006)),
    linear-gradient(145deg,rgba(16,16,20,0.9),rgba(9,9,12,0.94));
}
.prod-logo-zone::before{
  content:'';
  position:absolute;inset:-8% -16%;
  pointer-events:none;
  opacity:0;
  transform:scale(0.96);
}
.prod-logo-zone::after{
  content:'';
  position:absolute;inset:0;pointer-events:none;
}
.prod-light .prod-logo-zone::after{
  background:
    radial-gradient(ellipse at 50% 50%,var(--product-tone-soft) 0%,transparent 58%),
    linear-gradient(180deg,rgba(255,255,255,0.03),transparent 44%,rgba(0,0,0,0.16));
}
.prod-dark .prod-logo-zone::after{
  background:
    radial-gradient(ellipse at 50% 50%,var(--product-tone-soft) 0%,transparent 58%),
    linear-gradient(180deg,rgba(255,255,255,0.03),transparent 44%,rgba(0,0,0,0.16));
}
 .prod-dark .prod-logo-zone::before{
  opacity:.34;
  background:
    radial-gradient(ellipse at 50% 54%,
      rgba(204,239,255,0.11) 0%,
      rgba(127,212,255,0.07) 22%,
      var(--product-tone-soft) 42%,
      rgba(255,255,255,0) 68%);
  animation:prodCsGuideBreath 8s ease-in-out infinite;
}
.prod-dark:hover .prod-logo-zone::before{opacity:.5}
.prod-logo-inner{
  width:var(--prod-logo-width);
  margin:0 auto;
  position:relative;z-index:1;
  display:flex;
  align-items:flex-end;
  justify-content:center;
  height:var(--prod-logo-box);
}
.prod-logo-inner svg{
  width:100%;height:auto;display:block;
}
.prod-logo-inner img,
.prod-logo-inner picture img{
  width:100%;height:auto;display:block;object-fit:contain;
}
.std-logo svg,
.cs-logo svg{transform:none}
.std-logo{
  filter:drop-shadow(0 0 10px var(--product-tone-soft));
  transition:filter .3s;
}
.prod-light:hover .std-logo{
  filter:drop-shadow(0 0 20px var(--product-tone-soft));
}
.cs-logo{
  filter:drop-shadow(0 0 20px var(--product-tone-soft));
  transition:filter .3s;
}
.prod-dark:hover .cs-logo{
  filter:drop-shadow(0 0 24px var(--product-tone-soft));
}
.prod-light{
  border-right:1px solid var(--line);
  background:linear-gradient(180deg,rgba(255,255,255,0.012),rgba(255,255,255,0.002));
}
.prod-light:hover{background:linear-gradient(180deg,var(--product-tone-hover),rgba(255,255,255,0.01))}
.prod-dark{
  background:linear-gradient(180deg,rgba(7,137,210,0.1),rgba(255,255,255,0.018));
  border-left:1px solid var(--line);
  box-shadow:inset 0 1px 0 rgba(7,137,210,0.22);
}
.prod-dark:hover{background:linear-gradient(180deg,rgba(7,137,210,0.12),rgba(255,255,255,0.014))}

.prod-badge{
  font-size:7.5px;letter-spacing:.3em;text-transform:uppercase;margin-bottom:12px;
  font-weight:400;
}
.prod-badge{color:var(--product-tone-accent)}

.prod-name{
  font-size:var(--fz-prod-title);font-weight:400;letter-spacing:.03em;line-height:1.05;
  line-height:1.05;margin-bottom:8px;letter-spacing:.01em;color:var(--text);
}
.prod-desc{
  font-size:var(--fz-body);
  line-height:1.78;font-weight:300;margin-bottom:18px;color:var(--muted);
}
.prod-tags{display:flex;flex-wrap:wrap;gap:5px;margin-bottom:18px}

@keyframes prodCsGuideBreath{
  0%,18%,100%{
    opacity:.18;
    transform:scale(0.95);
  }
  42%,58%{
    opacity:.34;
    transform:scale(1.02);
  }
}

/* —— SERVICES —— */
#services{border-bottom:1px solid var(--line)}
.svc-grid{display:grid;grid-template-columns:repeat(4,1fr)}
.svc{
  padding:32px 28px 28px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);
  position:relative;transition:background .2s;overflow:hidden;
}
.svc:nth-child(4n){border-right:none}
.svc:nth-last-child(-n+4){border-bottom:none}
.svc:hover{background:rgba(255,255,255,0.02)}
.svc::before{
  content:'';position:absolute;left:0;top:0;bottom:0;width:2px;
  transform:scaleY(0);transform-origin:bottom;transition:transform .3s ease;
}
.svc:nth-child(4n+1)::before{background:var(--R)}
.svc:nth-child(4n+2)::before{background:var(--Y)}
.svc:nth-child(4n+3)::before{background:var(--B)}
.svc:nth-child(4n+4)::before{background:var(--G)}
.svc:hover::before{transform:scaleY(1)}

.svc-num{
  font-size:var(--fz-svc-num);letter-spacing:.2em;color:var(--muted);margin-bottom:18px;
}
.svc-name{
  font-family:'Bebas Neue',sans-serif;font-size:var(--fz-svc-name);font-weight:400;letter-spacing:.04em;
  margin-bottom:8px;line-height:1.2;color:var(--text);
}
.svc-desc{
  font-family:'Bebas Neue','Anton',sans-serif;font-size:var(--fz-svc-desc);
  line-height:1.85;color:var(--muted);font-weight:300;
}

/* —— CASES —— */
#cases{border-bottom:1px solid var(--line)}
.cases-grid{display:grid;grid-template-columns:repeat(3,1fr)}
.case{
  border-right:1px solid var(--line);overflow:hidden;cursor:pointer;
  transition:background .2s;
}
.case:last-child{border-right:none}
.case:hover{background:rgba(255,255,255,0.015)}
.case.feat{grid-column:1/3;display:grid;grid-template-columns:1fr 1fr}

.case-vis{
  height:240px;position:relative;overflow:hidden;
  border-bottom:1px solid var(--line);
  display:flex;align-items:center;justify-content:center;
}
.case.feat .case-vis{height:100%;border-bottom:none;border-right:1px solid var(--line)}

.case-vis-bg{
  position:absolute;inset:0;
  background:var(--panel);
}
.case-vis-letter{
  font-family:'Bebas Neue',sans-serif;font-weight:700;font-size:80px;
  color:rgba(255,255,255,0.04);user-select:none;letter-spacing:-.02em;
  position:relative;z-index:1;
  transition:transform .5s ease,color .3s;
}
.case:hover .case-vis-letter{transform:scale(1.08);color:rgba(255,255,255,0.07)}

/* scan line sweep on hover */
.case-vis::after{
  content:'';position:absolute;inset:0;
  background:linear-gradient(transparent 40%,rgba(255,255,255,0.02) 50%,transparent 60%);
  transform:translateY(-100%);transition:transform .5s ease;
  pointer-events:none;z-index:2;
}
.case:hover .case-vis::after{transform:translateY(100%)}

.case-strip{position:absolute;bottom:0;left:0;right:0;height:2px;z-index:3}
.case-body{padding:22px 26px 30px}
.case.feat .case-body{display:flex;flex-direction:column;justify-content:center;padding:36px}
.case-cat{font-size:7.5px;letter-spacing:.22em;text-transform:uppercase;color:var(--muted);margin-bottom:7px;font-weight:400}
.case-name{
  font-size:20px;font-weight:400;letter-spacing:.03em;
  line-height:1.2;margin-bottom:8px;color:var(--text);
}
.case.feat .case-name{font-size:26px;margin-bottom:12px}
.case-note{
  font-size:var(--fz-body-sm);line-height:1.75;color:var(--muted);font-weight:300;
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;
}

/* —— SCENARIOS —— */
.scenario-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
}
.scenario-card{
  position:relative;
  min-height:420px;
  border-right:1px solid var(--line);
  border-bottom:1px solid var(--line);
  background:linear-gradient(180deg,rgba(255,255,255,0.015),rgba(255,255,255,0.005));
  --scenario-accent:var(--R);
  --scenario-accent-soft:rgba(239,39,6,0.2);
  overflow:hidden;
  transition:background .25s ease,border-color .25s ease,transform .25s ease;
}
.scenario-card:nth-child(2n){border-right:none}
.scenario-card:nth-last-child(-n+2){border-bottom:none}
.scenario-card:nth-child(1){--scenario-accent:var(--R);--scenario-accent-soft:rgba(239,39,6,0.2)}
.scenario-card:nth-child(2){--scenario-accent:var(--Y);--scenario-accent-soft:rgba(255,222,14,0.18)}
.scenario-card:nth-child(3){--scenario-accent:var(--B);--scenario-accent-soft:rgba(7,137,210,0.2)}
.scenario-card:nth-child(4){--scenario-accent:var(--G);--scenario-accent-soft:rgba(86,182,74,0.18)}
.scenario-card:hover{
  background:linear-gradient(180deg,rgba(255,255,255,0.024),rgba(255,255,255,0.01));
}
.scenario-card::before{
  content:'';
  position:absolute;
  left:0;top:0;bottom:0;
  width:2px;
  transform:scaleY(0);
  transform-origin:bottom;
  transition:transform .3s ease;
}
.scenario-card:nth-child(4n+1)::before{background:var(--R)}
.scenario-card:nth-child(4n+2)::before{background:var(--Y)}
.scenario-card:nth-child(4n+3)::before{background:var(--B)}
.scenario-card:nth-child(4n+4)::before{background:var(--G)}
.scenario-card:hover::before{transform:scaleY(1)}
.scenario-visual{
  height:186px;
  position:relative;
  margin:28px 28px 0;
  border:1px solid rgba(232,230,224,0.08);
  background:
    linear-gradient(180deg,rgba(255,255,255,0.018),rgba(255,255,255,0.006)),
    linear-gradient(145deg,rgba(25,25,29,0.9),rgba(12,12,16,0.94));
  overflow:hidden;
}
.scenario-visual::before{
  content:'';
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 50% 16%,rgba(255,255,255,0.06),transparent 34%),
    linear-gradient(180deg,rgba(255,255,255,0.028),transparent 48%,rgba(0,0,0,0.16) 100%);
  opacity:.72;
  pointer-events:none;
}
.scenario-visual::after{
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,transparent 36%,rgba(255,255,255,0.045) 50%,transparent 64%);
  transform:translateY(-100%);
  transition:transform .5s ease;
  pointer-events:none;
}
.scenario-card:hover .scenario-visual::after{transform:translateY(100%)}
.scenario-image-frame{
  position:absolute;
  left:14px;right:14px;
  top:50%;
  transform:translateY(-50%);
  aspect-ratio:4/1;
  border:1px solid rgba(232,230,224,0.08);
  background:linear-gradient(180deg,rgba(10,10,13,0.92),rgba(6,6,8,0.96));
  overflow:hidden;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.03),
    0 18px 26px rgba(0,0,0,0.22);
}
.scenario-image{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  display:block;
  transform:scale(1.012);
  transform-origin:center;
  filter:brightness(.84) saturate(.92) contrast(1.02);
}
.scenario-image-frame::before{
  content:'';
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 50% 22%,rgba(255,255,255,0.06),transparent 28%),
    linear-gradient(180deg,color-mix(in srgb,var(--scenario-accent) 16%,transparent),transparent 40%),
    linear-gradient(90deg,transparent 8%,color-mix(in srgb,var(--scenario-accent) 10%,transparent) 50%,transparent 92%);
  mix-blend-mode:screen;
  opacity:.6;
  pointer-events:none;
}
.scenario-image-frame::after{
  content:'';
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 50% 50%,transparent 58%,rgba(0,0,0,0.18) 82%,rgba(0,0,0,0.32) 100%),
    repeating-linear-gradient(180deg,rgba(255,255,255,0.028) 0 1px,rgba(255,255,255,0) 1px 5px);
  opacity:.72;
  pointer-events:none;
}
.scenario-card:hover .scenario-image-frame{
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.04),
    0 20px 30px rgba(0,0,0,0.24),
    0 0 0 1px color-mix(in srgb,var(--scenario-accent) 18%,transparent);
}
.scenario-card:hover .scenario-image{
  filter:brightness(.89) saturate(.96) contrast(1.04);
}
.scenario-body{
  padding:22px 28px 30px;
  display:flex;
  flex-direction:column;
  gap:12px;
}
.scenario-title{
  font-size:24px;
  line-height:1.12;
  letter-spacing:.02em;
  font-weight:400;
  color:var(--text);
}
.scenario-line{
  font-size:var(--fz-body-sm);
  line-height:1.82;
  font-weight:300;
}
.scenario-line.poetic{color:rgba(232,230,224,0.96)}
.scenario-line.practical{color:var(--muted)}
.scenario-keywords{
  margin-top:auto;
  padding-top:12px;
  border-top:1px solid rgba(232,230,224,0.08);
  font-size:8px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:rgba(232,230,224,0.62);
}

/* —— TECH —— */
#tech{border-bottom:1px solid var(--line)}
.tech-head{align-items:flex-end}
.tech-head-side{
  max-width:440px;
  display:grid;
  justify-items:start;
  gap:16px;
}
.tech-head-side .sec-note{max-width:none}
.tech-all-link,
.tech-entry-link{
  font-size:8px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--muted);text-decoration:none;
  display:inline-flex;align-items:center;gap:7px;
  border-bottom:1px solid var(--line);padding-bottom:1px;transition:gap .2s,color .2s,border-color .2s;
}
.tech-all-link:hover,
.tech-entry-link:hover{gap:14px;color:var(--section-accent);border-color:var(--section-accent-line)}
.tech-reading-list{
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
.tech-entry{
  position:relative;
  display:grid;
  grid-template-columns:72px minmax(0,1fr) auto;
  gap:24px;
  align-items:start;
  padding:28px 40px 26px;
  border-bottom:1px solid rgba(232,230,224,0.08);
  text-decoration:none;
  color:inherit;
  transition:background .2s ease;
}
.tech-entry:last-child{border-bottom:none}
.tech-entry:hover{background:var(--section-accent-hover)}
.tech-entry::after{
  content:'';
  position:absolute;
  bottom:0;left:0;right:0;
  height:2px;
  background:var(--section-accent);
  transform:scaleX(0);
  transform-origin:left;
  transition:transform .35s ease;
}
.tech-entry:hover::after{transform:scaleX(1)}
.tech-entry-index{
  font-size:10px;
  letter-spacing:.2em;
  color:rgba(232,230,224,0.22);
  font-family:'JetBrains Mono',monospace;
  padding-top:4px;
}
.tech-entry-copy{display:grid;gap:10px;max-width:720px}
.tech-entry-meta{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  align-items:center;
  font-family:'JetBrains Mono',monospace;
  font-size:7.5px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:rgba(232,230,224,0.48);
}
.tech-entry-date{color:var(--muted)}
.tech-entry-kicker{
  color:rgba(232,230,224,0.62);
  padding-left:10px;
  border-left:1px solid rgba(232,230,224,0.12);
}
.tech-entry-title{
  font-size:26px;
  font-weight:400;
  letter-spacing:.02em;
  line-height:1.1;
  color:var(--text);
}
.tech-entry-body{
  font-size:var(--fz-body-sm);
  line-height:1.88;
  color:var(--muted);
  font-weight:300;
}
.tech-entry-link{margin-top:6px;white-space:nowrap}
@media (max-width:900px){
  .tech-head-side{max-width:none}
  .tech-entry{
    grid-template-columns:1fr;
    gap:14px;
    padding:22px 18px 20px;
  }
  .tech-entry-index{padding-top:0}
  .tech-entry-link{margin-top:0}
}

/* —— FINAL CTA —— */
#final-cta{display:grid;grid-template-columns:1fr 1fr;border-bottom:1px solid var(--line)}
.consult-l{
  padding:48px 40px 52px;border-right:1px solid var(--line);
  display:flex;flex-direction:column;justify-content:flex-start;
  position:relative;overflow:hidden;
}
.consult-title{
  font-size:clamp(36px,4vw,58px);font-weight:400;
  line-height:1.0;margin:16px 0 0;letter-spacing:.01em;color:var(--text);
}
.consult-title .acc{color:var(--section-accent)}
.consult-r{padding:72px 40px 28px;background:var(--panel)}
.final-cta-links{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
}

/* —— TYPOGRAPHY WEIGHTS —— */
h1,h2,h3,h4,
.sec-title,.prod-name,.case-name,.tech-title,.consult-title,
.ipanel-title,.drawer-sec-title,.drawer-post-body h2,.drawer-post-body h3,
.ipanel-post-body h2,.ipanel-post-body h3,
.consult-foot-val{
  font-weight:700;
}
body,p,
.prod-desc,.case-note,.tech-body,.consult-sub,
.ipanel-desc,.ipanel-body,.ipanel-review-text,.ipanel-post-excerpt,
.ipanel-post-body p,.ipanel-post-body li,
.drawer-sec-body,.drawer-review-text,.drawer-post-body p,.drawer-callout p{
  font-weight:400;
}
.hero-sys,.hero-slogan,.prod-badge,.case-cat,
.drawer-sec-num,.drawer-tag,.drawer-review-author,.drawer-stat-label,
.ipanel-review-author,.ipanel-stat-label,.ipanel-sec-title,.ipanel-tag,
.ipanel-post-body h4,.ipanel-callout-label,.eall-cat{
  font-weight:400;
}

@media (prefers-reduced-motion: reduce){
  .scroll-track{scroll-snap-type:none}
}

/* —— MOBILE —— */
/* ══════════════════════════════════════════════
   RESPONSIVE — 三断点系统
   1024px: 平板横屏 / 小笔电
    860px: 平板竖屏 / 大手机
    480px: 手机
   ══════════════════════════════════════════════ */

/* —— 平板横屏 (≤1024px) —— */
@media(max-width:1024px){
  .hero-left::before{display:none}
  .hero-left::after{display:none}
  /* 服务网格：4→2列 */
  .svc-grid{grid-template-columns:1fr 1fr}
  .svc:nth-child(4n){border-right:1px solid var(--line)}
  .svc:nth-child(2n){border-right:none}
  /* 案例/技术轨道卡片宽度适配 */
  .scroll-track .case{min-width:min(340px,80vw)}
  .scroll-track .tech-card{min-width:min(300px,75vw)}
  /* 产品展开三列→两列 */
  .prod-expand-grid{grid-template-columns:1fr 1fr}
  .prod-expand-gallery{grid-template-columns:1fr 1fr}
  .prod-expand-inner{padding:24px 28px 30px}
  /* 瀑布流三列→两列 */
  .expand-all-grid{grid-template-columns:1fr 1fr}
}

/* —— 4:3 / 1:1 低宽屏比例下，标题进一步缩放 —— */
@media (max-aspect-ratio: 4/3){
  .hero-h1{font-size:clamp(46px,8.8vw,118px);letter-spacing:-.04em}
}

/* —— 平板竖屏/大手机 (≤860px) —— */
@media(max-width:860px){
  :root{
    --fz-body: 14.5px;
    --fz-body-lg: 15.5px;
    --fz-body-sm: 13.5px;
    --fz-body-xs: 12.5px;
    --fz-prod-title: 23px;
    --fz-svc-num: 9px;
    --fz-svc-name: 20px;
    --fz-svc-desc: 12.5px;
    --prod-logo-box: 166px;
    --prod-head-h: 138px;
    --prod-foot-h: 186px;
    --hero-scan-on: 2px;
    --hero-scan-off: 2px;
  }
  nav{padding:0 16px}

  /* Hero */
  #hero{
    min-height:auto;
    padding-top:var(--home-mobile-hero-top-pad);
  }
  #hero{
    --home-mobile-hero-top-pad: 58px;
    --home-mobile-poster-width-gap: 32px;
    --home-mobile-poster-minh-gap: 100px;
    --home-mobile-poster-pad-x: 16px;
    --home-mobile-poster-pad-top: 16px;
    --home-mobile-poster-pad-bottom: 12px;
    --home-mobile-poster-gap-x: 12px;
    --home-mobile-poster-gap-y: 12px;
    --home-mobile-poster-before-inset: 12px;
    --home-mobile-center-max: 456px;
    --home-mobile-title-size: clamp(44px, 10.9vw, 72px);
    --home-mobile-title-lh: normal;
    --home-mobile-center-pad-top: 4px;
    --home-mobile-center-pad-bottom: 4px;
    --home-mobile-copy-mt: 6px;
    --home-mobile-copy-gap: 2px;
    --home-mobile-pledge-fs: 15px;
    --home-mobile-pledge-lh: 1.62;
    --home-mobile-position-fs: 12.5px;
    --home-mobile-position-lh: 1.72;
    --home-mobile-btn-mt: 8px;
    --home-mobile-meta-mt: 4px;
  }
  .hero-poster{
    width:calc(100% - var(--home-mobile-poster-width-gap));
    min-height:calc(100dvh - var(--home-mobile-poster-minh-gap));
    padding:var(--home-mobile-poster-pad-top) var(--home-mobile-poster-pad-x) var(--home-mobile-poster-pad-bottom);
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:0;
    box-sizing:border-box;
  }
  .hero-poster::before{inset:var(--home-mobile-poster-before-inset)}
  .hero-orbit{display:none}
  .hero-center{
    width:min(100%,var(--home-mobile-center-max));
    max-width:var(--home-mobile-center-max);
    margin-inline:auto;
    padding:var(--home-mobile-center-pad-top) 0 var(--home-mobile-center-pad-bottom);
  }
  .hero-title{font-size:var(--home-mobile-title-size);line-height:var(--home-mobile-title-lh)}
  .hero-copy{
    max-width:100%;
    margin-top:var(--home-mobile-copy-mt);
    gap:var(--home-mobile-copy-gap);
  }
  .hero-pledge{font-size:var(--home-mobile-pledge-fs);line-height:var(--home-mobile-pledge-lh)}
  .hero-positioning{font-size:var(--home-mobile-position-fs);line-height:var(--home-mobile-position-lh)}
  .hero-btns{margin-top:var(--home-mobile-btn-mt)}
  .hero-meta-link{margin-top:var(--home-mobile-meta-mt)}

  /* 产品 */
  #products{
    padding:18px 0 12px;
  }
  #products .sec-head{
    padding:0 20px 14px;
  }
  .prod-grid{
    padding:0 20px;
    box-sizing:border-box;
    row-gap:16px;
  }
  .prod-grid{grid-template-columns:1fr}
  .prod-name{font-size:var(--fz-prod-title)}
  .prod-badge{font-size:8px;letter-spacing:.22em}
  .prod-desc{font-size:var(--fz-body-sm)}
  .prod-expand-grid{grid-template-columns:1fr}
  .prod-expand-gallery{grid-template-columns:1fr}
  .prod-expand-inner{padding:20px 20px 24px}
  .prod-expand-cta{flex-direction:column;align-items:flex-start}

  /* section 头部 */
  .scenario-grid{grid-template-columns:1fr}
  .scenario-card{min-height:auto;border-right:none}
  .scenario-card:nth-last-child(-n+2){border-bottom:1px solid var(--line)}
  .scenario-card:last-child{border-bottom:none}
  .scenario-visual{height:168px;margin:22px 20px 0}
  .scenario-body{padding:20px 20px 24px}

  /* case.feat：移动端重置跨列，变回单列 */
  .case.feat{grid-column:auto;grid-template-columns:1fr}
  .case.feat .case-vis{height:180px;border-right:none;border-bottom:1px solid var(--line)}
  .case.feat .case-body{padding:24px 20px}

  /* 滑动轨道卡片宽度 */
  .scroll-track .case{min-width:min(300px,85vw)}
  .scroll-track .tech-card{min-width:min(280px,82vw)}
  /* 展开详情面板 */
  .ipanel-inner{grid-template-columns:1fr}
  .ipanel-left{border-bottom:1px solid var(--line)}
  .ipanel-right{padding:24px 20px}
  .ipanel-review{flex-direction:column;padding:20px}
  .ipanel-stats{flex-wrap:wrap}
  .ipanel-stat{min-width:50%;box-sizing:border-box}
  .ipanel-post-inner{padding:24px 20px}
  .ipanel-post-excerpt{font-size:14px}
  /* 瀑布流 */
  .expand-all-grid{grid-template-columns:1fr 1fr}

  /* 咨询 */
  #final-cta{grid-template-columns:1fr}
  .consult-l{border-right:none;border-bottom:1px solid var(--line);padding:44px 20px}
  .consult-r{padding:36px 20px}
  .final-cta-links{grid-template-columns:1fr}

  /* Footer */
}

/* —— 手机 (≤480px) —— */
@media(max-width:480px){
  :root{
    --fz-body: 14px;
    --fz-body-lg: 15px;
    --fz-body-sm: 13px;
    --fz-body-xs: 12px;
    --fz-prod-title: 20px;
    --fz-svc-num: 8.5px;
    --fz-svc-name: 19px;
    --fz-svc-desc: 12px;
    --prod-logo-box: 148px;
    --prod-head-h: 132px;
    --prod-foot-h: 176px;
    --hero-scan-on: 2px;
    --hero-scan-off: 2px;
  }
  /* 排版 */
  #hero{
    --home-mobile-poster-width-gap: 20px;
    --home-mobile-poster-minh-gap: 82px;
    --home-mobile-poster-pad-x: 10px;
    --home-mobile-poster-pad-top: 12px;
    --home-mobile-poster-pad-bottom: 10px;
    --home-mobile-poster-gap-x: 8px;
    --home-mobile-poster-gap-y: 8px;
    --home-mobile-poster-before-inset: 10px;
    --home-mobile-center-max: 384px;
    --home-mobile-title-size: clamp(38px, 11.1vw, 62px);
    --home-mobile-title-lh: normal;
    --home-mobile-center-pad-top: 3px;
    --home-mobile-center-pad-bottom: 2px;
    --home-mobile-copy-mt: 3px;
    --home-mobile-copy-gap: 2px;
    --home-mobile-pledge-fs: 14px;
    --home-mobile-pledge-lh: 1.58;
    --home-mobile-position-fs: 12px;
    --home-mobile-position-lh: 1.68;
    --home-mobile-btn-mt: 6px;
    --home-mobile-meta-mt: 3px;
  }
  #products{
    padding:14px 0 8px;
  }
  #products .sec-head{
    padding:0 16px 12px;
  }
  .prod-grid{
    padding:0 16px;
    box-sizing:border-box;
    row-gap:14px;
  }
  .hstat{padding:14px 16px}

  /* 产品卡片内边距收窄 */
  .prod-name{font-size:var(--fz-prod-title)}
  .prod-desc{font-size:var(--fz-body-sm)}
  .prod-expand-inner{padding:16px 16px 20px}

  /* 滑动轨道 */
  .scroll-track .case{min-width:min(280px,90vw)}
  .scroll-track .tech-card{min-width:min(260px,88vw)}
  .scroll-nav-btn{width:32px;height:32px;font-size:14px}
  .case-strip{height:3px}

  /* 瀑布流单列 */
  .expand-all-grid{grid-template-columns:1fr}

  /* 案例详情面板 */
  .ipanel-stats{grid-template-columns:1fr 1fr}
  .ipanel-stat{min-width:0}
  .ipanel-title{font-size:clamp(24px,6vw,36px)}

  /* 服务 */
  .svc-grid{grid-template-columns:1fr}
  .svc:nth-child(2n){border-right:1px solid var(--line)}
  .scenario-visual{height:154px;margin:18px 16px 0}
  .scenario-body{padding:18px 16px 22px}
  .scenario-title{font-size:22px}
  .scenario-keywords{font-size:7.5px;letter-spacing:.16em}

  /* Footer */
}

@media(max-height:740px), (min-width:568px) and (max-width:844px) and (orientation:landscape){
  #hero{
    --home-mobile-hero-top-pad: 44px;
    --home-mobile-poster-width-gap: 12px;
    --home-mobile-poster-minh-gap: 44px;
    --home-mobile-poster-pad-x: 8px;
    --home-mobile-poster-pad-top: 6px;
    --home-mobile-poster-pad-bottom: 6px;
    --home-mobile-poster-gap-x: 6px;
    --home-mobile-poster-gap-y: 6px;
    --home-mobile-poster-before-inset: 8px;
    --home-mobile-center-max: 480px;
    --home-mobile-title-size: clamp(21px, 4.35vw, 31px);
    --home-mobile-title-lh: .92;
    --home-mobile-center-pad-top: 6px;
    --home-mobile-center-pad-bottom: 4px;
    --home-mobile-copy-mt: 4px;
    --home-mobile-copy-gap: 2px;
    --home-mobile-pledge-fs: clamp(12px,1.75vw,14px);
    --home-mobile-pledge-lh: 1.38;
    --home-mobile-position-fs: clamp(10px,1.45vw,11.5px);
    --home-mobile-position-lh: 1.42;
    --home-mobile-btn-mt: 6px;
    --home-mobile-meta-mt: 4px;
  }
}

@media(min-width:320px) and (max-width:375px) and (orientation:portrait){
  #hero{
    --home-mobile-poster-width-gap: 10px;
    --home-mobile-poster-minh-gap: 96px;
    --home-mobile-poster-pad-x: 4px;
    --home-mobile-poster-pad-top: 4px;
    --home-mobile-poster-pad-bottom: 2px;
    --home-mobile-poster-gap-x: 3px;
    --home-mobile-poster-gap-y: 3px;
    --home-mobile-poster-before-inset: 5px;
    --home-mobile-center-max: 336px;
    --home-mobile-title-size: clamp(27px, 7.9vw, 48px);
    --home-mobile-title-lh: normal;
    --home-mobile-center-pad-top: 0px;
    --home-mobile-center-pad-bottom: 0px;
    --home-mobile-copy-mt: 0px;
    --home-mobile-copy-gap: 1px;
    --home-mobile-pledge-fs: 11px;
    --home-mobile-pledge-lh: 1.34;
    --home-mobile-position-fs: 9.5px;
    --home-mobile-position-lh: 1.4;
    --home-mobile-btn-mt: 3px;
    --home-mobile-meta-mt: 2px;
  }
  #products{
    padding:12px 0 6px;
  }
  #products .sec-head{
    padding:0 14px 10px;
  }
  .prod-grid{
    padding:0 14px;
    box-sizing:border-box;
    row-gap:12px;
  }
}

@media(min-width:568px) and (max-height:430px) and (orientation:landscape){
  #hero{
    --home-mobile-hero-top-pad: 40px;
    --home-mobile-poster-width-gap: 10px;
    --home-mobile-poster-minh-gap: 50px;
    --home-mobile-poster-pad-x: 6px;
    --home-mobile-poster-pad-top: 2px;
    --home-mobile-poster-pad-bottom: 2px;
    --home-mobile-poster-gap-x: 4px;
    --home-mobile-poster-gap-y: 4px;
    --home-mobile-poster-before-inset: 6px;
    --home-mobile-center-max: 448px;
    --home-mobile-title-size: clamp(19px, 4.05vw, 25px);
    --home-mobile-title-lh: .92;
    --home-mobile-center-pad-top: 4px;
    --home-mobile-center-pad-bottom: 3px;
    --home-mobile-copy-mt: 2px;
    --home-mobile-copy-gap: 1px;
    --home-mobile-pledge-fs: clamp(11px,1.6vw,12.5px);
    --home-mobile-pledge-lh: 1.34;
    --home-mobile-position-fs: clamp(9px,1.25vw,10.5px);
    --home-mobile-position-lh: 1.4;
    --home-mobile-btn-mt: 6px;
    --home-mobile-meta-mt: 3px;
  }
}

.prod-header{
  padding:26px 32px 14px;
  height:var(--prod-head-h);
  box-sizing:border-box;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
}
.prod-footer{
  padding:18px 32px 28px;
  height:var(--prod-foot-h);
  box-sizing:border-box;
  display:flex;
  flex-direction:column;
}

/* ══════════════════════════════════════════════════════
   DRAWER (底部抽屉面板)
   ══════════════════════════════════════════════════════ */
.drawer-overlay{
  position:fixed;inset:0;z-index:600;
  background:rgba(0,0,0,0);pointer-events:none;
  transition:background .35s;
}
.drawer-overlay.open{
  background:rgba(0,0,0,0.65);pointer-events:all;
  -webkit-backdrop-filter:blur(4px);
  backdrop-filter:blur(4px);
}
.drawer{
  position:fixed;bottom:0;left:0;right:0;z-index:601;
  background:var(--bg2);border-top:1px solid var(--line);
  transform:translateY(100%);transition:transform .38s cubic-bezier(.22,.8,.25,1);
  max-height:88vh;display:flex;flex-direction:column;
  box-shadow:0 -24px 80px rgba(0,0,0,0.5);
}
.drawer.open{transform:translateY(0)}

.drawer-head{
  display:flex;align-items:center;justify-content:space-between;
  padding:16px 32px 16px;border-bottom:1px solid var(--line);flex-shrink:0;
}
.drawer-title{
  font-family:'Bebas Neue',sans-serif;font-size:22px;letter-spacing:.05em;
}
.drawer-close{
  background:none;border:1px solid var(--line);color:var(--muted);
  width:36px;height:36px;font-size:18px;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  transition:all .2s;flex-shrink:0;
}
.drawer-close:hover{color:var(--text);border-color:var(--muted)}
.drawer-body{
  overflow-y:auto;flex:1;
  padding:28px 32px 40px;
}
.drawer-body::-webkit-scrollbar{width:2px}
.drawer-body::-webkit-scrollbar-thumb{background:var(--B)}

/* CASE DRAWER */
.drawer-case-hero{
  display:grid;grid-template-columns:1fr 1fr;gap:1px;
  background:var(--line);margin-bottom:24px;
}
.drawer-case-col{background:var(--bg2);padding:20px 20px}
.drawer-case-col:first-child{border-right:none}

/* GALLERY in drawer */
.drawer-gallery{position:relative;background:var(--panel);margin-bottom:24px;cursor:zoom-in}
.drawer-gallery-img{width:100%;max-height:52vh;object-fit:contain;display:block}
.drawer-gallery-placeholder{
  height:260px;display:flex;align-items:center;justify-content:center;
  flex-direction:column;gap:12px;color:var(--muted);
}
.drawer-gallery-arrow{
  position:absolute;top:50%;transform:translateY(-50%);
  background:rgba(10,10,12,.7);border:1px solid var(--line);
  color:var(--text);width:40px;height:40px;font-size:18px;
  display:flex;align-items:center;justify-content:center;
  cursor:pointer;transition:all .2s;
}
.drawer-gallery-arrow:hover{background:rgba(10,10,12,.95)}
.drawer-gallery-arrow.prev{left:12px}
.drawer-gallery-arrow.next{right:12px}
.drawer-gallery-thumbs{display:flex;gap:1px;background:var(--line);margin-bottom:24px;overflow-x:auto}
.drawer-thumb{
  width:80px;min-width:80px;height:56px;object-fit:cover;
  cursor:pointer;opacity:.4;transition:opacity .2s;border:2px solid transparent;flex-shrink:0;
}
.drawer-thumb.active{opacity:1;border-color:var(--R)}
.drawer-thumb:hover{opacity:.75}

/* Drawer section blocks */
.drawer-sections{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);margin-bottom:24px}
.drawer-sec{background:var(--bg2);padding:20px}
.drawer-sec-num{font-family:'JetBrains Mono',monospace;font-size:7.5px;letter-spacing:.2em;color:var(--muted);margin-bottom:10px}
.drawer-sec-title{font-family:'Bebas Neue',sans-serif;font-size:20px;letter-spacing:.04em;margin-bottom:12px;line-height:1}
.drawer-sec-body{font-size:13px;line-height:1.9;color:rgba(232,230,224,.7);font-weight:300}
.drawer-sec-body p{margin-bottom:10px}

.drawer-tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:14px}
.drawer-tag{font-family:'JetBrains Mono',monospace;font-size:7.5px;letter-spacing:.14em;text-transform:uppercase;padding:3px 8px;border:1px solid var(--line);color:var(--muted)}

.drawer-review{background:var(--panel);border:1px solid var(--line);padding:20px 24px;margin-bottom:24px}
.drawer-review-text{font-size:14px;line-height:1.85;color:rgba(232,230,224,.8);font-style:italic;font-weight:300;margin-bottom:12px}
.drawer-review-author{font-family:'JetBrains Mono',monospace;font-size:8px;letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}

.drawer-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);margin-bottom:28px}
.drawer-stat{background:var(--bg2);padding:14px 16px}
.drawer-stat-label{font-family:'JetBrains Mono',monospace;font-size:7px;letter-spacing:.22em;text-transform:uppercase;color:var(--muted);margin-bottom:5px}
.drawer-stat-value{font-size:13px;font-weight:500}

/* POST DRAWER */
.drawer-post-excerpt{
  font-size:15px;line-height:1.85;color:rgba(232,230,224,.65);font-weight:300;
  border-left:3px solid var(--R);padding-left:18px;margin-bottom:28px;
}
.drawer-post-body h2{
  font-family:'Bebas Neue',sans-serif;font-size:26px;letter-spacing:.04em;
  margin:36px 0 14px;line-height:1;
}
.drawer-post-body h2:first-child{margin-top:0}
.drawer-post-body h3{font-family:'Bebas Neue',sans-serif;font-size:18px;letter-spacing:.04em;margin:22px 0 10px}
.drawer-post-body p{font-size:14px;line-height:2;color:rgba(232,230,224,.72);font-weight:300;margin-bottom:14px}
.drawer-post-body strong{color:var(--text);font-weight:600}
.drawer-post-body em{color:var(--Y);font-style:normal;font-weight:500}
.drawer-post-body pre{background:var(--panel);border:1px solid var(--line);border-left:2px solid var(--B);padding:16px 20px;margin:20px 0;overflow-x:auto}
.drawer-post-body code{font-family:'JetBrains Mono',monospace;font-size:12px;color:rgba(232,230,224,.8);line-height:1.8}
.drawer-post-body img{
  max-width:100%;height:auto;display:block;margin:18px 0;object-fit:contain;
}
.drawer-callout{background:var(--panel);border:1px solid var(--line);border-left:3px solid var(--Y);padding:16px 20px;margin:20px 0}
.drawer-callout p{margin-bottom:0;font-size:13px;color:rgba(232,230,224,.8)}

/* PRODUCT EXPAND */
.prod-expand{
  grid-column:1/-1;
  max-height:0;overflow:hidden;
  transition:max-height .5s cubic-bezier(.4,0,.2,1);
  border-top:0px solid var(--line);
}
.prod-expand.open{
  max-height:600px;
  border-top:1px solid var(--line);
}
.prod-expand-inner{padding:28px 40px 36px}
.prod-expand-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);margin-bottom:24px}
.prod-expand-item{background:var(--panel2);padding:18px 20px}
.prod-expand-icon{font-family:'Bebas Neue',sans-serif;font-size:24px;letter-spacing:.04em;margin-bottom:6px}
.prod-expand-label{font-size:var(--fz-body-sm);font-weight:400;color:var(--text);margin-bottom:4px}
.prod-expand-note{font-size:var(--fz-body-sm);color:var(--muted);line-height:1.7;font-weight:300}
.prod-expand-gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);margin:24px 0}
.prod-expand-img{width:100%;height:150px;object-fit:cover;display:block;background:var(--panel2)}
.prod-expand-cta{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px}

/* CASES / POSTS SCROLL TRACK */
.scroll-track-wrap{position:relative;overflow:hidden}
.scroll-track{
  display:flex;gap:1px;overflow-x:auto;scroll-snap-type:x mandatory;
  -webkit-overflow-scrolling:touch;scrollbar-width:none;cursor:grab;
  scroll-padding:40px;
}
.scroll-track .case,.scroll-track .tech-card{
  scroll-snap-stop: always;
}
.scroll-track::-webkit-scrollbar{display:none}
.scroll-track.dragging{cursor:grabbing;user-select:none}
.scroll-track .case,.scroll-track .tech-card{
  scroll-snap-align:start;flex-shrink:0;
}

/* Scroll nav buttons */
.scroll-nav{
  display:flex;align-items:center;gap:8px;
}
.scroll-nav-btn{
  width:36px;height:36px;background:none;border:1px solid var(--line);
  color:var(--muted);font-size:16px;cursor:pointer;display:flex;align-items:center;justify-content:center;
  transition:all .2s;
}
.scroll-nav-btn:hover{color:var(--text);border-color:var(--muted)}
.scroll-nav-btn:disabled{opacity:.25;cursor:default}

/* EXPAND ALL: waterfall list */
.expand-all-wrap{
  max-height:0;overflow:hidden;
  transition:max-height .6s cubic-bezier(.4,0,.2,1);
}
.expand-all-wrap.open{max-height:4000px}
.expand-all-grid{
  display:grid;grid-template-columns:repeat(3,1fr);
  gap:1px;background:var(--line);
  border-top:1px solid var(--line);
}
.expand-all-close{
  display:flex;align-items:center;justify-content:center;
  padding:20px;border-top:1px solid var(--line);
}
.expand-close-btn{
  font-family:'JetBrains Mono',monospace;font-size:8.5px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--muted);background:none;border:1px solid var(--line);padding:8px 20px;cursor:pointer;transition:all .2s;
}
.expand-close-btn:hover{color:var(--text);border-color:var(--muted)}

/* LIGHTBOX */
.drawer-lightbox{position:fixed;inset:0;z-index:700;background:rgba(0,0,0,.96);display:none;align-items:center;justify-content:center}
.drawer-lightbox.open{display:flex}
.drawer-lightbox img{max-width:94vw;max-height:94vh;object-fit:contain}
.drawer-lightbox-close{position:absolute;top:20px;right:24px;background:none;border:1px solid rgba(255,255,255,.15);color:rgba(255,255,255,.5);width:40px;height:40px;font-size:20px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s}
.drawer-lightbox-close:hover{color:#fff}

/* ══════════════════════════════════════════════════════
   INLINE EXPAND PANEL  (below scroll track)
   ══════════════════════════════════════════════════════ */
.ipanel-outer{
  max-height:0;overflow:hidden;
  transition:max-height .55s cubic-bezier(.4,0,.2,1);
  border-top:0px solid var(--line);
}
.ipanel-outer.open{
  border-top:1px solid var(--line);
}
.ipanel-close-bar{
  display:flex;justify-content:center;padding:16px;
  border-top:1px solid var(--line);
}
.ipanel-wrap{background:var(--bg2)}
.ipanel-accent-bar{height:3px;display:flex;flex-shrink:0}
.ipanel-inner{
  display:grid;grid-template-columns:1fr 1fr;
  gap:1px;background:var(--line);
}
.ipanel-left,.ipanel-right{background:var(--bg2);padding:32px 36px}
.ipanel-left{padding:0 0}

/* Gallery inside panel */
.ipanel-gallery{
  position:relative;background:var(--panel);
  cursor:zoom-in;overflow:hidden;
}
.ipanel-gallery-img{
  width:100%;display:block;transition:opacity .2s;
  object-fit:cover;
}
.ipanel-gallery.is-landscape .ipanel-gallery-img{
  max-height:420px;
}
.ipanel-gallery.is-square .ipanel-gallery-img{
  max-height:520px;
}
.ipanel-gallery.is-portrait .ipanel-gallery-img{
  max-height:600px;
  object-fit:contain;
  background:var(--panel);
}
.ipanel-arr{
  position:absolute;top:50%;transform:translateY(-50%);
  background:rgba(10,10,12,.7);border:1px solid var(--line);
  color:var(--text);width:40px;height:40px;font-size:18px;
  display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s;
}
.ipanel-arr:hover{background:rgba(10,10,12,.95)}
.ipanel-arr.prev{left:12px}.ipanel-arr.next{right:12px}
.ipanel-thumbs{
  display:flex;gap:1px;background:var(--line);
  border-top:1px solid var(--line);overflow-x:auto;
}
.ipanel-thumb{
  width:90px;min-width:90px;height:62px;object-fit:cover;
  cursor:pointer;opacity:.4;transition:opacity .2s;border:2px solid transparent;
}
.ipanel-thumb.active{opacity:1;border-color:var(--accent,var(--R))}
.ipanel-thumb:hover{opacity:.75}

/* No image state */
.ipanel-no-img{
  height:300px;display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:10px;
  background:var(--panel);
}
.ipanel-no-img-letter{font-size:90px;opacity:.07;line-height:1}
.ipanel-no-img-label{font-size:8px;letter-spacing:.22em;text-transform:uppercase;color:var(--muted);font-weight:100}

/* Right side text */
.ipanel-eyebrow{font-size:8px;letter-spacing:.25em;text-transform:uppercase;color:var(--muted);margin-bottom:12px;font-weight:100}
.ipanel-title{font-size:clamp(28px,3vw,44px);letter-spacing:.03em;line-height:.95;margin-bottom:14px;font-weight:400}
.ipanel-desc{font-size:var(--fz-body);line-height:1.8;color:rgba(232,230,224,.65);font-weight:300;margin-bottom:18px}
.ipanel-divider{height:1px;background:var(--line);margin-bottom:16px}
.ipanel-sec-title{font-size:7.5px;letter-spacing:.22em;text-transform:uppercase;color:var(--muted);margin-bottom:8px;font-weight:100}
.ipanel-body{font-size:var(--fz-body);line-height:1.9;color:rgba(232,230,224,.7);font-weight:300}
.ipanel-body p{margin-bottom:10px}.ipanel-body p:last-child{margin-bottom:0}
.ipanel-tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:14px}
.ipanel-tag{font-size:7.5px;letter-spacing:.13em;text-transform:uppercase;padding:3px 9px;border:1px solid var(--line);color:var(--muted);font-weight:100}

/* Review + stats row */
.ipanel-review{
  background:var(--panel);border:1px solid var(--line);
  border-top:none;padding:20px 36px;
  display:flex;align-items:flex-start;gap:24px;flex-wrap:wrap;
}
.ipanel-review-text{font-size:13.5px;line-height:1.8;color:rgba(232,230,224,.8);font-style:italic;font-weight:300;flex:1;min-width:200px}
.ipanel-review-author{font-family:'JetBrains Mono',monospace;font-size:8px;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);margin-top:6px;white-space:nowrap}
.ipanel-stats{display:flex;background:var(--line);gap:1px;border-top:1px solid var(--line)}
.ipanel-stat{flex:1;background:var(--bg2);padding:14px 20px}
.ipanel-stat-label{font-family:'JetBrains Mono',monospace;font-size:7px;letter-spacing:.22em;text-transform:uppercase;color:var(--muted);margin-bottom:5px}
.ipanel-stat-value{font-size:13px;font-weight:500}

/* Card active state */
.case.card-active,.tech-card.card-active{
  outline:2px solid var(--accent,var(--R));
  outline-offset:-2px;
}

/* POST panel */
.ipanel-post-inner{padding:32px 40px}
.ipanel-post-head{border-bottom:1px solid var(--line);margin-bottom:28px;padding-bottom:24px}
.ipanel-post-excerpt{font-size:15px;line-height:1.85;color:rgba(232,230,224,.65);font-weight:300;border-left:3px solid var(--accent,var(--R));padding-left:18px;margin-top:12px}
.ipanel-post-body h2{font-family:'Bebas Neue',sans-serif;font-size:26px;letter-spacing:.04em;margin:36px 0 12px;line-height:1}
.ipanel-post-body h2:first-child{margin-top:0}
.ipanel-post-body h3{font-family:'Bebas Neue',sans-serif;font-size:19px;letter-spacing:.03em;margin:24px 0 10px;line-height:1;color:var(--text)}
.ipanel-post-body h4{font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.22em;text-transform:uppercase;margin:20px 0 8px;color:var(--muted)}
.ipanel-post-body p{font-size:var(--fz-body);line-height:2.1;color:rgba(232,230,224,.72);font-weight:300;margin-bottom:14px}
.ipanel-post-body strong{color:var(--text);font-weight:600}
.ipanel-post-body em{color:var(--Y);font-style:normal;font-weight:500}
/* 列表 */
.ipanel-post-body ul,.ipanel-post-body ol{
  margin:0 0 16px 0;padding-left:0;list-style:none;
}
.ipanel-post-body li{
  font-size:14px;line-height:2;color:rgba(232,230,224,.72);font-weight:300;
  padding-left:20px;position:relative;margin-bottom:4px;
}
.ipanel-post-body ul li::before{
  content:'—';position:absolute;left:0;color:var(--muted);font-size:12px;top:2px;
}
.ipanel-post-body ol{counter-reset:ol-counter}
.ipanel-post-body ol li::before{
  content:counter(ol-counter) '.';counter-increment:ol-counter;
  position:absolute;left:0;color:var(--muted);font-family:'JetBrains Mono',monospace;font-size:11px;top:3px;
}
/* 代码块 */
.ipanel-post-body pre{
  background:var(--panel);border:1px solid var(--line);border-left:2px solid var(--B);
  padding:16px 20px;margin:20px 0;overflow-x:auto;
}
.ipanel-post-body code{
  font-family:'JetBrains Mono',monospace;font-size:12px;
  color:rgba(232,230,224,.8);line-height:1.8;
}
.ipanel-post-body p code{
  background:var(--panel);padding:1px 6px;border:1px solid var(--line);
  font-size:12px;color:var(--B);border-radius:0;
}
/* 引用 */
.ipanel-post-body blockquote{
  border-left:3px solid var(--muted);margin:20px 0;padding:12px 20px;
  background:var(--panel);
}
.ipanel-post-body blockquote p{color:rgba(232,230,224,.6);font-style:italic;margin-bottom:0}
/* 分割线 */
.ipanel-post-body hr{
  border:none;border-top:1px solid var(--line);margin:28px 0;
}
/* 表格 */
.ipanel-post-body table{
  width:100%;border-collapse:collapse;margin:20px 0;font-size:13px;
}
.ipanel-post-body th{
  font-family:'JetBrains Mono',monospace;font-size:8px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--muted);padding:10px 14px;border-bottom:1px solid var(--line);text-align:left;
}
.ipanel-post-body td{
  padding:10px 14px;border-bottom:1px solid var(--line);
  color:rgba(232,230,224,.7);font-weight:300;line-height:1.7;vertical-align:top;
}
.ipanel-post-body tr:last-child td{border-bottom:none}
/* 图片（正文内嵌图） */
.ipanel-post-body img{
  max-width:100%;height:auto;display:block;margin:20px 0;
  object-fit:contain;
}
.ipanel-post-body figure{margin:20px 0}
.ipanel-post-body figcaption{
  font-family:'JetBrains Mono',monospace;font-size:8px;letter-spacing:.15em;
  text-transform:uppercase;color:var(--muted);margin-top:8px;text-align:center;
}
.ipanel-callout{background:var(--panel);border:1px solid var(--line);border-left:3px solid var(--Y);padding:14px 18px;margin:16px 0}
.ipanel-callout-label{font-family:'JetBrains Mono',monospace;font-size:7.5px;letter-spacing:.22em;text-transform:uppercase;color:var(--Y);margin-bottom:7px}
.ipanel-callout p{margin-bottom:0;font-size:13px;color:rgba(232,230,224,.8)}
.ipanel-post-cta{display:flex;align-items:center;justify-content:space-between;margin-top:28px;padding-top:20px;border-top:1px solid var(--line);flex-wrap:wrap;gap:12px}
.ipanel-cta-btn{font-family:'JetBrains Mono',monospace;font-size:9px;letter-spacing:.2em;text-transform:uppercase;padding:11px 22px;background:var(--R);color:#fff;text-decoration:none;transition:all .2s}
.ipanel-cta-btn:hover{background:#c41e00}

/* WATERFALL expand-all */
.eall-card{background:var(--panel);cursor:pointer;transition:background .2s}
.eall-card:hover{background:var(--panel2)}
.eall-cat{font-family:'JetBrains Mono',monospace;font-size:7.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);margin-bottom:7px}
.eall-title{font-family:'Bebas Neue',sans-serif;font-size:18px;letter-spacing:.03em;color:var(--text);margin-bottom:6px;line-height:1.1}
.eall-desc{font-size:12px;color:var(--muted);line-height:1.7;font-weight:300}

/* LIGHTBOX */
#panel-lightbox{position:fixed;inset:0;z-index:800;background:rgba(0,0,0,.96);display:none;align-items:center;justify-content:center}
#panel-lightbox.open{display:flex}
#panel-lightbox img{max-width:94vw;max-height:94vh;object-fit:contain}
#panel-lightbox-close{position:absolute;top:20px;right:24px;background:none;border:1px solid rgba(255,255,255,.15);color:rgba(255,255,255,.5);width:40px;height:40px;font-size:20px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s}
#panel-lightbox-close:hover{color:#fff}

/* Mobile */