/* Compact source-based product sections in the site's charcoal/blue palette. */
.product-page.has-source-details {
  background: radial-gradient(ellipse at 80% 8%, #18273166, transparent 35%), #070b0d;
  color: #e3e8eb;
}
.has-source-details .product-hero {
  display: block;
  min-height: 0;
  padding: 116px 24px 22px;
  text-align: center;
  width: 100%;
  max-width: none;
}
.has-source-details .product-hero::after { display: none; }
.has-source-details .product-copy { max-width: none; width: auto; }
.has-source-details .product-copy h1 {
  font-size: clamp(42px, 5vw, 68px);
  line-height: 1.08;
  letter-spacing: -.045em;
  margin: 0 0 12px;
  text-transform: none;
}
.has-source-details .product-copy h2 {
  font-size: clamp(13px, 2.4vw, 21px);
  line-height: 1.4;
  white-space: nowrap;
  max-width: none;
  width: 100%;
  text-align: center;
  font-weight: 400;
  color: #aeb8be;
  letter-spacing: -.02em;
  margin: 0;
}
.detail-nav {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 8px;
  padding: 0 20px 26px;
}
.detail-nav a {
  padding: 9px 16px;
  background: #142028;
  display: flex;
  gap: 24px;
  align-items: center;
  border-radius: 40px;
  font-size: 12px;
  line-height: 1.5;
  color: #d9e1e7;
  transition: background .2s;
}
.detail-nav a:hover { background: #20343f; }
.detail-nav a span { color: #6da8d8; }
.source-product-sections {
  width: 100%;
  max-width: none;
  padding: 0 clamp(20px, 4vw, 80px);
  margin: auto;
}
/* Let the existing floating network fill open space throughout the detail page. */
.source-product-sections.nano-particle-host { isolation: isolate; }
.source-product-sections > .detail-section,
.source-product-sections > .detail-video-section { position: relative; z-index: 1; }
.source-product-sections > .nano-molecules { opacity: .58; }
.source-product-sections.nano-molecules-active > .nano-molecules { opacity: .78; }
.detail-section {
  padding: 36px 0 42px;
  scroll-margin-top: 96px;
  border-top: 1px solid #2a3237;
}
.detail-eyebrow {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 10px;
  letter-spacing: .12em;
  color: #87a3b5;
  margin: 0 0 12px;
  line-height: 1.6;
}
.detail-eyebrow span { font-size: 12px; letter-spacing: 0; color: #6da8d8; }
.detail-section-heading h2, .detail-video-section h2 {
  font-size: clamp(30px, 3.5vw, 46px);
  font-weight: 500;
  letter-spacing: -.04em;
  line-height: 1.12;
  margin: 0 0 10px;
  color: #e3e8eb;
  text-transform: none;
}
.detail-subtitle {
  font-size: clamp(16px, 1.6vw, 19px);
  color: #aeb8be;
  line-height: 1.5;
  margin: 0;
  max-width: 800px;
}
.detail-intro {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
  gap: clamp(24px, 3vw, 40px);
  margin-top: 0;
  align-items: start;
}
.detail-copy { min-width: 0; }
.detail-copy .detail-section-heading { margin-bottom: 20px; }
.detail-description {
  font-size: clamp(16px, 1.05vw, 18px);
  line-height: 1.75;
  color: #c8d1d7;
  margin: 0;
  max-width: none;
}
.detail-points {
  display: grid;
  grid-template-columns: repeat(var(--detail-point-count, 3), minmax(0, 1fr));
  gap: 24px;
  margin-top: 24px;
}
.detail-points > div { padding-top: 14px; border-top: 1px solid #315263; }
.detail-points h3 {
  font-size: 14px;
  font-weight: 600;
  line-height: 1.4;
  margin: 0 0 6px;
  color: #e3e8eb;
}
.detail-points p { font-size: 13px; line-height: 1.65; color: #a0adb7; margin: 0; }
.detail-images { display: grid; gap: 14px; min-width: 0; }
.detail-images figure { margin: 0; background: #111a1f; border-radius: 10px; overflow: hidden; }
.detail-images img {
  display: block;
  width: 100%;
  height: auto;
  max-height: clamp(250px, 25vw, 380px);
  object-fit: contain;
  background: #070b0d;
}
.detail-images--multiple { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.detail-images--multiple img { height: clamp(220px, 21vw, 320px); }
.detail-images figcaption { padding: 10px 14px; font-size: 11px; color: #94a6b2; line-height: 1.6; }
.detail-table-block { margin-top: 28px; }
.detail-table-block h3, .detail-variants h3 {
  font-size: 20px;
  letter-spacing: -.02em;
  font-weight: 500;
  margin: 0 0 14px;
  color: #e3e8eb;
}
.detail-table-scroll { overflow-x: auto; border-radius: 10px; border: 1px solid #2a3237; scrollbar-color: #46677b #111a1f; }
.detail-table-scroll:focus-visible { outline: 2px solid #6da8d8; outline-offset: 4px; }
.detail-table-scroll table { width: 100%; border-collapse: collapse; min-width: 560px; text-align: left; font-size: 13px; line-height: 1.6; }
.detail-table-scroll th, .detail-table-scroll td { padding: 12px 16px; vertical-align: top; border-bottom: 1px solid #273139; }
.detail-table-scroll thead th { background: #172831; color: #c9dfec; font-size: 11px; font-weight: 600; line-height: 1.6; }
.detail-table-scroll tbody th { font-weight: 500; color: #d7e1e7; min-width: 180px; }
.detail-table-scroll tbody td { color: #b8c6d0; }
.detail-table-scroll tbody tr { background: #111a1f; }
.detail-table-scroll tbody tr:nth-child(even) { background: #0c1419; }
.detail-table-scroll tbody tr:last-child th, .detail-table-scroll tbody tr:last-child td { border-bottom: 0; }
.detail-source-note { font-size: 11px; line-height: 1.7; color: #8599a6; margin: 10px 0 0; max-width: 1000px; }
.detail-variants { margin-top: 32px; }
.detail-variant-intro { font-size: 14px; color: #97a9b6; line-height: 1.65; margin: 0 0 18px; }
.variant-grid { display: grid; grid-template-columns: repeat(var(--variant-count, 4), minmax(0, 1fr)); gap: 16px; }
.variant-card { display: block; appearance: none; width: 100%; padding: 0; border: 0; font: inherit; color: inherit; text-align: left; cursor: pointer; background: #111a1f; border-radius: 10px; overflow: hidden; transition: transform .2s, background .2s; }
.variant-card:hover { transform: translateY(-3px); background: #182731; }
.variant-card:focus-visible { outline: 2px solid #6da8d8; outline-offset: 4px; }
.variant-card[aria-expanded="true"] { box-shadow: inset 0 0 0 1px #6da8d8; }
.variant-card > div { background: #fff; padding: 8px 0; }
.variant-card img { width: 100%; height: auto; max-height: 210px; aspect-ratio: 3/2; object-fit: contain; display: block; }
.variant-card > span { display: flex; justify-content: space-between; gap: 14px; padding: 12px 14px; font-size: 12px; line-height: 1.6; }
.variant-card b { color: #6da8d8; font-weight: 400; }
.detail-section-footer { display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; padding-top: 18px; margin-top: 24px; border-top: 1px solid #2a3237; font-size: 12px; line-height: 1.8; }
.detail-section-footer a { display: flex; gap: 18px; align-items: center; color: #a6c5d8; }
.detail-section-footer a:hover { color: #e3e8eb; }
.detail-contact-link { color: #94a6b2 !important; }
.detail-video-section { padding: 36px 0 42px; border-top: 1px solid #2a3237; scroll-margin-top: 96px; }
.detail-video-stage { width: min(100%, calc(72vh * var(--video-ratio, 1.7778))); margin: 20px auto 0; background: #000; border-radius: 10px; overflow: hidden; }
.detail-video-stage video { display: block; width: 100%; height: auto; max-height: 72vh; aspect-ratio: var(--video-ratio, 1.7778); object-fit: contain; background: #000; }
.detail-sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; }
.has-source-details .next-products { width: 100%; max-width: none; margin: 0 auto; padding: 28px clamp(20px, 4vw, 80px) 44px; }
.has-source-details .next-product-links { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; border-top: 0; }
.has-source-details .next-product-links a { grid-template-columns: minmax(0, 1fr) 26px; gap: 8px 12px; padding: 18px 0; border-top: 1px solid #2a3237; }
.has-source-details .next-product-links span { grid-column: 1 / -1; line-height: 1.6; }
.has-source-details .next-product-links strong { font-size: clamp(23px, 2.2vw, 30px); }
.has-source-details .next-product-links em { grid-column: 2; grid-row: 2; }
.has-source-details .next-product-links a:hover { padding-left: 0; }
.variant-detail-dialog {
  position: fixed;
  inset: 0 0 0 auto;
  margin: 0;
  width: min(680px, 48vw);
  max-width: 100vw;
  height: 100vh;
  height: 100dvh;
  max-height: 100dvh;
  padding: 0;
  border: 0;
  border-left: 1px solid #2a3c47;
  background: #0b1318;
  color: #e3e8eb;
  overflow-y: auto;
  overscroll-behavior: contain;
  box-shadow: -24px 0 80px #0006;
}
.variant-detail-dialog[open] { animation: variant-panel-in .24s ease both; }
.variant-detail-dialog::backdrop { background: rgba(2, 6, 9, .72); backdrop-filter: blur(4px); }
.variant-dialog-header { position: sticky; top: 0; z-index: 2; display: flex; justify-content: space-between; align-items: center; gap: 20px; padding: 18px 28px; background: #0b1318; border-bottom: 1px solid #2a3237; }
.variant-dialog-header > span { font-size: 10px; letter-spacing: .16em; color: #87a3b5; }
.variant-dialog-close { appearance: none; display: grid; place-items: center; width: 38px; height: 38px; padding: 0; border: 1px solid #344c5b; border-radius: 50%; background: #142028; color: #e3e8eb; font: 26px/1 Arial, sans-serif; cursor: pointer; }
.variant-dialog-close:hover { background: #20343f; }
.variant-dialog-close:focus-visible, .variant-dialog-actions a:focus-visible { outline: 2px solid #6da8d8; outline-offset: 3px; }
.variant-dialog-content { padding: 26px 28px 32px; }
.variant-dialog-content > h2 { font-size: clamp(26px, 2.8vw, 36px); font-weight: 500; line-height: 1.15; letter-spacing: -.035em; margin: 0 0 22px; }
.variant-dialog-content > .detail-eyebrow { letter-spacing: .06em; }
.variant-dialog-media { background: #fff; border-radius: 10px; overflow: hidden; margin-bottom: 24px; }
.variant-dialog-media img { display: block; width: 100%; height: 240px; object-fit: contain; }
.variant-dialog-overview-title { font-size: 16px; font-weight: 500; margin: 0 0 12px; }
#variant-dialog-description { font-size: 14px; line-height: 1.75; color: #aeb8be; margin: 0; }
.variant-dialog-tables .detail-table-block { margin-top: 26px; }
.variant-dialog-tables h3 { font-size: 18px; }
.variant-dialog-tables table { min-width: 0; font-size: 12px; }
.variant-dialog-tables th, .variant-dialog-tables td { min-width: 0 !important; padding: 10px 12px; overflow-wrap: anywhere; }
.variant-dialog-tables .detail-source-note { font-size: 12px; }
.variant-dialog-actions { display: grid; gap: 12px; margin-top: 28px; padding-top: 22px; border-top: 1px solid #2a3237; }
.variant-dialog-actions a { display: flex; justify-content: space-between; gap: 14px; padding: 12px 15px; border: 1px solid #344c5b; border-radius: 8px; color: #c4dce9; font-size: 13px; }
.variant-dialog-actions a:hover { background: #172b37; }
.variant-dialog-actions span { color: #6da8d8; }
@keyframes variant-panel-in { from { opacity: 0; transform: translateX(32px); } to { opacity: 1; transform: translateX(0); } }
@media (max-width: 900px) {
  .detail-intro { gap: 24px; }
  .detail-images--multiple img { height: 190px; }
}
@media (max-width: 760px) {
  .variant-detail-dialog { width: 100%; border-left: 0; }
  .variant-dialog-header { padding: 15px 20px; }
  .variant-dialog-content { padding: 22px 20px 28px; }
  .variant-dialog-media img { height: 210px; }
  .has-source-details .product-hero { padding: 96px 18px 18px; }
  .detail-nav { padding-bottom: 22px; }
  .detail-section { padding: 26px 0 32px; }
  .detail-intro { grid-template-columns: 1fr; gap: 20px; margin-top: 0; }
  .detail-description { font-size: 15px; line-height: 1.7; }
  .detail-images { grid-template-columns: 1fr; }
  .detail-images--multiple { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .detail-images--multiple img { height: 190px; }
  .detail-images figcaption { padding: 10px; }
  .detail-points { grid-template-columns: 1fr; gap: 14px; margin-top: 20px; }
  .detail-points > div { padding-top: 12px; }
  .detail-eyebrow { letter-spacing: .08em; font-size: 9px; }
  .variant-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
  .variant-card > span { padding: 12px; font-size: 11px; }
  .detail-table-scroll table { font-size: 12px; }
  .detail-table-scroll th, .detail-table-scroll td { padding: 11px 13px; }
  .detail-section-footer { flex-direction: column; gap: 10px; }
  .detail-video-section { padding: 28px 0 32px; }
  .has-source-details .next-product-links { grid-template-columns: 1fr; gap: 0; }
  .has-source-details .next-product-links a { padding: 14px 0; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .variant-card { transition: none; }
  .variant-card:hover { transform: none; }
  .variant-detail-dialog[open] { animation: none; }
}

/* Graphene only: compact datasheets beside the existing material overview. */
.graphene-detail-layout { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.05fr); gap:clamp(28px,4vw,64px); align-items:start; }
.graphene-detail-overview, .graphene-detail-tables { min-width:0; }
.graphene-detail-section .detail-intro { grid-template-columns:1fr; gap:24px; }
.graphene-detail-section .detail-images img { max-height:280px; }
.graphene-detail-section .detail-points { grid-template-columns:1fr; gap:16px; }
.graphene-detail-tables .detail-table-block { margin-top:24px; }
.graphene-detail-tables .detail-table-block:first-child { margin-top:0; }
.graphene-detail-tables .detail-table-scroll table { min-width:0; font-size:12px; line-height:1.55; }
.graphene-detail-tables .detail-table-scroll th, .graphene-detail-tables .detail-table-scroll td { min-width:0; padding:9px 12px; overflow-wrap:anywhere; }
.graphene-detail-tables .detail-table-block h3 { font-size:18px; }
/* The orbit is animated in 3D space; only transforms and opacity change per frame. */
.variant-wheel-stage { display:block; position:relative; height:390px; perspective:1100px; transform-style:preserve-3d; touch-action:pan-y; user-select:none; isolation:isolate; }
.detail-variants:has(.variant-wheel-stage) { overflow:hidden; padding:12px 8px 4px; }
.variant-wheel-stage::before { content:""; position:absolute; inset:12% 15% 3%; background:radial-gradient(ellipse at center, #4d9dd325, transparent 65%); pointer-events:none; }
.variant-wheel-stage .variant-card { position:absolute; top:50%; left:50%; width:clamp(230px,29vw,350px); overflow:visible; transform-origin:center; backface-visibility:hidden; transition:box-shadow .4s,border-color .4s; border:1px solid #537b9344; border-radius:20px; background:linear-gradient(145deg,#1b2b35eb,#0c141cee); box-shadow:0 20px 38px #0008; will-change:transform,opacity; }
.variant-wheel-stage .variant-card:hover { background:linear-gradient(145deg,#213745,#0c141c); }
.variant-wheel-stage .variant-card.is-active { border-color:#80caff99; box-shadow:0 0 28px #61b4f12b,0 25px 50px #0009,inset 0 1px 0 #a7d7f633; }
.variant-wheel-stage .variant-card > div { padding:18px 14px 4px; border-radius:19px 19px 0 0; background:transparent; }
.variant-wheel-stage .variant-card img { height:230px; max-height:none; aspect-ratio:auto; pointer-events:none; -webkit-user-drag:none; border-radius:8px; }
.variant-wheel-stage .variant-card > span { font-size:15px; padding:20px 22px; line-height:1.5; }
.variant-wheel-stage .variant-card:focus-visible { outline:2px solid #a2dfff; outline-offset:5px; }
.variant-wheel-controls { display:flex; justify-content:center; align-items:center; gap:18px; padding:8px 0 18px; }
.variant-wheel-controls button { appearance:none; border:1px solid #486879; color:#d6eafa; background:#12232c; border-radius:50%; width:44px; height:44px; cursor:pointer; font-family:inherit; font-size:20px; line-height:1; }
.variant-wheel-controls button:hover { background:#224151; }
.variant-wheel-controls button:focus-visible { outline:2px solid #9bd5ff; outline-offset:3px; }
.variant-wheel-status { color:#8fb0c6; font-size:12px; letter-spacing:.12em; min-width:40px; text-align:center; }
@media(max-width:1000px) { .graphene-detail-layout { gap:28px; } .variant-wheel-stage { perspective:900px; } }
@media(max-width:760px) {
 .graphene-detail-layout { grid-template-columns:1fr; gap:28px; }
 .variant-wheel-stage { height:330px; perspective:750px; }
 .variant-wheel-stage .variant-card { width:220px; border-radius:16px; }
 .variant-wheel-stage .variant-card img { height:180px; }
 .variant-wheel-stage .variant-card > span { font-size:13px; padding:16px; }
 .variant-wheel-stage .variant-card > div { padding:12px 10px 0; }
 .variant-wheel-controls { gap:14px; }
}
@media(prefers-reduced-motion:reduce) { .variant-wheel-stage .variant-card { transition:none; will-change:auto; } }

/* Uploaded GLB models, staged against the existing charcoal and blue palette. */
.variant-wheel-stage .variant-card-media { position:relative; background:radial-gradient(ellipse at 50% 85%,#328cc328,transparent 65%); }
.variant-model { display:block; width:100%; height:230px; pointer-events:none; --poster-color:transparent; }
.variant-model img[slot="poster"] { height:230px; object-fit:contain; }
.variant-dialog-media:has(model-viewer:not([hidden])) { background:radial-gradient(ellipse at 50% 90%,#275a7355,transparent 65%),linear-gradient(150deg,#172b38,#080f15); border:1px solid #40657a66; box-shadow:inset 0 0 45px #51b8f20d; }
#variant-dialog-model { display:block; width:100%; height:320px; --poster-color:transparent; touch-action:pan-y; }
#variant-dialog-model[hidden], #variant-dialog-image[hidden], .variant-model-help[hidden], .variant-model-reset[hidden] { display:none; }
.variant-model-help { font-size:11px; color:#8da9bc; letter-spacing:.03em; margin:-12px 0 10px; }
.variant-model-reset { appearance:none; border:1px solid #355164; background:#12232c; color:#bfddef; padding:8px 13px; border-radius:20px; font-size:11px; cursor:pointer; margin:0 0 22px; }
.variant-model-reset:focus-visible { outline:2px solid #9bd5ff; outline-offset:3px; }
@media(max-width:760px) { .variant-model, .variant-model img[slot="poster"] { height:180px; } #variant-dialog-model { height:270px; } }

/* Let the GLB products float directly on the page, without display boxes. */
.variant-wheel-stage .variant-card,
.variant-wheel-stage .variant-card:hover,
.variant-wheel-stage .variant-card.is-active { background:transparent; border-color:transparent; box-shadow:none; }
.variant-wheel-stage .variant-card > div,
.variant-wheel-stage .variant-card-media { background:transparent; }
.variant-dialog-media:has(model-viewer:not([hidden])) { background:transparent; border:0; box-shadow:none; }
.variant-model { transition:transform .3s ease,filter .3s ease; }
.variant-wheel-stage .variant-card.is-active .variant-model { filter:drop-shadow(0 6px 14px #6ec8ff22); }
@media(hover:hover) and (pointer:fine) {
 .variant-wheel-stage .variant-card:hover .variant-model { transform:translateY(-6px) scale(1.04); filter:drop-shadow(0 5px 16px #74cfff55); }
 .variant-wheel-stage .variant-card:hover > span { color:#ccecff; }
}
@media(prefers-reduced-motion:reduce) {
 .variant-model { transition:none; }
 .variant-wheel-stage .variant-card:hover .variant-model { transform:none; }
}

.product-footer .product-footer-about { color:#9bc8e6; font-size:11px; white-space:nowrap; }
.product-footer .product-footer-about:focus-visible { outline:2px solid #7ac5fa; outline-offset:5px; }

/* Thermonix and Asphene: balanced rows instead of one very tall left column. */
.application-detail-section {
 display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);
 grid-template-areas:"intro primary" "visual features" "footer footer";
 gap:28px clamp(28px,4vw,64px); align-items:start;
}
.application-detail-section--extended { grid-template-areas:"intro primary" "visual secondary" "features features" "footer footer"; }
.application-detail-section .graphene-detail-layout,
.application-detail-section .graphene-detail-overview,
.application-detail-section .graphene-detail-tables,
.application-detail-section .detail-intro { display:contents; }
.application-detail-section .detail-copy { grid-area:intro; }
.application-detail-section .detail-images { grid-area:visual; margin:0; }
.application-detail-section .detail-points { grid-area:features; margin:0; gap:18px; }
.application-detail-section .detail-table-block { margin:0; min-width:0; }
.application-detail-section .detail-table-block:first-child { grid-area:primary; }
.application-detail-section .detail-table-block:nth-child(2) { grid-area:secondary; }
.application-detail-section .detail-section-footer { grid-area:footer; margin-top:0; padding-top:18px; }
.application-detail-section .detail-section-heading h2 { font-size:clamp(30px,3vw,42px); }
.application-detail-section .detail-subtitle { font-size:16px; }
.application-detail-section .detail-description { font-size:15px; line-height:1.75; }
.application-detail-section .detail-copy .detail-section-heading { margin-bottom:16px; }
.application-detail-section .detail-images figure { display:flex; flex-direction:column; border:1px solid #293e4b66; background:#0c1419; }
.application-detail-section .detail-images img { height:clamp(220px,19vw,280px); max-height:none; object-fit:contain; }
.application-detail-section .detail-images figcaption { margin-top:auto; }
.application-detail-section--extended .detail-points { grid-template-columns:repeat(var(--detail-point-count,3),minmax(0,1fr)); gap:24px; }
.application-detail-section .detail-table-scroll:has(thead th:nth-child(6)) table { min-width:620px; }
@media(max-width:760px) {
 .application-detail-section { grid-template-columns:minmax(0,1fr); grid-template-areas:"intro" "primary" "visual" "features" "footer"; gap:24px; }
 .application-detail-section--extended { grid-template-areas:"intro" "primary" "visual" "secondary" "features" "footer"; }
 .application-detail-section--extended .detail-points { grid-template-columns:1fr; gap:16px; }
 .application-detail-section .detail-images img { height:220px; }
 .application-detail-section .detail-images--multiple img { height:200px; }
}

/* New supplied transparent product renders in the wheel; detail models stay GLB. */
.variant-wheel-stage .variant-product-image { background:transparent; border-radius:0; transition:transform .3s ease,filter .3s ease; }
.variant-wheel-stage .is-active .variant-product-image { filter:drop-shadow(0 6px 14px #6ec8ff22); }
@media(hover:hover) and (pointer:fine) {
 .variant-wheel-stage .variant-card:hover .variant-product-image { transform:translateY(-6px) scale(1.04); filter:drop-shadow(0 5px 16px #74cfff55); }
}
@media(prefers-reduced-motion:reduce) {
 .variant-wheel-stage .variant-product-image { transition:none; }
 .variant-wheel-stage .variant-card:hover .variant-product-image { transform:none; }
}