/*
Theme Name: Wide Narrow Vision
Theme URI: https://example.com/
Description: A bilingual, high-performance technology company child theme for Blocksy.
Author: Wide Narrow Vision
Version: 1.3.0
Template: blocksy
Text Domain: wide-narrow
*/

:root {
  --wn-bg: #ffffff;
  --wn-bg-soft: #f7f7f7;
  --wn-surface: rgba(4, 29, 41, 0.045);
  --wn-surface-strong: rgba(4, 29, 41, 0.09);
  --wn-line: rgba(4, 29, 41, 0.13);
  --wn-line-strong: rgba(4, 29, 41, 0.24);
  --wn-text: #041d29;
  --wn-muted: #4e4e4e;
  --wn-cyan: #f39000;
  --wn-blue: #d97600;
  --wn-violet: #f6b14c;
  --wn-lime: #f39000;
  --wn-max: 1240px;
  --wn-radius: 28px;
  --wn-shadow: 0 24px 70px rgba(4, 29, 41, 0.12);
}

html {
  scroll-behavior: smooth;
  scroll-padding-top: 92px;
}

body.wnv-site {
  margin: 0;
  background: var(--wn-bg);
  color: var(--wn-text);
  font-family: Inter, "SF Pro Display", "PingFang SC", "Microsoft YaHei", system-ui, sans-serif;
  -webkit-font-smoothing: antialiased;
}

body.wnv-site::before {
  position: fixed;
  inset: 0;
  z-index: -2;
  content: "";
  background:
    radial-gradient(circle at 84% 8%, rgba(243, 144, 0, 0.08), transparent 30%),
    radial-gradient(circle at 15% 55%, rgba(4, 29, 41, 0.035), transparent 25%),
    var(--wn-bg);
}

.wn-shell {
  width: min(calc(100% - 48px), var(--wn-max));
  margin-inline: auto;
}

.wn-skip {
  position: fixed;
  top: 8px;
  left: 8px;
  z-index: 1000;
  padding: 10px 16px;
  color: #fff;
  background: var(--wn-blue);
  border-radius: 999px;
  transform: translateY(-150%);
}

.wn-skip:focus { transform: none; }

.wn-header {
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  z-index: 100;
  border-bottom: 1px solid transparent;
  transition: background .3s ease, border-color .3s ease, backdrop-filter .3s ease;
}

.wn-header.is-scrolled {
  background: rgba(255, 255, 255, 0.88);
  border-color: var(--wn-line);
  backdrop-filter: blur(20px);
}

.wn-nav-wrap {
  display: flex;
  min-height: 82px;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
}

.wn-brand {
  display: inline-flex;
  align-items: center;
  color: var(--wn-text);
  text-decoration: none;
}

.wn-brand-logo { display: block; width: 194px; height: 58px; object-fit: contain; object-position: left center; }

.wn-menu {
  display: flex;
  align-items: center;
  gap: 26px;
}

.wn-menu a {
  position: relative;
  color: #23343c;
  font-size: 14px;
  text-decoration: none;
  transition: color .2s ease;
}

.wn-menu a:not(.wn-language)::after {
  position: absolute;
  right: 0;
  bottom: -9px;
  left: 0;
  height: 1px;
  content: "";
  background: var(--wn-cyan);
  transform: scaleX(0);
  transition: transform .2s ease;
}

.wn-menu a:hover { color: var(--wn-blue); }
.wn-menu a:hover::after { transform: scaleX(1); }

.wn-language {
  display: inline-flex;
  min-width: 50px;
  min-height: 36px;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--wn-line-strong);
  border-radius: 999px;
  background: rgba(243, 144, 0, .055);
}

.wn-menu-toggle {
  display: none;
  width: 44px;
  height: 44px;
  padding: 0;
  color: var(--wn-text);
  border: 1px solid var(--wn-line);
  border-radius: 50%;
  background: transparent;
}

.wn-menu-toggle span,
.wn-menu-toggle::before,
.wn-menu-toggle::after {
  display: block;
  width: 18px;
  height: 1px;
  margin: 5px auto;
  content: "";
  background: currentColor;
  transition: transform .2s ease, opacity .2s ease;
}

.wn-menu-toggle.is-open span { opacity: 0; }
.wn-menu-toggle.is-open::before { transform: translateY(6px) rotate(45deg); }
.wn-menu-toggle.is-open::after { transform: translateY(-6px) rotate(-45deg); }

.wn-main { overflow: hidden; }

.wn-hero {
  position: relative;
  display: grid;
  min-height: min(880px, 92svh);
  box-sizing: border-box;
  align-items: center;
  padding: 132px 0 72px;
  overflow: hidden;
  background-color: #f5f7fa;
  background-image: url("assets/hero/zen-prism-hero-vi.png");
  background-image: image-set(
    url("assets/hero/zen-prism-hero-vi-20260831.webp") type("image/webp"),
    url("assets/hero/zen-prism-hero-vi.png") type("image/png")
  );
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
}

.wn-hero.wn-hero--custom { background-image: var(--wn-home-desktop); }
@media (max-width: 640px) {
  .wn-hero.wn-hero--custom { background-image: var(--wn-home-mobile); }
}
.wn-hero::before {
  position: absolute;
  inset: 0;
  z-index: 0;
  content: "";
  pointer-events: none;
  background: linear-gradient(90deg, rgba(255,255,255,.88) 0%, rgba(255,255,255,.68) 36%, rgba(255,255,255,.18) 65%, rgba(255,255,255,0) 82%);
}

.wn-hero-grid {
  position: relative;
  z-index: 1;
  display: block;
}

.wn-hero-copy { max-width: 1040px; }

.wn-eyebrow {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0 0 24px;
  color: var(--wn-cyan);
  font-size: 12px;
  font-weight: 650;
  letter-spacing: .22em;
  text-transform: uppercase;
}

.wn-eyebrow::before {
  width: 34px;
  height: 1px;
  content: "";
  background: currentColor;
}

.wn-hero h1 {
  max-width: 1040px;
  margin: 0;
  font-size: clamp(52px, 6.9vw, 94px);
  font-weight: 560;
  line-height: .99;
  letter-spacing: -.055em;
}

.wn-gradient-text {
  color: var(--wn-cyan);
  background: none;
}

.wn-hero-lead {
  max-width: 650px;
  margin: 32px 0 0;
  color: var(--wn-muted);
  font-size: clamp(17px, 1.4vw, 20px);
  line-height: 1.8;
}


.wn-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  margin-top: 38px;
}

.wn-button {
  display: inline-flex;
  min-height: 52px;
  align-items: center;
  justify-content: center;
  gap: 12px;
  padding: 0 22px;
  color: #fff;
  border: 1px solid var(--wn-blue);
  border-radius: 999px;
  background: var(--wn-blue);
  box-shadow: 0 12px 30px rgba(243, 144, 0, .22);
  font-size: 14px;
  font-weight: 700;
  text-decoration: none;
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
}

