@font-face { font-family: Geist; font-style: normal; font-weight: 100 900; font-display: swap; src: url("../fonts/geist-8ac0455e797f/geist-ff2310f5.woff2") format("woff2"); unicode-range: U+460-52F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F; }
@font-face { font-family: Geist; font-style: normal; font-weight: 100 900; font-display: swap; src: url("../fonts/geist-8ac0455e797f/geist-875ccdd4.woff2") format("woff2"); unicode-range: U+301, U+400-45F, U+490-491, U+4B0-4B1, U+2116; }
@font-face { font-family: Geist; font-style: normal; font-weight: 100 900; font-display: swap; src: url("../fonts/geist-8ac0455e797f/geist-52306abf.woff2") format("woff2"); unicode-range: U+102-103, U+110-111, U+128-129, U+168-169, U+1A0-1A1, U+1AF-1B0, U+300-301, U+303-304, U+308-309, U+323, U+329, U+1EA0-1EF9, U+20AB; }
@font-face { font-family: Geist; font-style: normal; font-weight: 100 900; font-display: swap; src: url("../fonts/geist-8ac0455e797f/geist-001175b1.woff2") format("woff2"); unicode-range: U+100-2BA, U+2BD-2C5, U+2C7-2CC, U+2CE-2D7, U+2DD-2FF, U+304, U+308, U+329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: Geist; font-style: normal; font-weight: 100 900; font-display: swap; src: url("../fonts/geist-8ac0455e797f/geist-98bbbccb.woff2") format("woff2"); unicode-range: U+0-FF, U+131, U+152-153, U+2BB-2BC, U+2C6, U+2DA, U+2DC, U+304, U+308, U+329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Geist Fallback"; src: local("Arial"); ascent-override: 95.94%; descent-override: 28.16%; line-gap-override: 0%; size-adjust: 104.76%; }
@font-face { font-family: "Geist Mono"; font-style: normal; font-weight: 100 900; font-display: swap; src: url("../fonts/geist-mono-00e989178794/geist-mono-f6b33328.woff2") format("woff2"); unicode-range: U+460-52F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F; }
@font-face { font-family: "Geist Mono"; font-style: normal; font-weight: 100 900; font-display: swap; src: url("../fonts/geist-mono-00e989178794/geist-mono-44e03052.woff2") format("woff2"); unicode-range: U+301, U+400-45F, U+490-491, U+4B0-4B1, U+2116; }
@font-face { font-family: "Geist Mono"; font-style: normal; font-weight: 100 900; font-display: swap; src: url("../fonts/geist-mono-00e989178794/geist-mono-0638449e.woff2") format("woff2"); unicode-range: U+2000-2001, U+2004-2008, U+200A, U+23B8-23BD, U+2500-259F; }
@font-face { font-family: "Geist Mono"; font-style: normal; font-weight: 100 900; font-display: swap; src: url("../fonts/geist-mono-00e989178794/geist-mono-971fb274.woff2") format("woff2"); unicode-range: U+102-103, U+110-111, U+128-129, U+168-169, U+1A0-1A1, U+1AF-1B0, U+300-301, U+303-304, U+308-309, U+323, U+329, U+1EA0-1EF9, U+20AB; }
@font-face { font-family: "Geist Mono"; font-style: normal; font-weight: 100 900; font-display: swap; src: url("../fonts/geist-mono-00e989178794/geist-mono-44745446.woff2") format("woff2"); unicode-range: U+100-2BA, U+2BD-2C5, U+2C7-2CC, U+2CE-2D7, U+2DD-2FF, U+304, U+308, U+329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Geist Mono"; font-style: normal; font-weight: 100 900; font-display: swap; src: url("../fonts/geist-mono-00e989178794/geist-mono-013b2f2f.woff2") format("woff2"); unicode-range: U+0-FF, U+131, U+152-153, U+2BB-2BC, U+2C6, U+2DA, U+2DC, U+304, U+308, U+329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Geist Mono Fallback"; src: local("Arial"); ascent-override: 74.67%; descent-override: 21.92%; line-gap-override: 0%; size-adjust: 134.59%; }

:root {
  --font-geist-sans: "Geist", "Geist Fallback";
  --font-geist-mono: "Geist Mono", "Geist Mono Fallback";
  --ink: #f5f5f7;
  --muted: #a1a1a6;
  --blue: #2997ff;
  --blue-deep: #0071e3;
  --tandem-cyan: #a7f2ff;
  --tandem-blue: #448cff;
  --tandem-indigo: #6f68ff;
  --tandem-violet: #c47cff;
  --tandem-rose: #ff7fb7;
  --tandem-warm: #ffd49a;
  --night: #000;
  --panel: #1d1d1f;
}

/* The standalone template is rendered after The7/Elementor. This scoped
   preflight restores the same baseline that Tailwind supplies to the source
   site without changing any retained WordPress page. */
.hpt-home *,
.hpt-home *::before,
.hpt-home *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  border: 0 solid;
}
.hpt-home :where(h1,h2,h3,h4,h5,h6) { font-size: inherit; font-weight: inherit; }
.hpt-home :where(ol,ul,menu) { list-style: none; }
.hpt-home :where(button,input,optgroup,select,textarea) { font: inherit; color: inherit; letter-spacing: inherit; background: transparent; }
.hpt-home :where(button,[role="button"]) { cursor: pointer; }
.hpt-home :where(img,svg,video,canvas,audio,iframe,embed,object) { display: block; vertical-align: middle; }
.hpt-home :where(img,video) { max-width: 100%; height: auto; }
.hpt-home :where(table) { border-collapse: collapse; border-color: inherit; text-indent: 0; }

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }

body {
  margin: 0;
  overflow-x: hidden;
  background: var(--night);
  color: var(--ink);
  font-family: var(--font-geist-sans), "PingFang SC", "Helvetica Neue", Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
}

body.hpt-home-template { min-width: 320px; }
body.hpt-home-template .hpt-home {
  width: 100%;
  min-height: 100vh;
  overflow: clip;
  background: #000;
  color: var(--ink);
  font-family: var(--font-geist-sans), "PingFang SC", "Helvetica Neue", Arial, sans-serif;
  font-size: 16px;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}
.hpt-home button { font-family: inherit; }
.hpt-home img { max-width: 100%; }
.hpt-home ul { margin: 0; padding: 0; list-style: none; }

a { color: inherit; text-decoration: none; }

.site-header {
  position: fixed;
  z-index: 50;
  top: 0;
  left: 0;
  width: 100%;
  height: 56px;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  padding: 0 max(24px, calc((100vw - 1120px) / 2));
  background: rgba(4, 7, 12, 0.18);
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
  -webkit-backdrop-filter: saturate(125%) blur(8px);
  backdrop-filter: saturate(125%) blur(8px);
  transition: background-color .36s ease, border-color .36s ease, box-shadow .36s ease, backdrop-filter .36s ease;
}

.site-header.is-scrolled,
body.hpt-menu-open .site-header {
  background: rgba(8, 10, 15, 0.72);
  border-bottom-color: rgba(255, 255, 255, 0.12);
  box-shadow: 0 10px 32px rgba(0, 0, 0, 0.16);
  -webkit-backdrop-filter: saturate(160%) blur(22px);
  backdrop-filter: saturate(160%) blur(22px);
}

.brand {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 18px;
  font-weight: 650;
  letter-spacing: -0.02em;
}

.brand-logo {
  display: block;
  width: 126px;
  height: auto;
}

.brand-mark {
  position: relative;
  width: 23px;
  height: 23px;
  transform: rotate(45deg);
}

