/* The product viewer is self-contained and uses genuine approved demo captures. */
.gv-showcase { border: 1px solid #d1dcd0; border-radius: 18px; background: #fff; overflow: hidden; box-shadow: 0 20px 60px -40px #203b3459; }
.gv-showcase button { font: inherit; color: inherit; }
.gv-showcase button:focus-visible, .gv-showcase [tabindex="0"]:focus-visible { outline: 3px solid #758d53; outline-offset: -4px; }
.gv-showcase svg { width: 20px; height: 20px; flex-shrink: 0; }
.gv-showcase-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 26px 30px 22px; }
.gv-showcase-brand { display: flex; align-items: center; gap: 13px; }
.gv-showcase-brand strong { display: block; font-size: 1rem; letter-spacing: -.025em; }
.gv-showcase-brand div > span { display: block; color: var(--muted); font-size: .76rem; margin-top: 3px; }
.gv-showcase-mark { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 11px; color: #e7f0d7; background: #294b3e; }
.gv-device-controls { display: inline-flex; border: 1px solid #d8dfd3; background: #f3f5ef; padding: 4px; border-radius: 9px; gap: 4px; }
.gv-device-controls button { display: inline-flex; align-items: center; justify-content: center; gap: 8px; border: 0; background: transparent; border-radius: 5px; font-size: .78rem; min-height: 38px; padding: 8px 15px; transition: background .2s, box-shadow .2s, color .2s; }
.gv-device-controls button[aria-pressed="true"] { background: white; color: #234536; box-shadow: 0 1px 5px #203b3424; font-weight: 600; }
.gv-device-controls button:hover { background: #e9efdf; }
.gv-device-controls button:disabled { opacity: .4; cursor: default; }
.gv-device-controls svg { width: 17px; height: 17px; }
.gv-scene-tabs { display: flex; gap: 26px; padding: 0 30px; border-bottom: 1px solid #d8dfd3; }
.gv-scene-tabs button { display: flex; align-items: center; gap: 9px; background: transparent; border: 0; border-bottom: 3px solid transparent; color: #68766b; padding: 16px 0; font-size: .85rem; transition: color .2s, border-color .2s; }
.gv-scene-tabs button > span { font-size: .67rem; color: #809079; font-variant-numeric: tabular-nums; }
.gv-scene-tabs button[aria-selected="true"] { border-bottom-color: #3c6247; color: #254b38; font-weight: 600; }
.gv-scene-tabs button:hover { color: #254b38; }
.gv-showcase-stage { position: relative; display: flex; align-items: center; justify-content: center; height: clamp(400px, 53vw, 650px); padding: 32px 44px; overflow: hidden; touch-action: pan-y pinch-zoom; user-select: none; cursor: grab; background: radial-gradient(ellipse at 50% 15%, #f7faef 0%, #edf2e7 48%, #dce5d5 100%); }
.gv-showcase-stage:active { cursor: grabbing; }
.gv-showcase-stage::before { content: ""; position: absolute; inset: 0; pointer-events: none; background-image: linear-gradient(#7589670b 1px, transparent 1px), linear-gradient(90deg, #7589670b 1px, transparent 1px); background-size: 40px 40px; }
.gv-device-frame { position: relative; display: flex; flex-direction: column; height: 100%; width: auto; max-width: 100%; aspect-ratio: 1414 / 940; overflow: hidden; background: #f4f6f7; border: 1px solid #b8c6b6; border-radius: 10px; box-shadow: 0 24px 50px -18px #253d356b, 0 2px 4px #223b3417; }
.gv-device-chrome { display: flex; align-items: center; justify-content: space-between; flex-shrink: 0; gap: 12px; height: 34px; padding: 0 13px; border-bottom: 1px solid #d6ddd4; background: #fcfdf9; color: #60705e; font-size: .61rem; }
.gv-window-dots { display: flex; gap: 4px; }
.gv-window-dots i { display: block; width: 5px; height: 5px; background: #b4c2ab; border-radius: 50%; }
.gv-frame-demo { font-size: .5rem; letter-spacing: .1em; }
.gv-device-screen { flex: 1; min-height: 0; min-width: 0; }
.gv-capture { position: relative; }
.gv-device-screen .gv-capture { width: 100%; height: 100%; }
.gv-showcase .gv-brand-cover { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.gv-device-screen img { display: block; width: 100%; height: 100%; object-fit: contain; object-position: top; -webkit-user-drag: none; }
.gv-mobile-context { display: none; }
.gv-showcase-stage[data-device="mobile"] { gap: clamp(35px, 7vw, 110px); }
.gv-showcase-stage[data-device="mobile"] .gv-device-frame { aspect-ratio: 421 / 1067; border: 7px solid #233b32; border-radius: 30px; background: white; box-shadow: 0 26px 40px -18px #203b3473, 0 0 0 1px #7c8e73; }
.gv-showcase-stage[data-device="mobile"] .gv-device-chrome { height: 22px; justify-content: center; padding: 0; border: 0; background: white; }
.gv-showcase-stage[data-device="mobile"] .gv-device-chrome > * { display: none; }
.gv-showcase-stage[data-device="mobile"] .gv-device-chrome::after { content: ""; width: 40px; height: 5px; background: #243b34; border-radius: 10px; }
.gv-showcase-stage[data-device="mobile"] .gv-mobile-context { display: block; position: relative; max-width: 290px; }
.gv-mobile-context p { font-family: "Manrope", sans-serif; font-size: clamp(1.5rem, 2.4vw, 2rem); line-height: 1.4; letter-spacing: -.05em; margin: 14px 0; }
.gv-mobile-context > span:last-child { font-size: .83rem; color: #61705c; }
.gv-showcase-caption { display: flex; align-items: center; justify-content: space-between; gap: 30px; padding: 30px; }
.gv-showcase-kicker { display: block; font-size: .65rem; letter-spacing: .1em; text-transform: uppercase; color: #6b805e; font-weight: 550; }
.gv-showcase-caption h3 { font-size: 1.37rem; margin: 9px 0; }
.gv-showcase-caption p { color: var(--muted); font-size: .9rem; margin: 0; max-width: 570px; line-height: 1.6; }
.gv-showcase-actions { display: flex; flex-direction: column; gap: 16px; align-items: flex-end; flex-shrink: 0; }
.gv-expand-button { display: inline-flex; align-items: center; gap: 7px; border: 0; padding: 7px 0; background: transparent; font-size: .78rem !important; text-decoration: underline; text-underline-offset: 4px; min-height: 36px; }
.gv-expand-button svg { width: 15px; height: 15px; }
.gv-slide-navigation { display: flex; align-items: center; gap: 15px; }
.gv-slide-navigation > span { font-size: .7rem; font-variant-numeric: tabular-nums; color: #65785b; }
.gv-slide-navigation button { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 50%; border: 1px solid #c5d2bb; background: #f8faf4; transition: background .2s, transform .2s; }
.gv-slide-navigation button:hover { background: #e7efdc; transform: translateY(-2px); }
.gv-showcase-footnote { display: flex; justify-content: space-between; gap: 16px; padding: 15px 30px; border-top: 1px solid #e4e9de; font-size: .69rem; color: #6b7864; background: #fcfdf9; }
.gv-showcase-footnote span:first-child { display: flex; gap: 8px; align-items: center; }
.gv-showcase-footnote i { width: 6px; height: 6px; border-radius: 50%; background: #7c9563; flex-shrink: 0; }
.gv-visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.public-site:has(.gv-showcase-dialog[open]) { overflow: hidden; }
.gv-showcase-dialog { width: min(1400px, calc(100vw - 48px)); max-width: none; max-height: calc(100dvh - 48px); border: 1px solid #c2ceba; padding: 0; border-radius: 12px; background: #f5f7f2; color: #223b34; box-shadow: 0 24px 100px #152c3466; }
.gv-showcase-dialog::backdrop { background: #152a22cf; backdrop-filter: blur(5px); }
.gv-showcase-dialog[data-device="mobile"] { width: min(620px, calc(100vw - 48px)); }
.gv-lightbox-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 18px 22px; border-bottom: 1px solid #d9e1d3; background: #fcfdf9; }
.gv-lightbox-toolbar h3 { font-size: 1.1rem; margin: 5px 0 0; }
.gv-lightbox-toolbar > div:last-child { display: flex; align-items: center; gap: 12px; }
.gv-lightbox-toolbar button { border: 1px solid #becdb5; border-radius: 5px; background: #f2f6ec; min-height: 42px; padding: 8px 13px; font-size: .8rem; }
.gv-lightbox-toolbar [data-close] span { margin-left: 10px; font-size: 1.1rem; }
.gv-lightbox-canvas { overflow: auto; max-height: calc(100dvh - 160px); padding: 20px; }
.gv-lightbox-canvas .gv-capture { width: var(--capture-width); max-width: 100%; margin: auto; }
.gv-lightbox-canvas img { display: block; width: 100%; height: auto; }
.gv-lightbox-canvas.is-zoomed .gv-capture { max-width: none; }
.gv-models-section { background: #f1f4f5; }
.gv-showcase[data-showcase="models"] { border-color: #d0dbe0; }
.gv-showcase[data-showcase="models"] .gv-showcase-mark { background: #29485a; color: #e9f3f5; }
.gv-showcase[data-showcase="models"] .gv-showcase-stage { background: radial-gradient(ellipse at 50% 15%, #f7fafc 0%, #eaf0f5 48%, #dce5eb 100%); }
.gv-output-label { color: #426455; font-size: .73rem; border: 1px solid #dce5dd; border-radius: 6px; background: #f5f9f5; padding: 9px 12px; }
@media (max-width: 760px) {
  .gv-showcase { border-radius: 12px; }
  .gv-showcase-toolbar { flex-wrap: wrap; gap: 18px; padding: 22px 20px 16px; }
  .gv-showcase-brand strong { font-size: .94rem; }
  .gv-showcase-brand div > span { font-size: .72rem; }
  .gv-device-controls { width: 100%; }
  .gv-device-controls button { flex: 1; min-height: 44px; }
  .gv-scene-tabs { padding: 0 20px; gap: 20px; }
  .gv-scene-tabs button { flex: 1; font-size: .76rem; gap: 7px; text-align: left; line-height: 1.4; min-height: 60px; }
  .gv-showcase-stage { height: 600px; padding: 24px 16px; }
  .gv-showcase-stage[data-device="desktop"] { height: clamp(230px, 55vw, 400px); padding: 22px 12px; }
  .gv-device-frame { border-radius: 6px; }
  .gv-device-chrome { height: 22px; padding: 0 8px; font-size: .48rem; }
  .gv-frame-demo { font-size: .4rem; }
  .gv-showcase-stage[data-device="mobile"] .gv-mobile-context { display: none; }
  .gv-showcase-stage[data-device="mobile"] .gv-device-frame { border-width: 5px; border-radius: 22px; }
  .gv-showcase-caption { flex-direction: column; align-items: stretch; gap: 18px; padding: 24px 20px; }
  .gv-showcase-caption h3 { font-size: 1.2rem; }
  .gv-showcase-caption p { font-size: .85rem; }
  .gv-showcase-actions { flex-direction: row; justify-content: space-between; align-items: center; }
  .gv-expand-button, .gv-lightbox-toolbar button { min-height: 44px; }
  .gv-slide-navigation { gap: 9px; }
  .gv-slide-navigation button { width: 44px; height: 44px; }
  .gv-showcase-footnote { flex-direction: column; gap: 7px; padding: 16px 20px; }
  .gv-showcase-dialog { width: calc(100vw - 20px); max-height: calc(100dvh - 20px); }
  .gv-showcase-dialog[data-device="mobile"] { width: calc(100vw - 20px); }
  .gv-lightbox-toolbar { padding: 16px; flex-wrap: wrap; gap: 13px; }
  .gv-lightbox-toolbar h3 { font-size: .95rem; }
  .gv-lightbox-canvas { padding: 10px; max-height: calc(100dvh - 180px); }
  .gv-showcase[data-showcase="models"] .gv-scene-tabs { gap: 12px; }
  .gv-showcase[data-showcase="models"] .gv-scene-tabs button { font-size: .71rem; }
  .gv-showcase[data-showcase="models"] .gv-scene-tabs button > span { display: none; }
}
@media (max-width: 360px) {
  .gv-scene-tabs { padding-inline: 15px; gap: 13px; }
  .gv-scene-tabs button > span { display: none; }
  .gv-showcase-actions { flex-wrap: wrap; gap: 12px; }
}