.wn-button:hover {
  color: #fff;
  transform: translateY(-2px);
  background: #c96e00;
  box-shadow: 0 16px 40px rgba(243, 144, 0, .3);
}

.wn-button--ghost {
  color: var(--wn-text);
  border-color: var(--wn-line-strong);
  background: #fff;
  box-shadow: none;
}

.wn-button--ghost:hover { color: var(--wn-text); background: #f7f7f7; }
.wn-button svg { width: 17px; transition: transform .2s ease; }
.wn-button:hover svg { transform: translateX(3px); }

.wn-prism-stage {
  position: relative;
  min-height: 520px;
  perspective: 1000px;
}

.wn-prism-stage::before {
  position: absolute;
  inset: 10% 4% 4%;
  content: "";
  border: 1px solid rgba(255,255,255,.09);
  border-radius: 50%;
  background: radial-gradient(circle, rgba(97,118,255,.15), transparent 64%);
  box-shadow: inset 0 0 80px rgba(94,231,245,.04);
  animation: wn-float 7s ease-in-out infinite;
}

.wn-prism {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 240px;
  height: 290px;
  background:
    linear-gradient(140deg, rgba(255,255,255,.36), rgba(255,255,255,.035) 38%, rgba(97,118,255,.18) 70%, rgba(167,108,255,.28));
  clip-path: polygon(50% 0, 100% 79%, 72% 100%, 0 79%);
  filter: drop-shadow(0 30px 50px rgba(79, 92, 255, .35));
  transform: translate(-50%, -50%) rotate(-5deg);
  animation: wn-prism 9s ease-in-out infinite;
}

.wn-prism::before {
  position: absolute;
  inset: 3px;
  content: "";
  background: linear-gradient(120deg, rgba(255,255,255,.13), rgba(2,5,12,.35) 48%, rgba(94,231,245,.16));
  clip-path: inherit;
}

.wn-ray {
  position: absolute;
  top: 50%;
  left: 48%;
  width: 310px;
  height: 1px;
  transform-origin: left center;
  opacity: .75;
  background: linear-gradient(90deg, var(--wn-cyan), transparent);
  box-shadow: 0 0 12px var(--wn-cyan);
}

.wn-ray--1 { transform: rotate(-19deg); }
.wn-ray--2 { transform: rotate(4deg); background: linear-gradient(90deg, #8290ff, transparent); }
.wn-ray--3 { transform: rotate(25deg); background: linear-gradient(90deg, #c078ff, transparent); }

.wn-lidar-stage {
  position: relative;
  min-height: 540px;
  overflow: hidden;
  border: 1px solid rgba(20, 120, 255, .16);
  border-radius: 40px;
  background:
    radial-gradient(circle at 50% 35%, rgba(62, 140, 255, .22), transparent 38%),
    linear-gradient(160deg, #ffffff, #e7f2ff);
  box-shadow: inset 0 0 90px rgba(62, 140, 255, .06), var(--wn-shadow);
}

.wn-scan-grid {
  position: absolute;
  right: -8%;
  bottom: -42%;
  left: -8%;
  height: 78%;
  opacity: .48;
  background-image:
    linear-gradient(rgba(20,120,255,.14) 1px, transparent 1px),
    linear-gradient(90deg, rgba(20,120,255,.14) 1px, transparent 1px);
  background-size: 36px 36px;
  transform: perspective(500px) rotateX(58deg);
}

.wn-scan-cone {
  position: absolute;
  top: 5%;
  left: 50%;
  width: 450px;
  height: 360px;
  opacity: .72;
  background: conic-gradient(from 205deg at 50% 100%, transparent 0deg, rgba(20,120,255,.46) 19deg, rgba(68,168,255,.13) 38deg, transparent 58deg);
  clip-path: polygon(50% 100%, 0 0, 100% 0);
  filter: blur(.2px) drop-shadow(0 0 16px rgba(20,120,255,.18));
  transform: translateX(-50%);
  animation: wn-scan 5.5s ease-in-out infinite;
}

.wn-range-ring {
  position: absolute;
  top: 49%;
  left: 50%;
  border: 1px solid rgba(20,120,255,.28);
  border-radius: 50%;
  transform: translate(-50%,-50%) rotateX(67deg);
}

.wn-range-ring--1 { width: 300px; height: 300px; }
.wn-range-ring--2 { width: 470px; height: 470px; opacity: .55; }

.wn-lidar-device {
  position: absolute;
  bottom: 94px;
  left: 50%;
  width: 172px;
  height: 188px;
  padding: 92px 18px 18px;
  border: 1px solid rgba(255,255,255,.35);
  border-radius: 32px 32px 18px 18px;
  color: #111923;
  background: linear-gradient(145deg, #f7fafb, #aab9c1 78%);
  box-shadow: 0 35px 65px rgba(0,0,0,.42), inset -16px -12px 25px rgba(26,50,68,.16);
  transform: translateX(-50%);
}

.wn-lidar-device::before {
  position: absolute;
  top: -22px;
  left: 50%;
  width: 122px;
  height: 62px;
  content: "";
  border: 1px solid rgba(255,255,255,.45);
  border-radius: 50%;
  background: linear-gradient(180deg, #eaf2f5, #7d929e);
  box-shadow: 0 12px 18px rgba(0,0,0,.25);
  transform: translateX(-50%);
}

.wn-lidar-lens {
  position: absolute;
  top: -10px;
  left: 50%;
  z-index: 2;
  width: 72px;
  height: 34px;
  border: 3px solid #17252e;
  border-radius: 50%;
  background: radial-gradient(circle at 40% 38%, #88ffe0, #1771a3 34%, #081621 70%);
  box-shadow: 0 0 24px rgba(20,120,255,.3);
  transform: translateX(-50%);
}

.wn-lidar-status {
  position: absolute;
  top: 69px;
  right: 18px;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #19d67d;
  box-shadow: 0 0 9px #19d67d;
}

.wn-lidar-device b { display: block; font-size: 14px; letter-spacing: .11em; }
.wn-lidar-device small { display: block; margin-top: 8px; color: #4b5b66; font-size: 9px; letter-spacing: .15em; }

.wn-wind-line {
  position: absolute;
  left: 7%;
  width: 160px;
  height: 1px;
  opacity: .7;
  background: linear-gradient(90deg, transparent, var(--wn-cyan), transparent);
  animation: wn-wind 4.5s linear infinite;
}
.wn-wind-line::after { position: absolute; top: -3px; right: 12%; width: 7px; height: 7px; content: ""; border-top: 1px solid var(--wn-cyan); border-right: 1px solid var(--wn-cyan); transform: rotate(45deg); }
.wn-wind-line--1 { top: 24%; }
.wn-wind-line--2 { top: 34%; left: 14%; width: 210px; animation-delay: -1.5s; }
.wn-wind-line--3 { top: 45%; left: 2%; width: 135px; animation-delay: -2.6s; }

.wn-orbit {
  position: absolute;
  inset: 16% 7% 9%;
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 50%;
  transform: rotate(23deg);
}

.wn-orbit::before {
  position: absolute;
  top: 17%;
  right: 2%;
  width: 8px;
  height: 8px;
  content: "";
  border-radius: 50%;
  background: var(--wn-cyan);
  box-shadow: 0 0 18px var(--wn-cyan);
}

.wn-hero-index {
  position: absolute;
  right: 0;
  bottom: 12px;
  display: grid;
  width: min(310px, 78%);
  grid-template-columns: repeat(3, 1fr);
  border: 1px solid var(--wn-line);
  border-radius: 18px;
  color: #23466f;
  background: rgba(255, 255, 255, .86);
  box-shadow: 0 12px 30px rgba(24, 78, 145, .1);
  backdrop-filter: blur(16px);
}

.wn-hero-index div { padding: 16px 14px; border-right: 1px solid var(--wn-line); }
.wn-hero-index div:last-child { border: 0; }
.wn-hero-index span { display: block; color: var(--wn-cyan); font-size: 10px; font-weight: 700; letter-spacing: .14em; }
.wn-hero-index strong { display: block; margin-top: 8px; font-size: 11px; font-weight: 500; }
.wn-hero-index--two { width: min(250px, 72%); grid-template-columns: repeat(2, 1fr); }

.wn-section { padding: clamp(92px, 11vw, 150px) 0; }
.wn-section--soft { background: linear-gradient(180deg, #f7f7f7, rgba(247,247,247,.38)); }

.wn-section-head {
  display: grid;
  align-items: end;
  gap: 40px;
  grid-template-columns: .8fr 1.2fr;
  margin-bottom: 58px;
}

.wn-kicker { margin: 0; color: var(--wn-cyan); font-size: 12px; letter-spacing: .18em; text-transform: uppercase; }
.wn-section h2 {
  max-width: 830px;
  margin: 14px 0 0;
  font-size: clamp(38px, 5vw, 66px);
  font-weight: 540;
  line-height: 1.08;
  letter-spacing: -.045em;
}
.wn-section-head > p { max-width: 560px; margin: 0; color: var(--wn-muted); font-size: 17px; line-height: 1.85; }

.wn-product-grid { display: grid; gap: 22px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.wn-product-card {
  position: relative;
  overflow: hidden;
  border: 1px solid var(--wn-line);
  border-radius: var(--wn-radius);
  background: #fff;
  box-shadow: 0 14px 42px rgba(4, 29, 41, .07);
  transition: transform .3s ease, border-color .3s ease, box-shadow .3s ease;
}
.wn-product-card:hover { transform: translateY(-7px); border-color: rgba(243,144,0,.52); box-shadow: 0 24px 58px rgba(4,29,41,.12); }
.wn-product-visual {
  position: relative;
  display: grid;
  min-height: 340px;
  padding: 56px 34px 28px;
  overflow: hidden;
  place-items: center;
  background:
    radial-gradient(circle at 52% 44%, rgba(243,144,0,.12), transparent 36%),
    linear-gradient(rgba(4,29,41,.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(4,29,41,.045) 1px, transparent 1px),
    linear-gradient(145deg, #fff, #f1f1f1);
  background-size: auto, 32px 32px, 32px 32px, auto;
  color: inherit;
  text-decoration: none;
}
.wn-product-visual::after { position: absolute; right: -72px; bottom: -88px; width: 230px; height: 230px; content: ""; border: 1px solid rgba(243,144,0,.18); border-radius: 50%; box-shadow: 0 0 0 34px rgba(243,144,0,.035), 0 0 0 70px rgba(4,29,41,.018); }
.wn-product-visual img { position: relative; z-index: 1; width: 100%; height: 260px; object-fit: contain; filter: drop-shadow(0 22px 28px rgba(4,29,41,.18)); transition: transform .45s ease; }
.wn-product-card:hover .wn-product-visual img { transform: scale(1.025); }
.wn-product-card--1 .wn-product-visual img { border-radius: 18px; }
.wn-product-index, .wn-product-model { position: absolute; top: 24px; z-index: 2; font-size: 10px; font-weight: 700; letter-spacing: .15em; }
.wn-product-index { left: 28px; color: #707070; }
.wn-product-model { right: 28px; padding: 7px 11px; border: 1px solid rgba(243,144,0,.34); border-radius: 99px; color: #b96300; background: rgba(255,255,255,.9); backdrop-filter: blur(10px); }
.wn-product-body { padding: 34px; }
.wn-product-type { margin: 0; color: var(--wn-cyan); font-size: 11px; font-weight: 700; letter-spacing: .13em; text-transform: uppercase; }
.wn-product-card h3 { max-width: 560px; margin: 13px 0 0; font-size: clamp(26px, 2.3vw, 34px); font-weight: 560; line-height: 1.2; letter-spacing: -.03em; }
.wn-product-card h3 a { color: inherit; text-decoration: none; }
.wn-product-description { min-height: 98px; margin: 20px 0 0; color: var(--wn-muted); line-height: 1.78; }
.wn-product-specs { display: grid; margin: 28px 0 0; overflow: hidden; border: 1px solid var(--wn-line); border-radius: 18px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.wn-product-specs div { padding: 18px; border-right: 1px solid var(--wn-line); border-bottom: 1px solid var(--wn-line); background: #f7f7f7; }
.wn-product-specs div:nth-child(2n) { border-right: 0; }
.wn-product-specs div:nth-last-child(-n+2) { border-bottom: 0; }
.wn-product-specs dt { color: var(--wn-blue); font-size: 22px; font-weight: 650; letter-spacing: -.02em; }
.wn-product-specs dd { margin: 7px 0 0; color: #707070; font-size: 11px; }
.wn-card-tags { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 24px; }
.wn-card-tags span { padding: 6px 10px; color: #4e4e4e; border: 1px solid var(--wn-line); border-radius: 99px; background: #f7f7f7; font-size: 10px; }
.wn-product-link { display: inline-flex; margin-top: 25px; align-items: center; gap: 10px; color: var(--wn-text); font-size: 13px; font-weight: 700; text-decoration: none; }
.wn-product-link span { color: var(--wn-cyan); font-size: 18px; transition: transform .2s ease; }
.wn-product-link:hover span { transform: translateX(4px); }
.wn-products-action { display: flex; margin-top: 30px; justify-content: flex-end; }

/* Product archive and details */
.wn-products-archive { background: #fff; }
.wn-product-hero { padding: 148px 0 88px; overflow: hidden; background: linear-gradient(145deg, #f6f9fa, #fff 50%, #fff4e3); }
.wn-product-hero-grid { display: grid; min-height: 590px; align-items: center; gap: clamp(50px, 8vw, 110px); grid-template-columns: minmax(0, 1fr) minmax(380px, .8fr); }
.wn-product-hero-copy .wn-back-link { margin-bottom: 36px; }
.wn-detail-model { margin: 18px 0 0; color: var(--wn-cyan); font-size: 13px; font-weight: 760; letter-spacing: .17em; }
.wn-product-hero h1 { max-width: 760px; margin: 18px 0 0; font-size: clamp(44px, 5.8vw, 76px); font-weight: 470; line-height: 1.08; letter-spacing: -.045em; }
.wn-product-hero .wn-single-lead { max-width: 700px; }
.wn-product-hero-image { position: relative; display: grid; min-height: 520px; place-items: center; border: 1px solid rgba(4,29,41,.1); border-radius: 34px; background: radial-gradient(circle at 50% 46%, rgba(243,144,0,.14), transparent 35%), linear-gradient(145deg,#fff,#edf3f5); }
.wn-product-hero-image::before, .wn-product-hero-image::after { position: absolute; content: ""; border: 1px solid rgba(4,29,41,.09); border-radius: 50%; }
.wn-product-hero-image::before { width: 330px; height: 330px; }
.wn-product-hero-image::after { width: 440px; height: 440px; border-color: rgba(243,144,0,.17); }
.wn-product-hero-image img { position: relative; z-index: 1; width: 88%; height: 400px; object-fit: contain; filter: drop-shadow(0 28px 34px rgba(4,29,41,.2)); }
.wn-product-spec-section { padding-top: 65px; padding-bottom: 65px; }
.wn-detail-specs { display: grid; overflow: hidden; border: 1px solid var(--wn-line); border-radius: 24px; background: #fff; grid-template-columns: repeat(4, minmax(0,1fr)); box-shadow: 0 16px 45px rgba(4,29,41,.06); }
.wn-detail-specs div { display: grid; min-height: 145px; padding: 28px; align-content: center; gap: 10px; border-right: 1px solid var(--wn-line); }
.wn-detail-specs div:last-child { border-right: 0; }
.wn-detail-specs strong { color: var(--wn-blue); font-size: clamp(25px, 3vw, 38px); font-weight: 620; letter-spacing: -.025em; }
.wn-detail-specs span { color: var(--wn-muted); font-size: 12px; }
.wn-product-detail-section { padding-top: 72px; }
.wn-product-detail-grid { display: grid; align-items: start; gap: clamp(50px, 8vw, 110px); grid-template-columns: minmax(250px,.45fr) minmax(0,1fr); }
.wn-product-detail-grid aside { position: sticky; top: 120px; }
.wn-product-detail-grid aside h2 { margin: 18px 0 0; font-size: 38px; }
.wn-detail-tags { display: flex; margin-top: 28px; flex-wrap: wrap; gap: 8px; }
.wn-detail-tags span { padding: 8px 12px; color: #3e555e; border: 1px solid var(--wn-line); border-radius: 99px; background: #f7fafb; font-size: 11px; }
.wn-product-richtext { color: #253b44; font-size: 17px; line-height: 1.9; }
.wn-product-richtext > *:first-child { margin-top: 0; }
.wn-product-richtext h2 { margin: 1.8em 0 .65em; color: var(--wn-text); font-size: 34px; font-weight: 560; line-height: 1.25; }
.wn-product-richtext h3 { margin: 1.6em 0 .6em; color: var(--wn-text); font-size: 25px; }
.wn-product-richtext img { max-width: 100%; height: auto; border-radius: 18px; }
.wn-download-section { padding-top: 80px; }
.wn-download-list { display: grid; gap: 12px; }
.wn-download-list a { display: grid; min-height: 82px; padding: 17px 22px; align-items: center; gap: 18px; color: var(--wn-text); border: 1px solid var(--wn-line); border-radius: 16px; background: #fff; grid-template-columns: 54px minmax(0,1fr) auto 24px; text-decoration: none; transition: border-color .2s ease, transform .2s ease; }
.wn-download-list a:hover { border-color: rgba(243,144,0,.5); transform: translateY(-2px); }
.wn-file-type { display: grid; height: 42px; place-items: center; color: #fff; border-radius: 10px; background: var(--wn-text); font-size: 9px; font-weight: 750; letter-spacing: .08em; }
.wn-download-list strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.wn-download-list small { color: #718087; }
.wn-download-list b { color: var(--wn-cyan); font-size: 20px; }

.wn-process-wrap {
  display: grid;
  overflow: hidden;
  border: 1px solid var(--wn-line);
  border-radius: var(--wn-radius);
  background: #fff;
  box-shadow: 0 14px 42px rgba(4, 29, 41, .06);
  grid-template-columns: repeat(4, 1fr);
}
.wn-process { position: relative; min-height: 270px; padding: 32px; border-right: 1px solid var(--wn-line); }
.wn-process:last-child { border: 0; }
.wn-process b { color: transparent; font-size: 58px; font-weight: 500; -webkit-text-stroke: 1px rgba(243,144,0,.55); }
.wn-process h3 { margin: 38px 0 0; font-size: 20px; font-weight: 550; }
.wn-process p { margin: 12px 0 0; color: var(--wn-muted); font-size: 14px; line-height: 1.7; }

.wn-principle { overflow: hidden; border: 1px solid var(--wn-line); border-radius: 34px; background: #fff; box-shadow: var(--wn-shadow); }
.wn-principle-head { display: grid; padding: clamp(40px, 6vw, 76px); align-items: end; gap: 28px 54px; border-bottom: 1px solid var(--wn-line); grid-template-columns: 1.15fr .85fr; }
.wn-principle-head .wn-kicker { grid-column: 1 / -1; }
.wn-principle-head h2 { margin: 0; font-size: clamp(38px, 4.6vw, 62px); }
.wn-principle-head > p { max-width: 500px; margin: 0; color: var(--wn-muted); font-size: 17px; line-height: 1.8; }
.wn-principle-flow { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.wn-principle-step { position: relative; min-height: 320px; padding: 34px 28px 38px; border-right: 1px solid var(--wn-line); background: #fff; }
.wn-principle-step:last-child { border-right: 0; }
.wn-principle-step:not(:last-child)::after { position: absolute; top: 68px; right: -14px; z-index: 2; display: grid; width: 28px; height: 28px; content: "→"; place-items: center; border: 1px solid rgba(243,144,0,.4); border-radius: 50%; color: var(--wn-cyan); background: #fff; font-size: 15px; }
.wn-principle-icon { display: grid; width: 72px; height: 72px; place-items: center; border-radius: 20px; color: var(--wn-cyan); background: #fff4e5; }
.wn-principle-icon svg { width: 45px; height: 45px; fill: none; stroke: currentColor; stroke-width: 1.65; stroke-linecap: round; stroke-linejoin: round; }
.wn-principle-no { display: block; margin-top: 32px; color: var(--wn-cyan); font-size: 10px; font-weight: 750; letter-spacing: .16em; }
.wn-principle-step h3 { margin: 12px 0 0; font-size: 22px; font-weight: 620; }
.wn-principle-step p { margin: 14px 0 0; color: var(--wn-muted); font-size: 14px; line-height: 1.75; }
.wn-principle-result { display: flex; min-height: 92px; padding: 22px 34px; align-items: center; justify-content: space-between; gap: 24px; color: #fff; background: #041d29; }
.wn-principle-result span { color: #f6b14c; font-size: 10px; font-weight: 750; letter-spacing: .16em; }
.wn-principle-result strong { font-size: clamp(18px, 2vw, 26px); font-weight: 520; }

.wn-values { display: grid; gap: 18px; grid-template-columns: 1.3fr .7fr; }
.wn-value-main, .wn-value-side { border: 1px solid var(--wn-line); border-radius: var(--wn-radius); background: #fff; box-shadow: 0 14px 42px rgba(4, 29, 41, .06); }
.wn-value-main { padding: clamp(36px, 6vw, 80px); }
.wn-value-main blockquote { max-width: 870px; margin: 0; font-size: clamp(31px, 4.4vw, 58px); font-weight: 470; line-height: 1.22; letter-spacing: -.035em; }
.wn-value-main blockquote span { color: var(--wn-cyan); }
.wn-value-main p { max-width: 620px; margin: 30px 0 0; color: var(--wn-muted); line-height: 1.85; }
.wn-value-side { display: grid; overflow: hidden; }
.wn-value-item { display: flex; padding: 30px; flex-direction: column; justify-content: space-between; border-bottom: 1px solid var(--wn-line); }
.wn-value-item:last-child { border: 0; }
.wn-value-item span { color: var(--wn-cyan); font-size: 10px; letter-spacing: .15em; }
.wn-value-item strong { margin-top: 30px; font-size: 20px; font-weight: 520; }

.wn-contact { padding-top: 0; }
.wn-contact-box { position: relative; padding: clamp(48px, 8vw, 100px); overflow: hidden; border: 1px solid rgba(243,144,0,.28); border-radius: 34px; background: linear-gradient(130deg, #fff8ef, #fff1dd 48%, #fff); box-shadow: 0 20px 60px rgba(4,29,41,.08); text-align: center; }
.wn-contact-box::before { position: absolute; top: -160px; left: 50%; width: 420px; height: 420px; content: ""; border-radius: 50%; background: rgba(243,144,0,.16); filter: blur(80px); transform: translateX(-50%); }
.wn-contact-box > * { position: relative; }
.wn-contact-box h2 { max-width: 900px; margin-inline: auto; }
.wn-contact-box p { max-width: 640px; margin: 24px auto 0; color: var(--wn-muted); font-size: 17px; line-height: 1.8; }
.wn-contact-box .wn-actions { justify-content: center; }
.wn-contact-details { display: flex; margin-top: 22px; align-items: center; justify-content: center; flex-wrap: wrap; gap: 10px 22px; color: var(--wn-text); font-size: 14px; }
.wn-contact-details a { color: inherit; text-decoration: none; }
.wn-contact-head { display: grid; margin-bottom: 46px; gap: 20px; grid-template-columns: 1fr 1fr; }
.wn-contact-head .wn-kicker { grid-column: 1 / -1; }
.wn-contact-head h2 { margin: 0; }
.wn-contact-head h1 { max-width: 820px; margin: 0; font-size: clamp(48px,7vw,86px); font-weight: 470; line-height: 1.08; letter-spacing: -.045em; }
.wn-contact-head > p:last-child { max-width: 620px; margin: 7px 0 0; color: var(--wn-muted); font-size: 17px; line-height: 1.8; }
.wn-contact-layout { display: grid; align-items: stretch; gap: 22px; grid-template-columns: minmax(300px,.72fr) minmax(0,1.28fr); }
.wn-contact-channel, .wn-contact-form { padding: clamp(30px,4.5vw,56px); border: 1px solid var(--wn-line); border-radius: 28px; box-shadow: 0 18px 52px rgba(4,29,41,.07); }
.wn-contact-channel { position: relative; overflow: hidden; background: linear-gradient(145deg,#eef6f8,#fff 56%,#fff1de); }
.wn-contact-channel::after { position: absolute; right: -100px; bottom: -110px; width: 280px; height: 280px; content: ""; border: 1px solid rgba(243,144,0,.22); border-radius: 50%; box-shadow: 0 0 0 42px rgba(243,144,0,.04); }
.wn-contact-channel > * { position: relative; z-index: 1; }
.wn-contact-channel h3, .wn-contact-form h3 { margin: 15px 0 0; font-size: clamp(28px,3vw,40px); font-weight: 540; line-height: 1.2; letter-spacing: -.025em; }
.wn-contact-channel > p:not(.wn-kicker) { margin: 20px 0 0; color: var(--wn-muted); line-height: 1.8; }
.wn-contact-email { display: inline-block; max-width: 100%; margin-top: 34px; overflow-wrap: anywhere; color: var(--wn-text); font-size: clamp(17px,2vw,24px); font-weight: 650; text-decoration: none; }
.wn-contact-channel .wn-contact-details { align-items: flex-start; justify-content: flex-start; flex-direction: column; gap: 8px; color: var(--wn-muted); }
.wn-contact-channel .wn-actions { margin-top: 36px; }
.wn-contact-form { background: #fff; }
.wn-contact-form > label { display: grid; margin-top: 18px; gap: 8px; }
.wn-contact-form label > span { color: #425961; font-size: 12px; font-weight: 650; }
.wn-form-grid { display: grid; margin-top: 24px; gap: 16px; grid-template-columns: 1fr 1fr; }
.wn-form-grid label { display: grid; gap: 8px; }
.wn-contact-form input, .wn-contact-form select, .wn-contact-form textarea { width: 100%; box-sizing: border-box; padding: 13px 14px; color: var(--wn-text); border: 1px solid rgba(4,29,41,.18); border-radius: 11px; outline: 0; background: #fbfcfc; font: inherit; transition: border-color .2s ease, box-shadow .2s ease, background .2s ease; }
.wn-contact-form textarea { min-height: 145px; resize: vertical; line-height: 1.6; }
.wn-contact-form input:focus, .wn-contact-form select:focus, .wn-contact-form textarea:focus { border-color: var(--wn-cyan); background: #fff; box-shadow: 0 0 0 3px rgba(243,144,0,.1); }
.wn-contact-form .wn-button { margin-top: 22px; border: 0; cursor: pointer; }
.wn-form-hint { margin: 12px 0 0; color: #76858a; font-size: 11px; }
.wn-form-honeypot { position: absolute !important; left: -10000px !important; width: 1px !important; height: 1px !important; overflow: hidden !important; }
.wn-form-notice { margin: -20px 0 28px; padding: 15px 18px; border-radius: 12px; font-size: 14px; }
.wn-form-notice--success { color: #125b3a; border: 1px solid #b8dfca; background: #effaf4; }
.wn-form-notice--error { color: #8a3527; border: 1px solid #efd0c9; background: #fff5f2; }
.wn-contact-page { min-height: 100vh; background: linear-gradient(145deg,#f7fafb,#fff 52%,#fff6e9); }
.wn-contact-page .wn-contact { padding: 145px 0 110px; }
.wn-contact-page .wn-back-link { margin-bottom: 44px; }

.wn-about-page { min-height: 100vh; background: #fff; }
.wn-about-hero { padding: 145px 0 96px; overflow: hidden; background: linear-gradient(145deg,#f1f7fa,#fff 56%,#fff6e9); }
.wn-about-hero .wn-back-link { margin-bottom: 54px; }
.wn-about-hero-grid { display: grid; align-items: end; gap: 60px; grid-template-columns: minmax(0,1.35fr) minmax(280px,.65fr); }
.wn-about-hero h1 { max-width: 860px; margin: 20px 0 0; font-size: clamp(52px,7.4vw,96px); font-weight: 460; line-height: 1.02; letter-spacing: -.05em; }
.wn-about-hero-grid > p { margin: 0 0 8px; color: var(--wn-muted); font-size: 17px; line-height: 1.85; }
.wn-about-story-grid { display: grid; align-items: start; gap: clamp(50px,8vw,120px); grid-template-columns: minmax(300px,.85fr) minmax(0,1.15fr); }
.wn-about-story blockquote { margin: 0; font-size: clamp(36px,5vw,68px); font-weight: 470; line-height: 1.16; letter-spacing: -.045em; }
.wn-about-story blockquote span { color: var(--wn-cyan); }
.wn-about-story .wn-about-slogan { margin-top: 16px; padding-left: 20px; border-left: 2px solid var(--wn-cyan); font-size: clamp(30px,3.4vw,48px); line-height: 1.35; letter-spacing: -.025em; overflow-wrap: break-word; }
.wn-about-slogan-meaning p { margin: 22px 0 0; color: var(--wn-muted); font-size: 16px; line-height: 1.9; }
.wn-about-story h2 { margin: 16px 0 28px; font-size: clamp(34px,4vw,54px); }
.wn-about-story-grid > div > p:not(.wn-kicker) { margin: 18px 0 0; color: var(--wn-muted); font-size: 16px; line-height: 1.9; }
.wn-about-cap-grid { display: grid; gap: 18px; grid-template-columns: repeat(3,minmax(0,1fr)); }
.wn-about-cap-grid article { min-height: 260px; padding: 34px; border: 1px solid var(--wn-line); border-radius: 24px; background: #fff; box-shadow: 0 14px 42px rgba(4,29,41,.05); }
.wn-about-cap-grid article > span { color: var(--wn-cyan); font-size: 11px; font-weight: 750; letter-spacing: .16em; }
.wn-about-cap-grid h3 { margin: 54px 0 0; font-size: 25px; font-weight: 560; }
.wn-about-cap-grid p { margin: 16px 0 0; color: var(--wn-muted); font-size: 14px; line-height: 1.8; }
.wn-about-values .wn-kicker { margin-bottom: 24px; }
.wn-about-values .wn-value-side { grid-template-columns: repeat(3,minmax(0,1fr)); }
.wn-about-values .wn-value-item { min-height: 180px; border-right: 1px solid var(--wn-line); border-bottom: 0; }
.wn-about-values .wn-value-item:last-child { border-right: 0; }
.wn-about-cta { padding-top: 0; }

/* Content hub */
.wn-insights-home { overflow: hidden; padding-bottom: clamp(64px,7vw,96px); }
.wn-article-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; }
.wn-article-card { min-width: 0; overflow: hidden; border: 1px solid var(--wn-line); border-radius: 24px; background: #fff; box-shadow: 0 15px 48px rgba(4,29,41,.06); transition: transform .25s ease, box-shadow .25s ease; }
.wn-article-card:hover { box-shadow: 0 22px 58px rgba(4,29,41,.12); transform: translateY(-5px); }
.wn-article-image { display: block; height: 230px; overflow: hidden; color: inherit; background: #eaf2f5; text-decoration: none; }
.wn-article-image img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.wn-article-card:hover .wn-article-image img { transform: scale(1.035); }
.wn-article-placeholder { position: relative; display: grid; width: 100%; height: 100%; place-items: center; overflow: hidden; color: #fff; background: linear-gradient(145deg, #062837, #0c516b); }
.wn-article-placeholder::before, .wn-article-placeholder::after { position: absolute; content: ""; border: 1px solid rgba(255,255,255,.3); border-radius: 50%; }
.wn-article-placeholder::before { width: 240px; height: 240px; right: -80px; top: -100px; }
.wn-article-placeholder::after { width: 170px; height: 170px; left: -65px; bottom: -95px; border-color: rgba(243,144,0,.5); }
.wn-article-placeholder i { position: absolute; width: 3px; height: 180%; background: rgba(243,144,0,.86); box-shadow: 0 0 22px rgba(243,144,0,.55); transform: rotate(53deg); }
.wn-article-placeholder b { position: relative; font-size: 13px; letter-spacing: .26em; }
.wn-article-body { padding: 25px 26px 28px; }
.wn-article-meta { display: flex; align-items: center; justify-content: space-between; gap: 16px; color: #737f84; font-size: 11px; letter-spacing: .08em; text-transform: uppercase; }
.wn-article-meta span { color: var(--wn-blue); font-weight: 750; }
.wn-article-card h3 { margin: 18px 0 0; font-size: 23px; font-weight: 590; line-height: 1.38; letter-spacing: -.015em; }
.wn-article-card h3 a { color: inherit; text-decoration: none; }
.wn-article-card p { min-height: 72px; margin: 14px 0 0; color: var(--wn-muted); font-size: 14px; line-height: 1.72; }
.wn-card-link, .wn-text-link { display: inline-flex; margin-top: 24px; align-items: center; gap: 10px; color: var(--wn-text); font-size: 13px; font-weight: 700; text-decoration: none; }
.wn-card-link span, .wn-text-link span { color: var(--wn-cyan); font-size: 18px; transition: transform .2s ease; }
.wn-card-link:hover span, .wn-text-link:hover span { transform: translateX(4px); }
.wn-case-facts { display: flex; margin-top: 17px; flex-wrap: wrap; gap: 8px; }
.wn-case-facts span { padding: 6px 10px; color: #24505e; border: 1px solid #d8e5e9; border-radius: 99px; background: #f4f9fa; font-size: 11px; }
.wn-content-empty { display: grid; min-height: 230px; padding: 44px; place-items: center; align-content: center; border: 1px dashed rgba(4,29,41,.22); border-radius: 24px; background: rgba(255,255,255,.62); text-align: center; }
.wn-content-empty span { color: var(--wn-cyan); font-size: 10px; font-weight: 750; letter-spacing: .18em; }
.wn-content-empty h2 { margin: 16px 0 0; font-size: 30px; }
.wn-content-empty p { max-width: 620px; margin: 13px auto 0; color: var(--wn-muted); line-height: 1.75; }
.wn-insights-action { display: flex; margin-top: 32px; justify-content: flex-end; }

.wn-content-archive, .wn-article-single { background: #fff; }
.wn-archive-hero, .wn-single-hero { padding: 174px 0 86px; background: linear-gradient(135deg, #f7fafb, #fff 52%, #fff6e9); }
.wn-archive-hero h1, .wn-single-hero h1 { max-width: 900px; margin: 19px 0 0; font-size: clamp(46px, 7vw, 84px); font-weight: 470; line-height: 1.08; letter-spacing: -.045em; }
.wn-archive-hero > .wn-shell > p:last-child { max-width: 680px; margin: 26px 0 0; color: var(--wn-muted); font-size: 17px; line-height: 1.8; }
.wn-archive-list { padding-top: 54px; }
.wn-filter-tabs { display: flex; margin-bottom: 40px; flex-wrap: wrap; gap: 10px; }
.wn-filter-tabs a { padding: 10px 17px; color: #35515c; border: 1px solid var(--wn-line); border-radius: 99px; background: #fff; font-size: 13px; text-decoration: none; transition: color .2s ease, background .2s ease, border-color .2s ease; }
.wn-filter-tabs a:hover, .wn-filter-tabs a.is-active { color: #fff; border-color: var(--wn-text); background: var(--wn-text); }
.navigation.pagination { margin-top: 46px; }
.nav-links { display: flex; justify-content: center; gap: 8px; }
.nav-links .page-numbers { display: grid; min-width: 40px; height: 40px; place-items: center; color: var(--wn-text); border: 1px solid var(--wn-line); border-radius: 50%; text-decoration: none; }
.nav-links .current { color: #fff; border-color: var(--wn-text); background: var(--wn-text); }

.wn-single-shell, .wn-single-content, .wn-single-footer { max-width: 900px; }
.wn-back-link { display: inline-flex; margin-bottom: 40px; color: #4e6872; font-size: 13px; text-decoration: none; }
.wn-single-hero .wn-article-meta { justify-content: flex-start; gap: 22px; }
.wn-single-lead { max-width: 760px; margin: 28px 0 0; color: var(--wn-muted); font-size: 19px; line-height: 1.8; }
.wn-single-facts { display: flex; margin-top: 34px; flex-wrap: wrap; gap: 14px; }
.wn-single-facts > span { display: grid; min-width: 170px; padding: 15px 19px; gap: 6px; border-left: 2px solid var(--wn-cyan); background: rgba(255,255,255,.65); }
.wn-single-facts small { color: #718187; font-size: 10px; letter-spacing: .1em; text-transform: uppercase; }
.wn-single-facts strong { font-size: 15px; }
.wn-single-cover { max-width: 1120px; margin-top: 70px; }
.wn-single-cover img { display: block; width: 100%; max-height: 680px; object-fit: cover; border-radius: 28px; }
.wn-single-content { padding-top: 70px; color: #253b44; font-size: 17px; line-height: 1.9; }
.wn-single-content > *:first-child { margin-top: 0; }
.wn-single-content h2, .wn-single-content h3 { margin: 2em 0 .7em; color: var(--wn-text); line-height: 1.3; }
.wn-single-content h2 { font-size: 33px; }
.wn-single-content h3 { font-size: 25px; }
.wn-single-content a { color: var(--wn-blue); }
.wn-single-content img { height: auto; border-radius: 16px; }
.wn-single-content blockquote { margin: 2em 0; padding: 20px 28px; border-left: 3px solid var(--wn-cyan); background: #f7fafb; }
.wn-single-footer { padding-top: 28px; padding-bottom: 100px; border-top: 1px solid var(--wn-line); }

.wn-footer { padding: 34px 0; border-top: 1px solid var(--wn-line); }
.wn-footer-inner { display: flex; align-items: center; justify-content: space-between; gap: 24px; color: #666; font-size: 12px; }
.wn-footer-links { display: flex; gap: 22px; }
.wn-footer a { color: var(--wn-blue); text-decoration: none; }
.wn-footer-legal { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 20px; line-height: 1.8; }
.wn-footer .wn-icp-link { color: #666; }
.wn-footer .wn-icp-link:hover { color: var(--wn-blue); text-decoration: underline; }
.wn-footer .wn-icp-link:focus-visible { outline: 2px solid var(--wn-blue); outline-offset: 4px; }

[data-reveal] { opacity: 0; transform: translateY(24px); transition: opacity .7s ease, transform .7s ease; }
[data-reveal].is-visible { opacity: 1; transform: none; }

@keyframes wn-float { 0%,100% { transform: translateY(0) scale(1); } 50% { transform: translateY(-14px) scale(1.02); } }
@keyframes wn-prism { 0%,100% { transform: translate(-50%,-50%) rotate(-5deg) translateY(0); } 50% { transform: translate(-50%,-50%) rotate(2deg) translateY(-14px); } }
@keyframes wn-spin { to { transform: translate(-50%,-50%) rotate(360deg); } }
@keyframes wn-scan { 0%,100% { opacity: .42; transform: translateX(-50%) rotate(-4deg); } 50% { opacity: .85; transform: translateX(-50%) rotate(4deg); } }
@keyframes wn-wind { 0% { opacity: 0; transform: translateX(-25px); } 25%,70% { opacity: .75; } 100% { opacity: 0; transform: translateX(120px); } }

@media (max-width: 980px) {
  .wn-menu-toggle { display: block; }
  .wn-menu { position: fixed; top: 72px; right: 20px; left: 20px; display: grid; padding: 22px; gap: 8px; border: 1px solid var(--wn-line); border-radius: 20px; background: rgba(255,255,255,.98); box-shadow: var(--wn-shadow); opacity: 0; pointer-events: none; transform: translateY(-12px); transition: opacity .2s ease, transform .2s ease; }
  .wn-menu.is-open { opacity: 1; pointer-events: auto; transform: none; }
  .wn-menu a { padding: 12px 8px; }
  .wn-language { justify-self: start; padding-inline: 15px !important; }
  .wn-hero-grid { grid-template-columns: 1fr; }
  .wn-hero-copy { max-width: 780px; }
  .wn-prism-stage { min-height: 430px; }
  .wn-lidar-stage { min-height: 500px; }
  .wn-prism { width: 205px; height: 250px; }
  .wn-section-head { grid-template-columns: 1fr; }
  .wn-product-grid { grid-template-columns: 1fr; }
  .wn-product-description { min-height: 0; }
  .wn-process-wrap { grid-template-columns: 1fr 1fr; }
  .wn-process:nth-child(2) { border-right: 0; }
  .wn-process:nth-child(-n+2) { border-bottom: 1px solid var(--wn-line); }
  .wn-principle-head { grid-template-columns: 1fr; }
  .wn-principle-head .wn-kicker { grid-column: auto; }
  .wn-principle-flow { grid-template-columns: 1fr 1fr; }
  .wn-principle-step { border-bottom: 1px solid var(--wn-line); }
  .wn-principle-step:nth-child(2n) { border-right: 0; }
  .wn-principle-step:nth-last-child(-n+2) { border-bottom: 0; }
  .wn-principle-step::after { display: none !important; }
  .wn-values { grid-template-columns: 1fr; }
  .wn-article-grid { grid-template-columns: 1fr 1fr; }
  .wn-product-hero-grid { min-height: auto; grid-template-columns: 1fr; }
  .wn-product-hero-image { min-height: 430px; }
  .wn-detail-specs { grid-template-columns: 1fr 1fr; }
  .wn-detail-specs div:nth-child(2n) { border-right: 0; }
  .wn-detail-specs div:nth-child(-n+2) { border-bottom: 1px solid var(--wn-line); }
  .wn-product-detail-grid { grid-template-columns: 1fr; }
  .wn-product-detail-grid aside { position: static; }
  .wn-contact-head { grid-template-columns: 1fr; }
  .wn-contact-head .wn-kicker { grid-column: auto; }
  .wn-contact-layout { grid-template-columns: 1fr; }
  .wn-about-hero-grid, .wn-about-story-grid { grid-template-columns: 1fr; }
  .wn-about-cap-grid { grid-template-columns: 1fr; }
}

@media (min-width: 641px) and (max-width: 1200px) {
  .wn-hero { background-position: 62% center; }
}

@media (max-width: 640px) {
  .wn-shell { width: min(calc(100% - 28px), var(--wn-max)); }
  .wn-nav-wrap { min-height: 70px; }
  .wn-brand-logo { width: 154px; height: 47px; }
  .wn-hero {
    min-height: 100svh;
    padding: 116px 0 56px;
    background-image: url("assets/hero/zen-prism-hero-mobile-vi.png");
    background-image: image-set(
      url("assets/hero/zen-prism-hero-mobile-vi-20260831.webp") type("image/webp"),
      url("assets/hero/zen-prism-hero-mobile-vi.png") type("image/png")
    );
    background-position: center calc(50% - 70px);
  }
  .wn-hero::before { background: linear-gradient(180deg, rgba(255,255,255,.95) 0%, rgba(255,255,255,.82) 52%, rgba(255,255,255,.34) 78%, rgba(255,255,255,.08) 100%); }
  .wn-hero h1 { font-size: clamp(46px, 14vw, 66px); }
  .wn-hero-lead { margin-top: 25px; font-size: 16px; }
  .wn-actions { align-items: stretch; flex-direction: column; }
  .wn-button { width: 100%; }
  .wn-prism-stage { min-height: 350px; margin-top: -10px; }
  .wn-lidar-stage { min-height: 410px; margin-top: 8px; border-radius: 26px; }
  .wn-lidar-device { bottom: 82px; width: 146px; height: 164px; padding-top: 80px; }
  .wn-scan-cone { top: 4%; width: 350px; height: 280px; }
  .wn-range-ring--1 { width: 230px; height: 230px; }
  .wn-range-ring--2 { width: 350px; height: 350px; }
  .wn-prism { width: 160px; height: 196px; }
  .wn-ray { width: 220px; }
  .wn-hero-index { right: 50%; width: 94%; transform: translateX(50%); }
  .wn-hero-index div { padding: 13px 8px; }
  .wn-hero-index strong { font-size: 9px; }
  .wn-section { padding: 86px 0; }
  .wn-section-head { margin-bottom: 38px; }
  .wn-section h2 { font-size: 39px; }
  .wn-section-head > p { font-size: 15px; }
  .wn-product-visual { min-height: 280px; padding: 52px 22px 20px; }
  .wn-product-visual img { height: 220px; }
  .wn-product-body { padding: 26px; }
  .wn-product-specs div { padding: 15px; }
  .wn-product-specs dt { font-size: 19px; }
  .wn-process-wrap { grid-template-columns: 1fr; }
  .wn-process { min-height: 220px; border-right: 0; border-bottom: 1px solid var(--wn-line); }
  .wn-process:nth-child(3) { border-bottom: 1px solid var(--wn-line); }
  .wn-process b { font-size: 46px; }
  .wn-process h3 { margin-top: 22px; }
  .wn-principle-head { padding: 32px 26px; }
  .wn-principle-flow { grid-template-columns: 1fr; }
  .wn-principle-step { min-height: auto; padding: 28px 26px 32px; border-right: 0; border-bottom: 1px solid var(--wn-line) !important; }
  .wn-principle-step:last-child { border-bottom: 0 !important; }
  .wn-principle-result { align-items: flex-start; flex-direction: column; padding: 25px 26px; }
  .wn-value-main, .wn-value-item { padding: 28px; }
  .wn-contact-box { padding-inline: 26px; }
  .wn-footer-inner { align-items: flex-start; flex-direction: column; }
  .wn-article-grid { grid-template-columns: 1fr; }
  .wn-article-image { height: 215px; }
  .wn-article-card p { min-height: 0; }
  .wn-content-empty { min-height: 200px; padding: 32px 24px; }
  .wn-insights-home { padding-bottom: 58px; }
  .wn-archive-hero, .wn-single-hero { padding: 130px 0 65px; }
  .wn-archive-hero h1, .wn-single-hero h1 { font-size: 43px; }
  .wn-single-lead { font-size: 17px; }
  .wn-single-cover { margin-top: 30px; }
  .wn-single-cover img { border-radius: 18px; }
  .wn-single-content { padding-top: 46px; font-size: 16px; }
  .wn-product-hero { padding: 122px 0 64px; }
  .wn-product-hero h1 { font-size: 42px; }
  .wn-product-hero-image { min-height: 330px; }
  .wn-product-hero-image::before { width: 220px; height: 220px; }
  .wn-product-hero-image::after { width: 290px; height: 290px; }
  .wn-product-hero-image img { height: 270px; }
  .wn-detail-specs div { min-height: 120px; padding: 20px; }
  .wn-detail-specs strong { font-size: 25px; }
  .wn-product-richtext { font-size: 16px; }
  .wn-download-list a { gap: 12px; grid-template-columns: 46px minmax(0,1fr) 22px; }
  .wn-download-list small { display: none; }
  .wn-form-grid { grid-template-columns: 1fr; }
  .wn-contact-channel, .wn-contact-form { padding: 28px 24px; border-radius: 22px; }
  .wn-contact-page .wn-contact { padding: 112px 0 76px; }
  .wn-contact-head h1 { font-size: 43px; }
  .wn-about-hero { padding: 112px 0 72px; }
  .wn-about-hero .wn-back-link { margin-bottom: 38px; }
  .wn-about-hero h1 { font-size: 49px; }
  .wn-about-hero-grid { gap: 28px; }
  .wn-about-cap-grid article { min-height: 220px; padding: 28px 24px; }
  .wn-about-values .wn-value-side { grid-template-columns: 1fr; }
  .wn-about-values .wn-value-item { min-height: 145px; border-right: 0; border-bottom: 1px solid var(--wn-line); }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; }
  [data-reveal] { opacity: 1; transform: none; }
}