.brand-mark i {
  position: absolute;
  inset: 0 11px 0 0;
  display: block;
  border-radius: 2px;
  background: linear-gradient(160deg, #a7f2ff, #448cff 70%);
}

.brand-mark i:last-child {
  inset: 0 0 0 12px;
  background: linear-gradient(160deg, #ffd49a, #ff6b95 70%);
}

.site-header nav {
  display: flex;
  align-items: center;
  gap: 34px;
  color: #d2d2d7;
  font-size: 13px;
}

.site-header nav a,
.text-link { transition: color 180ms ease; }
.site-header nav a:hover,
.text-link:hover { color: #fff; }

.site-header nav a { position: relative; }
.site-header nav a::after { content:''; position:absolute; left:50%; bottom:-9px; width:4px; height:4px; border-radius:50%; background:linear-gradient(135deg,var(--tandem-cyan),var(--tandem-violet)); box-shadow:0 0 12px rgba(106,161,255,.72); opacity:0; transform:translateX(-50%) scale(.35); transition:opacity .24s ease,transform .34s cubic-bezier(.2,.8,.2,1); }
.site-header nav a.is-active { color:#fff; }
.site-header nav a.is-active::after { opacity:1; transform:translateX(-50%) scale(1); }

.page-progress { position:fixed; z-index:60; top:55px; left:0; right:0; height:2px; pointer-events:none; overflow:hidden; }
.page-progress span { --page-progress:0; display:block; width:100%; height:100%; background:linear-gradient(90deg,var(--tandem-cyan),var(--tandem-blue) 42%,var(--tandem-violet) 72%,var(--tandem-rose)); box-shadow:0 0 12px rgba(108,151,255,.62); transform:scaleX(var(--page-progress)); transform-origin:left center; will-change:transform; }

.nav-cta {
  justify-self: end;
  padding: 7px 14px;
  border-radius: 980px;
  background: var(--blue-deep);
  font-size: 13px;
}

.hero {
  position: relative;
  min-height: 980px;
  overflow: hidden;
  padding: 172px max(24px, calc((100vw - 1120px) / 2)) 60px;
  background: radial-gradient(circle at 66% 44%, rgba(38, 103, 169, 0.18), transparent 31%), #000;
}

.hero-aura {
  position: absolute;
  top: -260px;
  right: -180px;
  width: 760px;
  height: 760px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(136, 219, 255, 0.2), rgba(94, 93, 255, 0.06) 38%, transparent 70%);
  filter: blur(24px);
}

.hero-copy { position: relative; z-index: 2; max-width: 760px; }

.eyebrow {
  margin: 0 0 22px;
  color: #a6ddff;
  font-size: 14px;
  font-weight: 650;
  letter-spacing: 0.13em;
}

.hero h1 {
  margin: 0;
  font-size: clamp(64px, 7.2vw, 104px);
  line-height: 0.98;
  letter-spacing: -0.06em;
  font-weight: 650;
}

.hero h1 span {
  display: block;
  padding-bottom: 0.08em;
  color: transparent;
  background: linear-gradient(92deg, #f5f5f7 0%, #a4e8ff 38%, #87a8ff 68%, #efadff 100%);
  -webkit-background-clip: text;
  background-clip: text;
}

.hero-lead {
  max-width: 620px;
  margin: 30px 0 0;
  color: #d2d2d7;
  font-size: clamp(22px, 2.2vw, 30px);
  line-height: 1.32;
  letter-spacing: -0.025em;
  font-weight: 600;
}

.hero-actions { display: flex; align-items: center; gap: 28px; margin-top: 34px; }
.button { display: inline-flex; min-height: 46px; align-items: center; justify-content: center; padding: 0 22px; border-radius: 980px; font-size: 16px; }
.button-primary { background: var(--blue-deep); }
.text-link { color: var(--blue); font-size: 17px; }
.text-link span { font-size: 26px; vertical-align: -2px; }

.device-stage {
  position: absolute;
  z-index: 1;
  right: max(-80px, calc((100vw - 1340px) / 2));
  top: 278px;
  width: min(52vw, 700px);
  height: 530px;
  perspective: 1200px;
}

.device-stage::before {
  content: '';
  position: absolute;
  inset: 10% 2% 4% 3%;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(68, 140, 255, .18), rgba(196, 124, 255, .08) 38%, transparent 68%);
  filter: blur(30px);
  animation: device-aura-cycle 8.6s ease-in-out infinite;
}

.device-stack {
  position: absolute;
  top: 120px;
  left: 12%;
  width: 78%;
  transform: rotateX(58deg) rotateZ(-25deg);
  transform-style: preserve-3d;
  filter: drop-shadow(0 48px 70px rgba(51, 116, 255, 0.22));
  animation: device-stack-breathe 8.6s cubic-bezier(.36, 0, .2, 1) infinite;
}

.device-layer {
  --closed-gap: -13px;
  --open-gap: 15px;
  --open-y: 0px;
  --open-z: 0px;
  position: relative;
  height: 46px;
  margin-top: var(--closed-gap);
  overflow: visible;
  border-radius: 4px;
  border: 1px solid rgba(255, 255, 255, 0.34);
  box-shadow: inset 0 1px rgba(255, 255, 255, 0.34), 0 10px 22px rgba(0, 0, 0, 0.34);
  transform-style: preserve-3d;
  will-change: transform, margin-top;
  animation: device-layer-cycle 8.6s cubic-bezier(.36, 0, .2, 1) infinite;
}

.device-layer::after {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  background: linear-gradient(112deg, rgba(255,255,255,.24), transparent 28%, transparent 70%, rgba(255,255,255,.08));
  mix-blend-mode: screen;
}

.device-layer:nth-child(1) { --closed-gap: 0px; --open-gap: 0px; --open-y: -22px; --open-z: 58px; }
.device-layer:nth-child(2) { --open-y: -10px; --open-z: 34px; }
.device-layer:nth-child(3) { --open-y: 0px; --open-z: 12px; }
.device-layer:nth-child(4) { --open-y: 9px; --open-z: -8px; }
.device-layer:nth-child(5) { --open-y: 18px; --open-z: -26px; }

.device-stage:hover .device-layer,
.device-stage:hover .device-stack,
.device-stage:hover .device-layer span,
.device-stage:hover .device-layer b,
.device-stage:hover .device-caption span,
.device-stage:hover::before {
  animation-play-state: paused;
}

.device-layer span {
  position: absolute;
  left: calc(100% + 24px);
  top: 10px;
  width: 132px;
  color: rgba(245, 245, 247, 0.62);
  font-size: 12px;
  transform: rotateZ(25deg) rotateX(-58deg);
  transform-origin: left center;
  opacity: 0;
  animation: device-label-cycle 8.6s ease-in-out infinite;
}

.device-layer b {
  position: absolute;
  left: 26px;
  top: 12px;
  color: rgba(255, 255, 255, 0.72);
  font-size: 11px;
  letter-spacing: 0.05em;
  font-weight: 550;
  opacity: 0;
  animation: device-label-cycle 8.6s ease-in-out infinite;
}

.layer-glass { background: linear-gradient(92deg, rgba(167, 242, 255, .72), rgba(68, 140, 255, .56) 58%, rgba(196, 124, 255, .42)); }
.layer-contact { height: 30px; background: linear-gradient(90deg, #bdf6ff, #6ec6ff 54%, #7f8cff); }
.layer-perovskite { height: 70px; background: linear-gradient(90deg, #ff7fb7, #c47cff 42%, #6f68ff 74%, #3e58b7); }
.layer-junction { height: 28px; background: linear-gradient(90deg, #a7f2ff, #74c8ff 50%, #b894ff); }
.layer-silicon {
  height: 118px;
  background:
    linear-gradient(125deg, transparent 0 58%, rgba(167,242,255,.08) 58% 60%, transparent 60%),
    linear-gradient(90deg, #0b153a, #203b84 50%, #35256f 80%, #201743);
}

.sun-beam {
  position: absolute;
  top: -80px;
  width: 3px;
  height: 250px;
  background: linear-gradient(to bottom, transparent, rgba(255, 239, 178, 0.9), transparent);
  box-shadow: 0 0 20px #ffed9e;
  transform: rotate(22deg);
}

.beam-left { left: 39%; }
.beam-right { left: 58%; top: -35px; }

.electron-flow { position: absolute; bottom: 78px; left: 30%; display: flex; gap: 44px; }

.electron-flow i {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: #8ef3ff;
  box-shadow: 0 0 18px 6px rgba(105, 231, 255, 0.72);
  animation: pulse 2.2s ease-in-out infinite;
}

.electron-flow i:nth-child(2) { animation-delay: 0.45s; }
.electron-flow i:nth-child(3) { animation-delay: 0.9s; }

.device-caption {
  position: absolute;
  bottom: 22px;
  left: 22%;
  min-width: 220px;
  color: #6e6e73;
  font-family: var(--font-geist-mono), monospace;
  font-size: 11px;
  letter-spacing: 0.16em;
}

.device-caption span { position: absolute; inset: 0 auto auto 0; white-space: nowrap; }
.device-caption span:first-child { animation: device-caption-closed 8.6s ease-in-out infinite; }
.device-caption span:last-child { opacity: 0; color: #a7cfff; animation: device-caption-open 8.6s ease-in-out infinite; }

.hero-foot {
  position: absolute;
  z-index: 3;
  bottom: 58px;
  left: max(24px, calc((100vw - 1120px) / 2));
  right: max(24px, calc((100vw - 1120px) / 2));
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  padding-top: 22px;
  border-top: 1px solid rgba(255, 255, 255, 0.15);
  color: #86868b;
  font-size: 14px;
}

.hero-foot span:nth-child(2) { text-align: center; }
.hero-foot span:last-child { text-align: right; }

.preview-section {
  min-height: 560px;
  padding: 140px max(24px, calc((100vw - 1120px) / 2));
  background: var(--panel);
}

.preview-section p { margin: 0 0 14px; color: #a1a1a6; font-size: 24px; font-weight: 600; }
.preview-section h2 { max-width: 900px; margin: 0; font-size: clamp(48px, 6.4vw, 80px); line-height: 1.03; letter-spacing: -0.055em; }

.section-kicker {
  margin: 0 0 14px;
  color: #a1a1a6;
  font-size: 24px;
  font-weight: 650;
  letter-spacing: -0.02em;
}

.section-heading {
  width: min(1120px, calc(100% - 48px));
  margin: 0 auto;
}

.wide-heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 30px;
  margin-bottom: 64px;
}

.wide-heading h2 {
  margin: 0;
  font-size: clamp(48px, 5vw, 64px);
  line-height: 1;
  letter-spacing: -0.055em;
}

.highlights-section {
  overflow: hidden;
  padding: 144px 0 180px;
  background:
    radial-gradient(ellipse at 50% 44%, rgba(62, 86, 155, 0.15) 0%, rgba(24, 27, 40, 0.08) 42%, transparent 70%),
    linear-gradient(to bottom, #000 0%, #0b0c12 18%, #0b0c12 82%, #000 100%);
}

.highlights-track {
  display: grid;
  grid-template-columns: repeat(3, minmax(360px, 1fr));
  gap: 22px;
  width: min(1120px, calc(100% - 48px));
  margin: 0 auto;
}

.highlight-card {
  position: relative;
  min-height: 570px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 28px;
  border-radius: 30px;
  background: #000;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.06);
}

.highlight-card::after {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(to top, rgba(0,0,0,.68), transparent 55%);
}

.card-number,
.highlight-card > div:last-child { position: relative; z-index: 2; }
.card-number { margin: 0; color: #86868b; font: 12px/1 var(--font-geist-mono), monospace; letter-spacing: .13em; }
.highlight-card h3 { margin: 0 0 12px; font-size: 30px; line-height: 1.08; letter-spacing: -.04em; }
.highlight-card > div:last-child p { margin: 0; color: #a1a1a6; font-size: 16px; line-height: 1.52; }

.highlight-art { position: absolute; inset: 70px 20px 175px; }
.highlight-art i { position: absolute; display: block; }

.highlight-architecture .highlight-art { perspective: 700px; }
.highlight-architecture .highlight-art i {
  left: 12%; top: 34px; width: 76%; height: 96px; border: 1px solid rgba(255,255,255,.35);
  background: linear-gradient(100deg, rgba(111,226,255,.8), rgba(117,96,255,.72));
  box-shadow: 0 7px 0 rgba(39,76,130,.82), 0 28px 48px rgba(64,98,255,.34);
  transform: rotateX(60deg) rotateZ(-22deg);
}
.highlight-architecture .highlight-art i:nth-child(2) { top: 146px; height: 126px; background: linear-gradient(100deg,#14285f,#344da7 62%,#392b7b); box-shadow:0 10px 0 rgba(8,20,54,.95),0 30px 56px rgba(47,80,198,.34); }

.highlight-spectrum { background: radial-gradient(circle at 54% 37%, rgba(97,63,208,.4), transparent 42%), #000; }
.highlight-spectrum .highlight-art i:first-child { inset: 8% 7% 14%; border-radius: 50%; background: conic-gradient(from 220deg,#6f42ff,#bd55db,#ff6b71,#ffd56f,#4fd6ff,#6f42ff); filter: blur(3px); opacity: .86; }
.highlight-spectrum .highlight-art i:nth-child(2) { inset: 15% 14% 21%; border-radius: 50%; background: #050505; }
.highlight-spectrum .highlight-art i:nth-child(3) { left: 50%; top: 1%; width: 2px; height: 100%; background: linear-gradient(transparent,#fff,transparent); transform: rotate(27deg); box-shadow: 0 0 20px #d9d3ff; }

.highlight-power { background: radial-gradient(circle at 50% 35%, rgba(36,155,255,.3), transparent 43%), #000; }
.highlight-power .highlight-art i:first-child { left: 15%; right: 15%; top: 13%; height: 55%; border-radius: 12px; background: repeating-linear-gradient(90deg,transparent 0 38px,rgba(151,222,255,.35) 39px 40px), repeating-linear-gradient(0deg,#0c193b 0 25px,#17356d 26px 28px); border: 1px solid #5e84b8; transform: perspective(500px) rotateX(55deg); box-shadow: 0 34px 65px rgba(32,113,255,.28); }
.highlight-power .highlight-art i:nth-child(2) { left: 50%; top: 30%; width: 1px; height: 46%; background: rgba(255,255,255,.5); }
.highlight-power .highlight-art i:nth-child(3) { left: 12%; right: 12%; bottom: 3%; height: 2px; background: linear-gradient(90deg,transparent,#57bfff,transparent); box-shadow: 0 0 16px #2997ff; }

.company-film-section {
  position: relative;
  overflow: hidden;
  padding: 160px max(24px, calc((100vw - 1120px) / 2)) 190px;
  background:
    radial-gradient(circle at 84% 14%, rgba(111, 104, 255, .13), transparent 30%),
    radial-gradient(circle at 14% 70%, rgba(75, 201, 255, .09), transparent 31%),
    #000;
}

.company-film-heading {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(300px, .75fr);
  align-items: end;
  gap: 72px;
}

.company-film-heading h2 {
  max-width: 800px;
  margin: 0;
  font-size: clamp(58px, 6.5vw, 92px);
  font-weight: 650;
  line-height: .98;
  letter-spacing: -.06em;
}

.company-film-heading h2 span {
  display: block;
  color: transparent;
  background: linear-gradient(92deg, #f5f5f7, #9cdfff 42%, #9294ff 72%, #dd95ff);
  -webkit-background-clip: text;
  background-clip: text;
}

.company-film-heading > p {
  margin: 0 0 5px;
  color: #a1a1a6;
  font-size: 18px;
  line-height: 1.58;
}

.company-film-frame {
  position: relative;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  margin-top: 76px;
  border: 1px solid rgba(166, 215, 255, .18);
  border-radius: 34px;
  background: #06070a;
  box-shadow:
    inset 0 1px rgba(255, 255, 255, .09),
    0 42px 110px rgba(29, 48, 111, .24),
    0 0 80px rgba(123, 94, 255, .08);
}

.company-film-frame::after {
  content: '';
  position: absolute;
  z-index: 3;
  inset: 0;
  border-radius: inherit;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .04);
  pointer-events: none;
}

.company-film-video {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  background: #000;
}

.company-film-duration {
  position: absolute;
  z-index: 2;
  top: 22px;
  right: 22px;
  padding: 9px 12px;
  border: 1px solid rgba(255, 255, 255, .68);
  border-radius: 980px;
  color: #f5f5f7;
  background: rgba(7, 9, 14, .62);
  box-shadow: 0 12px 34px rgba(0, 0, 0, .24);
  backdrop-filter: blur(14px);
  font: 11px/1 var(--font-geist-mono), monospace;
  letter-spacing: .1em;
  pointer-events: none;
}

.architecture-section {
  padding: 160px max(24px, calc((100vw - 1120px) / 2)) 190px;
  background: #000;
}

.architecture-intro { max-width: 880px; margin: 0 0 68px; }
.architecture-intro h2,
.spectrum-copy h2,
.reliability-title h2,
.applications-heading h2,
.comparison-title h2,
.contact-copy h2 {
  margin: 0;
  font-size: clamp(60px, 7vw, 96px);
  line-height: .98;
  letter-spacing: -.06em;
}
.architecture-intro h2 span { color: #68686e; }
.architecture-intro > p:last-child,
.spectrum-copy > p:last-child,
.reliability-title > p:last-child {
  max-width: 740px;
  margin: 40px 0 0;
  color: #a1a1a6;
  font-size: 22px;
  line-height: 1.55;
}

.nano-fact { position:relative; overflow:hidden; display:grid; grid-template-columns:minmax(0,.88fr) minmax(360px,1.12fr); align-items:stretch; gap:34px; min-height:380px; margin:0 0 112px; padding:38px 42px; border:1px solid rgba(132,196,255,.15); border-radius:32px; background:radial-gradient(circle at 78% 38%,rgba(121,93,255,.18),transparent 33%),radial-gradient(circle at 16% 10%,rgba(104,211,255,.12),transparent 35%),#111216; box-shadow:inset 0 1px rgba(255,255,255,.08); }
.nano-fact::before { content:''; position:absolute; left:42px; right:42px; top:0; height:2px; background:linear-gradient(90deg,#73e2ff,#7d7aff 56%,#d26dff,transparent); box-shadow:0 0 22px rgba(116,164,255,.6); }
.nano-fact > * { position:relative; z-index:1; }
.nano-fact > div { align-self:center; }
.nano-fact h3 { margin:22px 0 12px; font-size:clamp(38px,4.2vw,58px); line-height:1; letter-spacing:-.055em; }
.nano-fact div > p:last-child { max-width:650px; margin:0; color:#a1a1a6; font-size:17px; line-height:1.55; }
.nano-visual { position:relative; overflow:hidden; min-height:300px; margin:0; border:1px solid rgba(175,218,255,.14); border-radius:23px; background:#050609; box-shadow:inset 0 1px rgba(255,255,255,.08),0 24px 70px rgba(0,0,0,.35); }
.nano-visual::after { content:''; position:absolute; inset:35% 0 0; pointer-events:none; background:linear-gradient(transparent,rgba(3,4,8,.82)); }
.nano-visual img { position:absolute; inset:0; display:block; width:100%; height:100%; object-fit:cover; object-position:center; filter:saturate(.9) contrast(1.04); transform:scale(1.025); transition:transform 1s cubic-bezier(.2,.8,.2,1),filter .7s ease; }
.nano-fact:hover .nano-visual img { transform:scale(1.055); filter:saturate(1.02) contrast(1.06); }
.nano-visual figcaption { position:absolute; z-index:2; left:20px; right:20px; bottom:18px; display:flex; align-items:flex-end; justify-content:space-between; gap:20px; }
.nano-visual figcaption > span { padding-bottom:5px; color:#8492aa; font:9px/1 var(--font-geist-mono),monospace; letter-spacing:.14em; }
.nano-fact strong { display:flex; align-items:flex-end; justify-content:flex-end; gap:7px; min-width:1.8em; color:transparent; background:linear-gradient(120deg,#c7f3ff,#77a4ff 48%,#d47bff); -webkit-background-clip:text; background-clip:text; font-size:clamp(74px,8vw,112px); font-weight:650; font-variant-numeric:tabular-nums; line-height:.72; letter-spacing:-.09em; }
.nano-fact strong small { padding-bottom:6px; font-size:.21em; letter-spacing:-.03em; }
.motion-ui-ready .nano-fact [data-count-down] { opacity:.45; filter:blur(7px); transform:translateY(-5px) scale(.96); transition:opacity .65s ease,filter .8s ease,transform 1s cubic-bezier(.2,.8,.2,1); }
.motion-ui-ready .nano-fact [data-count-down].is-count-visible { opacity:1; filter:blur(0); transform:translateY(0) scale(1); }

.explorer {
  --explorer-glow: 96, 153, 255;
  display: grid;
  grid-template-columns: minmax(0,1.14fr) minmax(320px,.86fr);
  gap: 80px;
  align-items: center;
  min-height: 680px;
}
.explorer[data-active-layer="1"] { --explorer-glow: 133, 218, 255; }
.explorer[data-active-layer="2"] { --explorer-glow: 202, 104, 219; }
.explorer[data-active-layer="3"] { --explorer-glow: 95, 228, 210; }
.explorer[data-active-layer="4"] { --explorer-glow: 78, 122, 255; }

.explorer-visual {
  position: relative;
  min-height: 650px;
  overflow: hidden;
  border-radius: 36px;
  background: radial-gradient(circle at 50% 42%, rgba(var(--explorer-glow),.23), transparent 48%), #0b0b0d;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.07), 0 28px 90px rgba(var(--explorer-glow),.06);
  transition:background .55s ease,box-shadow .55s ease;
  perspective: 1100px;
}

.explorer-stack {
  position: absolute;
  left: 12%; top: 31%; width: 76%; height: 230px;
  transform: rotateX(58deg) rotateZ(-20deg);
  transform-style: preserve-3d;
}

.explorer-layer {
  --layer-z: 138px;
  --layer-depth: 18px;
  --layer-front: linear-gradient(90deg,#4b91ad,#3f559d);
  --layer-side: #304276;
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 184px;
  margin: 0;
  padding: 0;
  cursor: pointer;
  border: 1px solid rgba(255,255,255,.34);
  border-radius: 5px;
  background: linear-gradient(90deg,#b8efff,#678fff);
  box-shadow: 0 18px 30px rgba(0,0,0,.38), inset 0 1px rgba(255,255,255,.42);
  transform: translate3d(0,0,var(--layer-z));
  opacity:.72;
  transition:transform .62s cubic-bezier(.22,.61,.36,1),opacity .38s ease,border-color .38s ease;
  transform-style: preserve-3d;
  overflow: visible;
  backface-visibility: hidden;
  will-change:transform,opacity;
}
.explorer-layer::before { content:''; position:absolute; z-index:0; left:-1px; right:-1px; top:100%; height:var(--layer-depth); pointer-events:none; border:1px solid rgba(255,255,255,.13); border-top:0; border-radius:0 0 5px 5px; background:var(--layer-front); box-shadow:0 12px 22px rgba(0,0,0,.22); transform-origin:top center; transform:rotateX(-90deg); backface-visibility:hidden; }
.explorer-layer::after { content:''; position:absolute; z-index:0; left:100%; top:-1px; width:var(--layer-depth); height:calc(100% + 1px); pointer-events:none; border:1px solid rgba(255,255,255,.1); border-left:0; border-radius:0 5px 5px 0; background:var(--layer-side); transform-origin:left center; transform:rotateY(90deg); backface-visibility:hidden; }
.explorer-layer:hover:not(.is-active) { transform:translate3d(6px,-2px,var(--layer-z)); opacity:.86; }
.explorer-layer.is-active { transform:translate3d(20px,-5px,var(--layer-z)); opacity:1; border-color:rgba(229,247,255,.78); box-shadow:0 18px 30px rgba(0,0,0,.38),inset 0 1px rgba(255,255,255,.5),0 0 0 1px rgba(var(--explorer-glow),.3); }
.explorer-layer:focus-visible { outline:2px solid rgb(var(--explorer-glow)); outline-offset:5px; }
.explorer-layer-2 { --layer-z:94px; --layer-depth:24px; --layer-front:linear-gradient(90deg,#874383,#40347d); --layer-side:#382c6e; background:linear-gradient(90deg,#c05fb4,#5d47b1); }
.explorer-layer-3 { --layer-z:48px; --layer-depth:12px; --layer-front:linear-gradient(90deg,#339c91,#598e51); --layer-side:#326e58; background:linear-gradient(90deg,#54e8d6,#85c572); }
.explorer-layer-4 { --layer-z:0px; --layer-depth:30px; --layer-front:linear-gradient(90deg,#0b153d,#203576); --layer-side:#17265c; background:linear-gradient(90deg,#101f50,#304a9b); }
.explorer-layer span { position:absolute; z-index:1; left:22px; bottom:18px; display:flex; align-items:center; gap:7px; color:rgba(255,255,255,.78); font-size:11px; letter-spacing:.04em; text-shadow:0 2px 7px rgba(0,0,0,.42); transition:color .32s ease; }
.explorer-layer span::before { content:''; width:5px; height:5px; border-radius:50%; background:rgb(var(--explorer-glow)); box-shadow:0 0 12px rgba(var(--explorer-glow),.8); opacity:0; transform:scale(.5); transition:opacity .32s ease,transform .38s cubic-bezier(.22,.61,.36,1); }
.explorer-layer.is-active span { color:#fff; }
.explorer-layer.is-active span::before { opacity:1; transform:scale(1); }

.explorer-rays { position: absolute; inset: 0; }
.explorer-rays i { position: absolute; top: -10%; width: 3px; height: 43%; background: linear-gradient(transparent,#fff1b4,transparent); box-shadow: 0 0 17px #ffe391; transform: rotate(18deg); }
.explorer-rays i:first-child { left: 28%; }
.explorer-rays i:nth-child(2) { left: 49%; top: -3%; }
.explorer-rays i:last-child { left: 67%; top: -14%; opacity: .6; }

.explorer-current { position: absolute; left: 30%; right: 18%; bottom: 14%; display: flex; justify-content: space-between; }
.explorer-current i { width: 5px; height: 5px; border-radius: 50%; background:#91edff; box-shadow: 0 0 16px 7px rgba(95,214,255,.5); animation: pulse 2.1s ease-in-out infinite; }
.explorer-current i:nth-child(2) { animation-delay:.3s; }.explorer-current i:nth-child(3) { animation-delay:.6s; }.explorer-current i:nth-child(4) { animation-delay:.9s; }

.explorer-copy h3 { margin: 18px 0 22px; font-size: clamp(36px,4vw,52px); line-height:1.04; letter-spacing:-.05em; }
.explorer-copy-content { animation:explorer-copy-in .48s cubic-bezier(.22,.61,.36,1) both; }
.explorer-copy-content > p:not(.mono-label) { margin:0; color:#a1a1a6; font-size:19px; line-height:1.55; }
.mono-label { margin:0; color:#6e6e73; font:11px/1.3 var(--font-geist-mono),monospace; letter-spacing:.13em; }
.explorer-tabs { display:grid; gap:0; margin-top:46px; border-top:1px solid #2d2d30; }
.explorer-tabs button { position:relative; display:flex; align-items:center; gap:18px; width:100%; padding:18px 4px; cursor:pointer; border:0; border-bottom:1px solid #2d2d30; background:transparent; color:#6e6e73; text-align:left; font:15px var(--font-geist-sans); transition:color .3s ease,padding-left .42s cubic-bezier(.22,.61,.36,1); }
.explorer-tabs button span { font:11px var(--font-geist-mono); }
.explorer-tabs button::after { content:''; position:absolute; right:4px; width:5px; height:5px; border-radius:50%; background:rgb(var(--explorer-glow)); box-shadow:0 0 12px rgba(var(--explorer-glow),.8); opacity:0; transform:scale(.5); transition:opacity .3s ease,transform .38s cubic-bezier(.22,.61,.36,1); }
.explorer-tabs button:hover,.explorer-tabs button.is-active { color:#f5f5f7; }
.explorer-tabs button.is-active { padding-left:12px; }
.explorer-tabs button.is-active::after { opacity:1; transform:scale(1); }

.spectrum-section {
  display:grid;
  grid-template-columns:minmax(0,.9fr) minmax(520px,1.1fr);
  gap:70px;
  min-height:1050px;
  align-items:center;
  padding:150px max(24px,calc((100vw - 1120px)/2));
  background:#050505;
}
.spectrum-copy > p:last-child { max-width:560px; }
.spectrum-visual { position:relative; min-height:680px; border-radius:50%; background:radial-gradient(circle,rgba(120,80,255,.16),transparent 60%); }
.spectrum-wave { position:absolute; inset:12%; border-radius:50%; background:conic-gradient(from 215deg,#8158ff,#c954dc,#ff697c,#ffd474,#65d8ff,#8158ff); filter:blur(1px); mask:radial-gradient(circle,transparent 0 52%,#000 53% 61%,transparent 62%); -webkit-mask:radial-gradient(circle,transparent 0 52%,#000 53% 61%,transparent 62%); animation:orbit 18s linear infinite; }
.spectrum-visual::after { content:''; position:absolute; left:50%; top:5%; width:2px; height:90%; background:linear-gradient(transparent,rgba(255,255,255,.9),transparent); box-shadow:0 0 24px rgba(255,255,255,.72); transform:rotate(26deg); }
.bandgap { position:absolute; z-index:2; display:flex; flex-direction:column; padding:18px 22px; border-radius:18px; background:rgba(23,23,27,.78); border:1px solid rgba(255,255,255,.12); backdrop-filter:blur(16px); }
.bandgap span { color:#86868b; font:10px var(--font-geist-mono); letter-spacing:.12em; }.bandgap strong { margin:6px 0 2px; font-size:28px; }.bandgap small { color:#a1a1a6; }
.bandgap-top { top:18%; left:3%; }.bandgap-bottom { right:0; bottom:19%; }

.performance-section { padding:170px max(24px,calc((100vw - 1120px)/2)) 190px; background:linear-gradient(#050505,#101013); }
.performance-hero { text-align:center; }
.giant-metric { margin:26px 0 0; color:transparent; background:linear-gradient(100deg,#bceeff,#6aa1ff 44%,#d67bff); -webkit-background-clip:text; background-clip:text; font-size:clamp(150px,25vw,330px); font-weight:650; line-height:.8; letter-spacing:-.09em; }
.giant-metric .metric-value { display:inline-block; font-size:1em; letter-spacing:inherit; }
.giant-metric .metric-suffix { font-size:.33em; letter-spacing:-.04em; }
.motion-ui-ready .giant-metric[data-count-up] { opacity:.25; filter:blur(12px); transform:scale(.955); transition:opacity .9s ease,filter .9s ease,transform 1s cubic-bezier(.2,.8,.2,1); }
.motion-ui-ready .giant-metric[data-count-up].is-count-visible { opacity:1; filter:blur(0); transform:scale(1); }
.performance-hero h2 { max-width:760px; margin:54px auto 0; font-size:clamp(38px,5vw,64px); line-height:1.05; letter-spacing:-.05em; }
.metric-note { color:#6e6e73; font-size:13px; }
.metric-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-top:120px; }
.metric-grid article { min-height:330px; padding:34px; border-radius:28px; background:#1d1d1f; }
.metric-grid article > span { color:#86868b; font:12px var(--font-geist-mono); }.metric-grid strong { display:block; margin:88px 0 14px; font-size:30px; letter-spacing:-.04em; }.metric-grid p { margin:0; color:#a1a1a6; line-height:1.55; }

.reliability-section { padding:180px max(24px,calc((100vw - 1120px)/2)); background:#000; }
.reliability-title { max-width:980px; margin-bottom:110px; }.reliability-title > p:last-child { max-width:670px; }
.reliability-grid { display:grid; grid-template-columns:1.1fr .9fr; gap:22px; }
.micrograph-card { position:relative; min-height:690px; overflow:hidden; display:flex; flex-direction:column; justify-content:space-between; padding:30px; border-radius:30px; background:radial-gradient(circle at 12% 4%,rgba(188,238,255,.13),transparent 29%),radial-gradient(circle at 94% 88%,rgba(214,123,255,.14),transparent 34%),linear-gradient(145deg,#151822,#09090c 58%,#130d1d); color:#f5f5f7; box-shadow:inset 0 0 0 1px rgba(255,255,255,.1); }
.micrograph-card::before { content:''; position:absolute; inset:-42%; pointer-events:none; background:conic-gradient(from 210deg,transparent 0 30%,rgba(106,161,255,.12),rgba(214,123,255,.11),transparent 64%); filter:blur(70px); }
.micrograph-card > * { position:relative; z-index:1; }
.micrograph-image { position:relative; min-height:390px; overflow:hidden; display:grid; place-items:center; padding:18px 18px 12px; border:1px solid rgba(188,238,255,.14); border-radius:20px; background:radial-gradient(circle at 23% 12%,rgba(188,238,255,.24),transparent 35%),radial-gradient(circle at 80% 76%,rgba(214,123,255,.22),transparent 42%),linear-gradient(145deg,#121b31,#11101f 56%,#1a1027); box-shadow:inset 0 1px rgba(255,255,255,.11),0 30px 70px rgba(0,0,0,.24); }
.micrograph-image::after { content:''; position:absolute; inset:0; pointer-events:none; background:linear-gradient(118deg,rgba(255,255,255,.08),transparent 24%,transparent 74%,rgba(183,151,255,.08)); }
.expandable-device { position:relative; z-index:1; width:min(100%,640px); }
.expandable-device-media { position:relative; aspect-ratio:3/2; }
.expandable-device img { position:absolute; inset:0; width:100%; height:100%; object-fit:contain; image-rendering:auto; transform-origin:center; filter:drop-shadow(0 24px 24px rgba(56,101,255,.25)) drop-shadow(0 0 30px rgba(193,108,255,.1)); transition:opacity .48s ease,transform 1.35s cubic-bezier(.16,1,.3,1),filter 1.1s ease; will-change:transform,opacity; }
.device-image-base { z-index:1; opacity:1; transform:scale(.92); }
.device-image-slices { position:absolute; z-index:2; inset:0; pointer-events:none; }
.device-image-slice { opacity:0; transform:translate3d(0,0,0) scale(.92); }
.device-image-slice.device-slice-optical { --slice-x:-6px; --slice-shift:-30px; --slice-delay:.04s; clip-path:polygon(0 0,100% 0,100% 39%,78% 39%,18% 30%,0 30%); }
.device-image-slice.device-slice-perovskite { --slice-x:-2px; --slice-shift:-9px; --slice-delay:.09s; clip-path:polygon(18% 28%,77% 36%,90% 25%,90% 44%,77% 55%,18% 45%); }
.device-image-slice.device-slice-junction { --slice-x:3px; --slice-shift:12px; --slice-delay:.14s; clip-path:polygon(18% 43%,77% 53%,90% 42%,90% 55%,77% 64%,18% 54%); }
.device-image-slice.device-slice-silicon { --slice-x:7px; --slice-shift:32px; --slice-delay:.19s; clip-path:polygon(18% 48%,77% 58%,90% 47%,90% 78%,76% 94%,18% 78%); }
.expandable-device.is-expanded .device-image-base { opacity:.06; transform:scale(.9); filter:blur(2px) drop-shadow(0 20px 20px rgba(56,101,255,.12)); }
.expandable-device.is-expanded .device-image-slice { opacity:1; transform:translate3d(var(--slice-x),var(--slice-shift),0) scale(.9); filter:drop-shadow(0 24px 26px rgba(69,104,255,.25)) drop-shadow(0 0 24px rgba(195,101,255,.1)); transition-delay:var(--slice-delay); }
.device-slice-labels { position:absolute; z-index:3; inset:0; pointer-events:none; }
.device-slice-labels span { position:absolute; padding:6px 9px; border:1px solid rgba(182,221,255,.18); border-radius:999px; background:rgba(9,11,18,.72); color:#c8dfff; font:9px/1 var(--font-geist-mono),monospace; letter-spacing:.08em; opacity:0; transform:translateY(8px); backdrop-filter:blur(12px); transition:opacity .3s ease,transform .45s ease; }
.device-slice-labels .device-slice-optical { top:5%; left:4%; }
.device-slice-labels .device-slice-perovskite { top:31%; right:3%; }
.device-slice-labels .device-slice-junction { top:53%; left:4%; }
.device-slice-labels .device-slice-silicon { right:4%; bottom:3%; }
.expandable-device.is-expanded .device-slice-labels span { opacity:1; transform:translateY(0); transition-delay:.72s; }
.expandable-device-controls { display:flex; align-items:center; justify-content:space-between; gap:16px; min-height:40px; margin-top:4px; }
.device-view-state { color:#73819a; font:9px/1 var(--font-geist-mono),monospace; letter-spacing:.13em; }
.expandable-device-controls button { display:inline-flex; align-items:center; gap:8px; min-height:34px; padding:0 12px; cursor:pointer; border:1px solid rgba(150,196,255,.22); border-radius:999px; background:rgba(15,19,31,.72); color:#dcecff; font:11px var(--font-geist-sans); backdrop-filter:blur(14px); transition:background .24s ease,border-color .24s ease,transform .24s ease; }
.expandable-device-controls button:hover { background:rgba(41,105,193,.22); border-color:rgba(150,196,255,.46); transform:translateY(-1px); }
.expandable-device-controls button:focus-visible { outline:2px solid #2997ff; outline-offset:3px; }
.expandable-device-controls button > i { position:relative; width:15px; height:13px; }
.expandable-device-controls button > i b { position:absolute; left:1px; width:13px; height:3px; border-radius:2px; background:linear-gradient(90deg,#8ee8ff,#8c7cff); transition:transform .45s ease,top .45s ease; }
.expandable-device-controls button > i b:first-child { top:2px; }.expandable-device-controls button > i b:last-child { top:8px; }
.expandable-device.is-expanded .expandable-device-controls button > i b:first-child { top:4px; transform:rotate(45deg); }.expandable-device.is-expanded .expandable-device-controls button > i b:last-child { top:4px; transform:rotate(-45deg); }
.micrograph-card .mono-label { display:inline-block; color:transparent; background:linear-gradient(100deg,#bceeff,#6aa1ff 48%,#d67bff); -webkit-background-clip:text; background-clip:text; }
.micrograph-card h3 { margin:14px 0 10px; font-size:40px; letter-spacing:-.05em; }.micrograph-card > div:last-child > p:last-child { max-width:520px; margin:0; color:#a1a1a6; line-height:1.5; }
.test-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:22px; }
.test-grid article { min-height:332px; padding:28px; border-radius:28px; background:#1d1d1f; }
.test-grid span { display:grid; place-items:center; width:52px; height:52px; border-radius:50%; background:#303034; color:#83d9ff; font:12px var(--font-geist-mono); }.test-grid h3 { margin:88px 0 10px; font-size:25px; }.test-grid p { margin:0; color:#a1a1a6; font-size:14px; line-height:1.5; }

.applications-section { padding:170px 0 190px; background:radial-gradient(circle at 12% 2%,rgba(41,151,255,.08),transparent 27%),#000; color:#f5f5f7; }
.applications-heading { margin-bottom:90px; }.applications-heading .section-kicker { color:#86868b; }
.application-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:22px; width:min(1120px,calc(100% - 48px)); margin:0 auto; }
.application-card { position:relative; min-height:690px; overflow:hidden; display:flex; flex-direction:column; justify-content:flex-end; padding:36px; border-radius:32px; background:#101014; color:#f5f5f7; box-shadow:inset 0 0 0 1px rgba(255,255,255,.08),0 28px 80px rgba(0,0,0,.18); }
.application-card:first-child { grid-column:span 2; min-height:760px; }
.application-card > div:last-child { position:relative; z-index:2; max-width:650px; }.application-card h3 { margin:16px 0 12px; font-size:clamp(36px,4vw,56px); line-height:1.03; letter-spacing:-.055em; }.application-card > div:last-child > p:last-child { max-width:520px; margin:0; color:#a1a1a6; font-size:18px; line-height:1.5; }
.application-art { position:absolute; inset:0; overflow:hidden; }
.application-art i { position:absolute; display:block; }
.app-roof .application-art { background:radial-gradient(circle at 18% 14%,rgba(121,190,255,.24),transparent 24%),linear-gradient(#0a1325 0 48%,#11141d 48% 100%); }
.app-roof .application-art i:first-child { left:5%; right:5%; top:38%; height:32%; background:repeating-linear-gradient(90deg,transparent 0 67px,rgba(139,208,255,.3) 68px 70px),repeating-linear-gradient(0deg,#0a1638 0 48px,#1c4383 49px 52px); transform:perspective(700px) rotateX(63deg); border:2px solid #244574; box-shadow:0 45px 60px rgba(0,0,0,.18); }
.app-roof .application-art i:nth-child(2) { left:-10%; right:-10%; bottom:18%; height:2px; background:rgba(136,182,255,.16); }.app-roof .application-art i:nth-child(3) { left:15%; top:13%; width:68px; height:68px; border-radius:50%; background:#fff3b7; box-shadow:0 0 55px rgba(255,226,130,.72); }.app-roof .application-art i:last-child { inset:0; background:linear-gradient(transparent 48%,rgba(6,8,13,.94) 82%); }
.app-mobile { background:radial-gradient(circle at 75% 18%,rgba(81,142,255,.2),transparent 36%),linear-gradient(160deg,#111b31,#08090f 64%); }.app-mobile .application-art i:first-child { width:280px; height:430px; top:3%; left:50%; border-radius:180px 180px 34px 34px; background:repeating-linear-gradient(90deg,transparent 0 39px,rgba(120,202,255,.25) 40px 42px),linear-gradient(#142b5d,#255aa8); transform:perspective(800px) rotateX(52deg) rotateZ(-12deg); box-shadow:0 35px 60px rgba(26,79,154,.28); }.app-mobile .application-art i:nth-child(2) { left:0; right:0; bottom:0; height:47%; background:linear-gradient(transparent,rgba(7,8,12,.96)); }
.app-space { background:radial-gradient(circle at 72% 22%,#364583,#090b1a 35%,#02030a 72%); color:#f5f5f7; }.app-space .application-art i:first-child { right:6%; top:9%; width:220px; height:220px; border-radius:50%; background:radial-gradient(circle at 36% 31%,#fff,#85b5ff 28%,#2b4c98 62%,#10132d 70%); box-shadow:0 0 70px rgba(87,133,255,.45); }.app-space .application-art i:nth-child(2) { right:33%; top:32%; width:230px; height:52px; background:repeating-linear-gradient(90deg,#173f75 0 30px,#5e9fd3 31px 33px); transform:rotate(-17deg); box-shadow:0 16px 22px rgba(0,0,0,.4); }.app-space .application-art i:nth-child(3) { right:40%; top:26%; width:75px; height:120px; border-radius:16px; background:linear-gradient(145deg,#dfe9ef,#6f8295); transform:rotate(-17deg); }.app-space .application-art i:last-child { inset:0; background:linear-gradient(transparent 45%,rgba(0,0,0,.92) 88%); }
.app-space .application-card > p,.app-space .mono-label { color:#a1a1a6; }.app-space > div:last-child > p:last-child { color:#a1a1a6; }

.comparison-section { padding:180px max(24px,calc((100vw - 1120px)/2)); background:linear-gradient(180deg,#000,#09090c); color:#f5f5f7; }
.comparison-title { max-width:980px; margin-bottom:100px; }.comparison-title .section-kicker { color:#86868b; }
.comparison-table { border-top:1px solid #2d2d30; }
.comparison-row { display:grid; grid-template-columns:.7fr 1fr 1.25fr; gap:28px; padding:28px 18px; margin:0 -18px; border-bottom:1px solid #2d2d30; border-radius:16px; font-size:17px; transition:background .28s ease,border-color .28s ease; }.comparison-row span:not(:first-child) { color:#a1a1a6; }.comparison-row b { color:#2997ff; font-weight:650; transition:color .25s ease,text-shadow .25s ease; }.comparison-row:not(.comparison-head):hover { background:linear-gradient(90deg,rgba(41,151,255,.08),rgba(111,104,255,.055),transparent); border-color:rgba(117,154,255,.3); }.comparison-row:not(.comparison-head):hover b { color:#79c6ff; text-shadow:0 0 18px rgba(80,147,255,.28); }.comparison-head { padding-top:18px; color:#86868b; font-size:13px; }

.contact-section { position:relative; min-height:900px; overflow:hidden; display:flex; align-items:center; padding:160px max(24px,calc((100vw - 1120px)/2)); background:#000; }
.contact-copy { position:relative; z-index:2; }.contact-copy h2 span { color:transparent; background:linear-gradient(90deg,#b9ecff,#6e9cff 48%,#d87cff); -webkit-background-clip:text; background-clip:text; }.contact-copy > p:not(.section-kicker) { margin:34px 0; color:#a1a1a6; font-size:22px; }
.contact-glow { position:absolute; right:-14%; top:4%; width:760px; height:760px; border-radius:50%; background:radial-gradient(circle,rgba(88,112,255,.31),rgba(198,87,255,.11) 35%,transparent 66%); filter:blur(20px); }
.contact-orbit { position:absolute; right:2%; width:570px; height:570px; border:1px solid rgba(124,181,255,.28); border-radius:50%; transform:rotateX(69deg) rotateZ(-24deg); box-shadow:0 0 70px rgba(71,112,255,.1); }.contact-orbit i { position:absolute; width:12px; height:12px; border-radius:50%; background:#b9f2ff; box-shadow:0 0 26px 10px rgba(87,210,255,.5); }.contact-orbit i:first-child { left:12%; top:22%; }.contact-orbit i:nth-child(2) { right:4%; top:48%; }.contact-orbit i:last-child { left:47%; bottom:1%; }

footer { display:grid; grid-template-columns:1fr auto auto; gap:48px; align-items:center; padding:42px max(24px,calc((100vw - 1120px)/2)); border-top:1px solid #2d2d30; background:#000; color:#6e6e73; font-size:12px; }
footer .brand { color:#f5f5f7; font-size:15px; }
footer .brand-logo { width:112px; opacity:.82; }

.reveal { animation:fade-up both linear; animation-timeline:view(); animation-range:entry 8% cover 32%; }

[data-motion-item] { --enter-y:0px; --enter-scale:1; --tilt-x:0deg; --tilt-y:0deg; --parallax-x:0px; --parallax-y:0px; --spot-x:50%; --spot-y:50%; --motion-delay:0ms; transform:translate3d(0,var(--enter-y),0) scale(var(--enter-scale)); }
[data-motion-surface] { position:relative; isolation:isolate; overflow:hidden; transform:translate3d(0,var(--enter-y),0) scale(var(--enter-scale)) perspective(1200px) rotateX(var(--tilt-x)) rotateY(var(--tilt-y)); transform-style:preserve-3d; will-change:transform; }
[data-motion-surface]::after { content:''; position:absolute; z-index:5; inset:-1px; pointer-events:none; border-radius:inherit; background:radial-gradient(circle at var(--spot-x) var(--spot-y),rgba(188,238,255,.2),rgba(106,161,255,.08) 22%,rgba(214,123,255,.045) 39%,transparent 60%); opacity:0; mix-blend-mode:screen; transition:opacity .35s ease; }
[data-motion-surface].is-pointer-active::after { opacity:1; }
.application-card .application-art { transform:translate3d(var(--parallax-x),var(--parallax-y),0) scale(1.025); transition:transform .5s cubic-bezier(.2,.8,.2,1); will-change:transform; }

.motion-ui-ready [data-motion-item] { --enter-y:30px; --enter-scale:.985; opacity:0; filter:blur(9px); transition:opacity .72s cubic-bezier(.2,.8,.2,1) var(--motion-delay),filter .72s ease var(--motion-delay),transform .78s cubic-bezier(.2,.8,.2,1) var(--motion-delay); }
.motion-ui-ready [data-motion-item].is-in-view { --enter-y:0px; --enter-scale:1; opacity:1; filter:blur(0); }
[data-motion-group] > [data-motion-item]:nth-child(2) { --motion-delay:90ms; }
[data-motion-group] > [data-motion-item]:nth-child(3) { --motion-delay:180ms; }
[data-motion-group] > [data-motion-item]:nth-child(4) { --motion-delay:270ms; }
[data-motion-group] > [data-motion-item]:nth-child(5) { --motion-delay:360ms; }
[data-motion-group] > [data-motion-item]:nth-child(6) { --motion-delay:450ms; }

@keyframes pulse {
  0%, 100% { opacity: 0.28; transform: scale(0.7); }
  50% { opacity: 1; transform: scale(1.35); }
}

@keyframes device-layer-cycle {
  0%, 17%, 88%, 100% {
    margin-top: var(--closed-gap);
    transform: translate3d(0, 0, 0);
  }
  36%, 68% {
    margin-top: var(--open-gap);
    transform: translate3d(0, var(--open-y), var(--open-z));
  }
}

@keyframes device-stack-breathe {
  0%, 17%, 88%, 100% { transform: rotateX(58deg) rotateZ(-25deg) scale(.98); }
  36%, 68% { transform: rotateX(58deg) rotateZ(-25deg) scale(1.015); }
}

@keyframes device-label-cycle {
  0%, 23%, 82%, 100% { opacity: 0; }
  40%, 67% { opacity: 1; }
}

@keyframes device-caption-closed {
  0%, 20%, 88%, 100% { opacity: 1; }
  34%, 72% { opacity: 0; }
}

@keyframes device-caption-open {
  0%, 23%, 84%, 100% { opacity: 0; }
  39%, 69% { opacity: 1; }
}

@keyframes device-aura-cycle {
  0%, 17%, 88%, 100% { opacity: .55; transform: scale(.86); }
  36%, 68% { opacity: 1; transform: scale(1.08); }
}

@keyframes orbit { to { transform:rotate(360deg); } }
@keyframes fade-up { from { opacity:.18; transform:translateY(38px); } to { opacity:1; transform:translateY(0); } }
@keyframes explorer-copy-in { from { opacity:0; transform:translateY(9px); } to { opacity:1; transform:translateY(0); } }

@media (max-width: 820px) {
  .page-progress { top:51px; }
  .site-header { grid-template-columns: 1fr auto; height: 52px; }
  .site-header .brand-logo { width:112px; }
  .site-header nav { display: none; }
  .hero { min-height: 960px; padding-top: 118px; }
  .hero h1 { font-size: clamp(52px, 14.4vw, 72px); }
  .hero-lead { font-size: 21px; }
  .device-stage { top: 510px; right: -80px; width: 125vw; height: 360px; }
  .device-stack { top: 80px; left: 14%; width: 68%; }
  .device-layer span { display: none; }
  .layer-silicon { height: 88px; }
  .hero-foot { grid-template-columns: 1fr; gap: 8px; bottom: 34px; }
  .hero-foot span,
  .hero-foot span:nth-child(2),
  .hero-foot span:last-child { text-align: left; }
  .preview-section { min-height: 480px; padding-top: 112px; }
  .preview-section p { font-size: 19px; }
  .preview-section h2 { font-size: 48px; }
  .section-kicker { font-size: 19px; }
  .wide-heading { display: block; margin-bottom: 42px; }
  .wide-heading .text-link { display: inline-block; margin-top: 20px; }
  .wide-heading h2 { font-size: 42px; }
  .highlights-section { padding: 112px 0 130px; }
  .highlights-track { grid-template-columns: repeat(3, minmax(310px, 83vw)); width: auto; overflow-x: auto; padding: 0 24px 16px; scroll-snap-type: x mandatory; scrollbar-width: none; }
  .highlight-card { min-height: 520px; scroll-snap-align: center; }
  .company-film-section { padding: 112px 24px 130px; }
  .company-film-heading { grid-template-columns: 1fr; gap: 28px; }
  .company-film-heading h2 { font-size: 48px; }
  .company-film-heading > p { font-size: 17px; }
  .company-film-frame { margin-top: 50px; border-radius: 24px; }
  .company-film-duration { top: 14px; right: 14px; }
  .architecture-section { padding: 112px 24px 130px; }
  .architecture-intro { margin-bottom: 44px; }
  .architecture-intro h2,
  .spectrum-copy h2,
  .reliability-title h2,
  .applications-heading h2,
  .comparison-title h2,
  .contact-copy h2 { font-size: 48px; }
  .architecture-intro > p:last-child,
  .spectrum-copy > p:last-child,
  .reliability-title > p:last-child { margin-top: 28px; font-size: 18px; }
  .nano-fact { grid-template-columns:1fr; gap:30px; min-height:0; margin-bottom:76px; padding:30px 26px; border-radius:26px; }
  .nano-fact::before { left:26px; right:26px; }
  .nano-fact h3 { font-size:42px; }
  .nano-fact div > p:last-child { font-size:15px; }
  .nano-visual { min-height:280px; border-radius:20px; }
  .nano-visual figcaption { left:16px; right:16px; bottom:15px; }
  .nano-fact strong { font-size:92px; }
  .explorer { grid-template-columns: 1fr; gap: 54px; min-height: 0; }
  .explorer-visual { min-height: 470px; border-radius: 28px; }
  .explorer-stack { left: 9%; top: 35%; width: 82%; height:180px; }
  .explorer-layer { --layer-depth:12px; --layer-z:96px; height:136px; }.explorer-layer-2 { --layer-depth:16px; --layer-z:65px; }.explorer-layer-3 { --layer-depth:9px; --layer-z:33px; }.explorer-layer-4 { --layer-depth:20px; --layer-z:0px; }
  .explorer-copy h3 { font-size: 40px; }
  .spectrum-section { grid-template-columns: 1fr; gap: 40px; min-height: 0; padding: 112px 24px 130px; }
  .spectrum-visual { min-height: 460px; }
  .bandgap { padding: 12px 15px; }.bandgap strong { font-size: 21px; }
  .performance-section { padding: 112px 24px 130px; }
  .giant-metric { margin-top: 38px; font-size: 47vw; }
  .performance-hero h2 { margin-top: 38px; font-size: 40px; }
  .metric-grid { grid-template-columns: 1fr; margin-top: 72px; }
  .metric-grid article { min-height: 260px; }.metric-grid strong { margin-top: 62px; }
  .reliability-section { padding: 112px 24px 130px; }
  .reliability-title { margin-bottom: 68px; }
  .reliability-grid { grid-template-columns: 1fr; }
  .micrograph-card { min-height:600px; }.micrograph-image { min-height:340px; }.device-image-slice.device-slice-optical { --slice-shift:-22px; }.device-image-slice.device-slice-perovskite { --slice-shift:-7px; }.device-image-slice.device-slice-junction { --slice-shift:8px; }.device-image-slice.device-slice-silicon { --slice-shift:23px; }
  .test-grid { gap: 14px; }.test-grid article { min-height: 270px; padding: 22px; }.test-grid h3 { margin-top: 58px; }
  .applications-section { padding: 112px 0 130px; }
  .applications-heading { margin-bottom: 64px; }
  .application-grid { grid-template-columns: 1fr; }
  .application-card,
  .application-card:first-child { grid-column: auto; min-height: 620px; padding: 28px; }
  .application-card h3 { font-size: 40px; }
  .app-mobile .application-art i:first-child { left: 40%; }
  .comparison-section { padding: 112px 24px 130px; }
  .comparison-title { margin-bottom: 64px; }
  .comparison-table { overflow-x: auto; }
  .comparison-row { min-width: 720px; padding: 23px 0; }
  .contact-section { min-height: 760px; padding: 112px 24px; align-items: flex-start; }
  .contact-copy > p:not(.section-kicker) { font-size: 18px; }
  .contact-orbit { right: -72%; bottom: -7%; width: 540px; height: 540px; }
  .contact-glow { right: -100%; top: 25%; }
  footer { grid-template-columns: 1fr; gap: 12px; padding: 38px 24px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .site-header { transition: none; }
  .electron-flow i,
  .device-layer,
  .device-stack,
  .device-layer span,
  .device-layer b,
  .device-caption span,
  .device-stage::before,
  .expandable-device img,
  .device-slice-labels span,
  .explorer-copy-content,
  .explorer-current i,
  .spectrum-wave { animation: none; }
  .device-layer { margin-top: 5px; transform: none; }
  .device-layer:first-child { margin-top: 0; }
  .device-layer span,
  .device-layer b { opacity: 1; }
  .device-caption span:first-child { opacity: 0; }
  .device-caption span:last-child { opacity: 1; }
  .expandable-device img,
  .device-slice-labels span { transition:none; }
  .explorer-layer,
  .explorer-layer span::before,
  .explorer-tabs button,
  .explorer-tabs button::after { transition:none; }
  .explorer-layer:hover:not(.is-active),
  .explorer-layer.is-active { transform:translate3d(0,0,var(--layer-z)); }
  .nano-visual img,
  .nano-fact:hover .nano-visual img { transform:none; transition:none; }
  .motion-ui-ready [data-motion-item],
  .motion-ui-ready .giant-metric[data-count-up],
  .motion-ui-ready .nano-fact [data-count-down] { --enter-y:0px; --enter-scale:1; opacity:1; filter:none; transform:none; transition:none; }
  [data-motion-surface]::after { display:none; }
  .application-card .application-art { transform:none; transition:none; }
  .reveal { animation: none; }
}

/* WordPress integration: the visual language remains identical while the
   company navigation is connected to the existing HIKING PV pages. */
.site-header .primary-nav { display: block; }
.primary-nav > ul { display:flex; align-items:center; gap:26px; }
.primary-nav .menu-item { position:relative; }
.primary-nav .menu-item > a { display:block; padding:20px 0; white-space:nowrap; }
.primary-nav .submenu-toggle { display:none; }
.primary-nav .submenu {
  position:absolute;
  top:calc(100% - 5px);
  left:50%;
  min-width:190px;
  padding:8px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:16px;
  background:rgba(20,20,23,.92);
  box-shadow:0 20px 55px rgba(0,0,0,.45);
  opacity:0;
  visibility:hidden;
  transform:translate(-50%,-6px) scale(.98);
  transform-origin:top center;
  transition:opacity .2s ease,visibility .2s ease,transform .28s cubic-bezier(.2,.8,.2,1);
  backdrop-filter:saturate(150%) blur(22px);
}
.primary-nav .submenu a { display:block; padding:10px 12px; border-radius:10px; color:#d2d2d7; font-size:12px; line-height:1.45; }
.primary-nav .submenu a::after { display:none; }
.primary-nav .submenu a:hover,.primary-nav .submenu a:focus-visible { color:#fff; background:rgba(255,255,255,.08); }
.primary-nav .menu-item:hover > .submenu,.primary-nav .menu-item:focus-within > .submenu { opacity:1; visibility:visible; transform:translate(-50%,0) scale(1); }
.nav-toggle { display:none; justify-self:end; position:relative; width:34px; height:34px; padding:0; cursor:pointer; border:0; border-radius:50%; background:rgba(255,255,255,.07); }
.nav-toggle span { position:absolute; left:10px; width:14px; height:1px; border-radius:2px; background:#f5f5f7; transition:top .28s ease,transform .28s ease; }
.nav-toggle span:first-child { top:13px; }.nav-toggle span:last-child { top:20px; }
.nav-toggle[aria-expanded="true"] span:first-child { top:17px; transform:rotate(45deg); }.nav-toggle[aria-expanded="true"] span:last-child { top:17px; transform:rotate(-45deg); }
.nav-toggle:focus-visible,.submenu-toggle:focus-visible { outline:2px solid #2997ff; outline-offset:3px; }
.admin-bar .site-header { top:32px; }
.admin-bar .page-progress { top:87px; }

.explorer-copy-content { transition:opacity .22s ease,transform .3s cubic-bezier(.2,.8,.2,1),filter .22s ease; }
.explorer-copy-content.is-changing { opacity:0; filter:blur(4px); transform:translateY(6px); }
.explorer-copy-content.is-entering { animation:explorer-copy-in .48s cubic-bezier(.22,.61,.36,1) both; }

.site-footer { grid-template-columns:minmax(150px,.7fr) minmax(340px,1.2fr) auto; gap:28px 52px; }
.site-footer .footer-company { display:grid; gap:6px; color:#86868b; line-height:1.55; }
.site-footer .footer-company strong { color:#d2d2d7; font-size:13px; font-weight:600; }
.site-footer .footer-nav { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:10px 18px; color:#a1a1a6; }
.site-footer .footer-nav a { transition:color .18s ease; }.site-footer .footer-nav a:hover { color:#f5f5f7; }
.site-footer .footer-legal { grid-column:1/-1; margin:10px 0 0; padding-top:20px; border-top:1px solid #1d1d1f; color:#6e6e73; }
.site-footer .footer-legal a:hover { color:#a1a1a6; }

/* English copy is intentionally given a little more measure than the Chinese
   source so the same visual hierarchy survives longer words without crowding. */
.hpt-home-en .primary-nav > ul { gap:22px; }
.hpt-home-en .site-header nav { font-size:12px; }
.hpt-home-en .primary-nav .language-switch > a { color:#8edcff; font-weight:650; }
.hpt-home-en .hero-copy { max-width:820px; }
.hpt-home-en .hero h1 { font-size:clamp(62px,6.7vw,96px); }
.hpt-home-en .hero-lead { max-width:600px; font-size:clamp(20px,1.8vw,26px); }
.hpt-home-en .highlight-card h3 { font-size:28px; }
.hpt-home-en .company-film-heading h2 { font-size:clamp(54px,6vw,84px); }
.hpt-home-en .architecture-intro h2,
.hpt-home-en .spectrum-copy h2,
.hpt-home-en .reliability-title h2,
.hpt-home-en .applications-heading h2,
.hpt-home-en .comparison-title h2,
.hpt-home-en .contact-copy h2 { font-size:clamp(54px,6.4vw,88px); }
.hpt-home-en .explorer-tabs button { font-size:14px; }
.hpt-home-en .comparison-row { grid-template-columns:.72fr 1.06fr 1.34fr; }

/* The7 styles its generic .button class with a higher-specificity selector.
   Keep the source site's primary CTA exact in every interaction state. */
body.hpt-home-template .hpt-home a.button.button-primary,
body.hpt-home-template .hpt-home a.button.button-primary:hover,
body.hpt-home-template .hpt-home a.button.button-primary:focus,
body.hpt-home-template .hpt-home a.button.button-primary:active {
  display:inline-flex;
  min-height:46px;
  align-items:center;
  justify-content:center;
  padding:0 22px;
  border:0;
  border-radius:980px;
  background:#0071e3;
  color:#f5f5f7;
  box-shadow:none;
  font-size:16px;
  line-height:normal;
  text-transform:none;
  text-decoration:none;
}

@media (max-width: 960px) and (min-width: 821px) {
  .site-header { padding-left:24px; padding-right:24px; }
  .primary-nav > ul { gap:18px; }
  .hpt-home-en .primary-nav > ul { gap:13px; }
  .hpt-home-en .site-header nav { font-size:11px; }
}

@media (max-width: 820px) {
  body.hpt-menu-open { overflow:hidden; }
  .site-header { grid-template-columns:1fr auto auto; gap:10px; }
  .site-header .primary-nav {
    display:block;
    position:fixed;
    z-index:-1;
    top:52px;
    left:0;
    right:0;
    height:calc(100dvh - 52px);
    overflow:auto;
    padding:30px 24px 70px;
    background:rgba(0,0,0,.96);
    opacity:0;
    visibility:hidden;
    transform:translateY(-10px);
    transition:opacity .25s ease,visibility .25s ease,transform .35s cubic-bezier(.2,.8,.2,1);
    backdrop-filter:blur(24px);
  }
  .site-header .primary-nav.is-open { opacity:1; visibility:visible; transform:translateY(0); }
  .primary-nav > ul { display:block; }
  .primary-nav .menu-item { border-bottom:1px solid rgba(255,255,255,.12); }
  .primary-nav .menu-item > a { padding:18px 38px 18px 0; color:#f5f5f7; font-size:28px; letter-spacing:-.04em; }
  .primary-nav .menu-item > a::after { display:none; }
  .primary-nav .submenu-toggle { display:block; position:absolute; top:13px; right:0; width:36px; height:36px; padding:0; cursor:pointer; border:0; border-radius:50%; background:rgba(255,255,255,.07); }
  .primary-nav .submenu-toggle::before,.primary-nav .submenu-toggle::after { content:''; position:absolute; left:11px; top:17px; width:14px; height:1px; background:#d2d2d7; transition:transform .25s ease; }
  .primary-nav .submenu-toggle::after { transform:rotate(90deg); }
  .primary-nav .submenu-toggle[aria-expanded="true"]::after { transform:rotate(0); }
  .primary-nav .submenu { position:static; min-width:0; max-height:0; overflow:hidden; padding:0 0 0 18px; border:0; background:transparent; box-shadow:none; opacity:1; visibility:visible; transform:none; transition:max-height .36s cubic-bezier(.2,.8,.2,1),padding .36s ease; backdrop-filter:none; }
  .primary-nav .menu-item:hover > .submenu,.primary-nav .menu-item:focus-within > .submenu { transform:none; }
  .primary-nav .menu-item.is-submenu-open > .submenu { max-height:160px; padding-bottom:16px; }
  .primary-nav .submenu a { padding:9px 0; font-size:16px; }
  .nav-toggle { display:block; }
  .nav-cta { padding:7px 12px; font-size:12px; }
  .site-footer { grid-template-columns:1fr; gap:20px; }
  .site-footer .footer-nav { justify-content:flex-start; }
  .site-footer .footer-legal { grid-column:1; }
  .hpt-home-en .hero h1 { font-size:clamp(49px,13.2vw,68px); }
  .hpt-home-en .hero-lead { font-size:20px; }
  .hpt-home-en .hero-actions { flex-direction:column; align-items:flex-start; gap:12px; }
  .hpt-home-en .device-caption { display:none; }
  .hpt-home-en .company-film-heading h2,
  .hpt-home-en .architecture-intro h2,
  .hpt-home-en .spectrum-copy h2,
  .hpt-home-en .reliability-title h2,
  .hpt-home-en .applications-heading h2,
  .hpt-home-en .comparison-title h2,
  .hpt-home-en .contact-copy h2 { font-size:44px; }
  .hpt-home-en .explorer-tabs button { font-size:13px; }
  .admin-bar .site-header { top:46px; }
  .admin-bar .site-header .primary-nav { top:98px; height:calc(100dvh - 98px); }
  .admin-bar .page-progress { top:97px; }
}

@media (max-width: 420px) {
  .site-header { padding-left:16px; padding-right:16px; }
  .site-header .brand-logo { width:102px; }
  .nav-cta { padding:7px 10px; }
}