/* Generated from the audited OpenDesign homepage. Do not redesign here. */
.card {
      border: 1px solid var(--border);
      border-radius: var(--radius-lg);
      background: var(--bg);
      padding: 28px;
    }
    .card-flat { border: 0; background: transparent; padding: 0; }
    .card-rule {
      border: 0;
      border-top: 1px solid var(--fg);
      border-radius: 0;
      background: transparent;
      padding: 24px 0 0;
    }
    .feature {
      min-width: 0;
      padding-top: 24px;
      border-top: 1px solid var(--fg);
    }
    .feature .feature-mark {
      display: grid;
      width: 36px;
      height: 36px;
      margin-bottom: var(--gap-md);
      place-items: center;
      border: 1px solid var(--border);
      border-radius: var(--radius);
      color: var(--fg);
    }
    .feature .feature-mark svg { width: 18px; height: 18px; }
    .feature h3 { margin-bottom: 8px; }
    .feature p { margin: 0; color: var(--muted); font-size: 15px; }
    .feature .model-list {
      min-height: 88px;
      margin: 20px 0;
      padding: 14px 0 0;
      border-top: 1px solid var(--border);
      color: var(--fg);
      font-family: var(--font-mono);
      font-size: 12px;
      line-height: 1.7;
    }

    .pill {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      padding: 4px 10px;
      border-radius: 999px;
      background: var(--fg-soft);
      color: var(--fg);
      font-family: var(--font-mono);
      font-size: 11px;
      letter-spacing: 0.04em;
      text-transform: uppercase;
    }
    .tag {
      display: inline-flex;
      align-items: center;
      padding: 4px 10px;
      border: 1px solid var(--border);
      border-radius: 999px;
      background: transparent;
      color: var(--muted);
      font-size: 12px;
    }

    .ds-table { width: 100%; border-collapse: collapse; font-size: 14px; }
    .ds-table th, .ds-table td {
      padding: 12px 14px;
      border-bottom: 1px solid var(--border);
      text-align: left;
    }
    .ds-table th {
      color: var(--muted);
      font-family: var(--font-mono);
      font-size: 12px;
      font-weight: 500;
      letter-spacing: 0.04em;
      text-transform: uppercase;
    }
    .ds-table tbody tr:hover { background: var(--fg-soft); }
    .ds-table .num-col {
      text-align: right;
      font-family: var(--font-mono);
      font-variant-numeric: tabular-nums;
    }

    .ph-img {
      display: grid;
      overflow: hidden;
      aspect-ratio: 16 / 10;
      place-items: center;
      border: 1px solid var(--border);
      border-radius: var(--radius-lg);
      background: linear-gradient(135deg, var(--surface), var(--fg-soft)), var(--surface);
      color: var(--muted);
      font-family: var(--font-mono);
      font-size: 12px;
      letter-spacing: 0.04em;
    }
    .ph-img.square { aspect-ratio: 1 / 1; }
    .ph-img.portrait { aspect-ratio: 3 / 4; }
    .ph-img.wide { aspect-ratio: 16 / 9; }

    .hero {
      position: relative;
      display: flex;
      min-height: calc(100svh - 100px);
      overflow: hidden;
      align-items: stretch;
      padding: 0;
      background: var(--fg);
      color: var(--bg);
      isolation: isolate;
    }
    .hero-video {
      position: absolute;
      inset: 0;
      z-index: -2;
      width: 100%;
      height: 100%;
      -o-object-fit: cover;
         object-fit: cover;
      -o-object-position: center;
         object-position: center;
    }
    .hero::after {
      position: absolute;
      inset: 0;
      z-index: -1;
      background:
        linear-gradient(90deg, color-mix(in oklch, var(--fg) 96%, transparent) 0%, color-mix(in oklch, var(--fg) 78%, transparent) 44%, color-mix(in oklch, var(--fg) 22%, transparent) 72%, transparent 86%),
        linear-gradient(0deg, color-mix(in oklch, var(--fg) 70%, transparent) 0%, transparent 56%);
      content: '';
      pointer-events: none;
    }
    .hero-shell {
      position: relative;
      display: flex;
      width: 100%;
      align-items: flex-end;
      padding-block: clamp(110px, 14vh, 180px) clamp(42px, 7vh, 72px);
    }
    .hero-copy { width: min(1180px, 88%); }
    .hero .eyebrow {
      margin-bottom: 18px;
      color: var(--accent);
    }
    .hero h1 {
      max-width: 1120px;
      margin: 0;
      color: var(--bg);
      font-size: clamp(56px, 6vw, 90px);
      font-weight: 620;
      line-height: 1;
      letter-spacing: -.055em;
    }
    .hero h1 span { display: block; }
    .hero .lead {
      max-width: 56ch;
      margin-top: 26px;
      color: color-mix(in oklch, var(--bg) 83%, transparent);
      font-size: clamp(16px, 1.35vw, 20px);
      line-height: 1.55;
    }
    .hero-cta {
      display: inline-flex;
      flex-wrap: wrap;
      gap: var(--gap-sm);
      margin-top: 30px;
    }
    .hero .btn-light {
      border-color: var(--bg);
      background: var(--bg);
      color: var(--fg);
      box-shadow: 0 12px 28px color-mix(in oklch, var(--fg) 28%, transparent);
    }
    .hero .btn-light:hover { background: color-mix(in oklch, var(--bg) 88%, var(--border)); }
    .hero .btn-glass {
      border-color: color-mix(in oklch, var(--bg) 50%, transparent);
      background: color-mix(in oklch, var(--fg) 30%, transparent);
      color: var(--bg);
      -webkit-backdrop-filter: blur(10px);
              backdrop-filter: blur(10px);
    }
    .hero .btn-glass:hover { border-color: var(--bg); }
    .hero .btn:focus-visible {
      outline-color: var(--bg);
    }
    .hero-proof {
      margin: 26px 0 0;
      color: color-mix(in oklch, var(--bg) 72%, transparent);
      font-family: var(--font-mono);
      font-size: 12px;
      letter-spacing: .035em;
    }
    .company-proof {
      overflow: hidden;
      padding-block: clamp(80px, 10vw, 144px);
      background: var(--bg);
    }
    .company-proof-head {
      display: grid;
      grid-template-columns: minmax(0, 1.2fr) minmax(320px, .8fr);
      align-items: end;
      gap: clamp(32px, 6vw, 96px);
    }
    .company-proof .eyebrow {
      margin-bottom: 18px;
      color: var(--accent);
    }
    .company-proof-title {
      max-width: 15ch;
      margin: 0;
      font-size: clamp(44px, 5vw, 72px);
      font-weight: 620;
      line-height: .98;
      letter-spacing: -.045em;
    }
    .company-proof-lead {
      max-width: 46ch;
      margin: 0 0 6px;
      color: var(--muted);
      font-size: clamp(16px, 1.35vw, 20px);
      line-height: 1.65;
    }
    .company-marquee {
      position: relative;
      margin-top: clamp(42px, 6vw, 72px);
      overflow: hidden;
      outline: none;
      -webkit-mask-image: linear-gradient(to right, transparent, var(--fg) 4%, var(--fg) 96%, transparent);
              mask-image: linear-gradient(to right, transparent, var(--fg) 4%, var(--fg) 96%, transparent);
    }
    .company-marquee:focus-visible {
      outline: 3px solid var(--accent-soft);
      outline-offset: 6px;
    }
    .company-marquee-track {
      display: flex;
      width: -moz-max-content;
      width: max-content;
      animation: company-proof-scroll 48s linear infinite;
      will-change: transform;
    }
    .company-marquee:hover .company-marquee-track,
    .company-marquee:focus-within .company-marquee-track {
      animation-play-state: paused;
    }
    .company-marquee-group {
      display: flex;
      align-items: center;
      gap: 20px;
      padding-right: 20px;
    }
    .proof-card {
      flex: none;
      overflow: hidden;
      margin: 0;
      border: 1px solid var(--border);
      background: var(--surface);
      transition: transform .22s ease, border-color .22s ease;
    }
    .proof-card:hover {
      border-color: color-mix(in oklch, var(--fg) 48%, var(--border));
      transform: translateY(-4px);
    }
    .proof-card--wide { width: clamp(340px, 34vw, 520px); }
    .proof-card--portrait { width: clamp(240px, 23vw, 320px); }
    .proof-media {
      overflow: hidden;
      background: var(--surface);
    }
    .proof-card--wide .proof-media { aspect-ratio: 16 / 10; }
    .proof-card--portrait .proof-media { aspect-ratio: 4 / 5; background: var(--bg); }
    .proof-media img {
      display: block;
      width: 100%;
      height: 100%;
      -o-object-fit: cover;
         object-fit: cover;
      transition: transform .5s ease;
    }
    .proof-card:hover .proof-media img { transform: scale(1.025); }
    .proof-card--portrait .proof-media img {
      -o-object-fit: contain;
         object-fit: contain;
      background: var(--bg);
    }
    .proof-caption {
      display: grid;
      min-height: 84px;
      align-content: center;
      gap: 5px;
      padding: 16px 18px 18px;
      border-top: 1px solid var(--border);
      background: var(--bg);
    }
    .proof-caption span {
      color: var(--muted);
      font-family: var(--font-mono);
      font-size: 10px;
      letter-spacing: .08em;
      text-transform: uppercase;
    }
    .proof-caption strong {
      font-size: 16px;
      line-height: 1.35;
    }
    @keyframes company-proof-scroll {
      to { transform: translate3d(-50%, 0, 0); }
    }
    .product-categories {
      overflow: hidden;
      padding-block: clamp(80px, 10vw, 144px);
      background: var(--fg);
      color: var(--bg);
    }
    .product-categories-head {
      display: grid;
      grid-template-columns: minmax(0, 1.2fr) minmax(320px, .8fr);
      align-items: end;
      gap: clamp(32px, 6vw, 96px);
    }
    .product-categories .eyebrow {
      margin-bottom: 18px;
      color: var(--accent);
    }
    .product-categories-title {
      max-width: 14ch;
      font-size: clamp(44px, 5vw, 72px);
      font-weight: 620;
      line-height: .98;
      letter-spacing: -.045em;
    }
    .product-categories-lead {
      max-width: 46ch;
      margin: 0 0 6px;
      color: color-mix(in oklch, var(--bg) 68%, transparent);
      font-size: clamp(16px, 1.35vw, 20px);
      line-height: 1.65;
    }
    .product-module {
      margin-top: clamp(46px, 6vw, 78px);
    }
    .product-module-head {
      display: flex;
      align-items: end;
      justify-content: space-between;
      gap: 24px;
      padding-bottom: 18px;
      border-bottom: 1px solid color-mix(in oklch, var(--bg) 20%, transparent);
    }
    .product-module-title {
      color: var(--bg);
      font-size: clamp(22px, 2vw, 30px);
    }
    .product-module-meta {
      margin: 0;
      color: color-mix(in oklch, var(--bg) 58%, transparent);
      font-family: var(--font-mono);
      font-size: 11px;
      letter-spacing: .08em;
      text-transform: uppercase;
    }
    .product-static-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: clamp(36px, 4vw, 58px) 20px;
      margin-top: 24px;
    }
    .product-category-card {
      min-width: 0;
    }
    .product-category-media {
      position: relative;
      overflow: hidden;
      aspect-ratio: 5 / 4;
      background: color-mix(in oklch, var(--fg) 91%, var(--bg));
    }
    .product-category-media img {
      display: block;
      width: 100%;
      height: 100%;
      padding: clamp(10px, 1.4vw, 20px);
      -o-object-fit: contain;
         object-fit: contain;
      -o-object-position: center;
         object-position: center;
      transition: transform .55s cubic-bezier(.2, .75, .25, 1);
    }
    .product-category-card:hover .product-category-media img,
    .product-category-card:focus-within .product-category-media img {
      transform: scale(1.045);
    }
    .product-category-index {
      position: absolute;
      top: 16px;
      left: 16px;
      color: color-mix(in oklch, var(--bg) 62%, transparent);
      font-family: var(--font-mono);
      font-size: 11px;
      letter-spacing: .08em;
    }
    .product-category-body {
      padding-top: 20px;
      border-top: 1px solid color-mix(in oklch, var(--bg) 18%, transparent);
    }
    .product-category-body h3 {
      color: var(--bg);
      font-size: clamp(23px, 2vw, 30px);
    }
    .product-category-body p {
      min-height: 46px;
      margin: 9px 0 14px;
      color: color-mix(in oklch, var(--bg) 62%, transparent);
      font-size: 14px;
      line-height: 1.55;
    }
    .product-static-grid .product-category-body h3 {
      font-size: clamp(26px, 2.6vw, 38px);
    }
    .product-slider-module {
      margin-top: clamp(72px, 8vw, 112px);
      padding-top: 34px;
      border-top: 1px solid color-mix(in oklch, var(--bg) 20%, transparent);
    }
    .product-slider-head {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 24px;
    }
    .product-slider-controls {
      display: flex;
      align-items: center;
      gap: 10px;
    }
    .product-slider-button {
      display: grid;
      width: 48px;
      height: 48px;
      place-items: center;
      border: 1px solid color-mix(in oklch, var(--bg) 28%, transparent);
      border-radius: 50%;
      background: transparent;
      color: var(--bg);
      transition: border-color .2s ease, background .2s ease;
    }
    .product-slider-button:hover,
    .product-slider-button:focus-visible {
      border-color: var(--bg);
      background: color-mix(in oklch, var(--bg) 10%, transparent);
    }
    .product-slider-button:focus-visible {
      outline: 2px solid var(--bg);
      outline-offset: 3px;
    }
    .product-slider-button svg {
      width: 20px;
      height: 20px;
    }
    .product-slider-track {
      display: flex;
      gap: 20px;
      margin-top: 24px;
      padding-bottom: 10px;
      overflow-x: auto;
      overscroll-behavior-inline: contain;
      scroll-snap-type: none;
      scrollbar-width: none;
    }
    .product-slider-track::-webkit-scrollbar {
      display: none;
    }
    .product-slider-track .product-category-card {
      flex: 0 0 calc((100% - 40px) / 3);
      scroll-snap-align: start;
    }
    .product-category-action {
      display: inline-flex;
      min-height: 44px;
      align-items: center;
      gap: 9px;
      padding: 0;
      border: 0;
      border-bottom: 1px solid color-mix(in oklch, var(--bg) 48%, transparent);
      background: transparent;
      color: var(--bg);
      font-weight: 650;
      letter-spacing: .02em;
      transition: border-color .2s ease, gap .2s ease;
    }
    .product-category-action:hover,
    .product-category-action:focus-visible {
      gap: 13px;
      border-color: var(--bg);
    }
    .product-category-action:focus-visible {
      outline: 2px solid var(--bg);
      outline-offset: 4px;
    }
    .venue-solutions {
      padding-block: clamp(84px, 10vw, 144px);
      background: var(--bg);
      color: var(--fg);
    }
    .venue-solutions-head {
      display: grid;
      grid-template-columns: minmax(0, 1.15fr) minmax(320px, .85fr);
      align-items: end;
      gap: clamp(32px, 6vw, 96px);
    }
    .venue-solutions .eyebrow {
      margin-bottom: 18px;
      color: var(--accent);
    }
    .venue-solutions-title {
      max-width: 13ch;
      font-size: clamp(44px, 5vw, 72px);
      font-weight: 620;
      line-height: .98;
      letter-spacing: -.045em;
    }
    .venue-solutions-lead {
      max-width: 48ch;
      margin: 0 0 6px;
      color: var(--muted);
      font-size: clamp(16px, 1.35vw, 20px);
      line-height: 1.65;
    }
    .venue-solutions-grid {
      display: grid;
      grid-template-columns: repeat(12, minmax(0, 1fr));
      gap: clamp(44px, 5vw, 72px) 20px;
      margin-top: clamp(52px, 7vw, 88px);
    }
    .venue-card {
      min-width: 0;
      padding-top: 16px;
      border-top: 1px solid var(--fg);
    }
    .venue-card--wide { grid-column: span 7; }
    .venue-card--narrow { grid-column: span 5; }
    .venue-card-media {
      overflow: hidden;
      aspect-ratio: 16 / 10;
      background: var(--surface);
    }
    .venue-card-media img {
      width: 100%;
      height: 100%;
      transition: transform .55s cubic-bezier(.2, .75, .25, 1);
    }
    .venue-card--photo .venue-card-media img { -o-object-fit: cover; object-fit: cover; }
    .venue-card--product .venue-card-media img {
      padding: 0;
      -o-object-fit: cover;
         object-fit: cover;
      -o-object-position: center;
         object-position: center;
    }
    .venue-card:hover .venue-card-media img,
    .venue-card:focus-within .venue-card-media img {
      transform: scale(1.035);
    }
    .venue-card-body {
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      align-items: end;
      gap: 24px;
      padding-top: 22px;
    }
    .venue-card--narrow .venue-card-body { grid-template-columns: 1fr; }
    .venue-card--narrow .venue-action { justify-self: start; }
    .venue-card-index {
      margin: 0 0 12px;
      color: var(--muted);
      font-family: var(--font-mono);
      font-size: 11px;
      letter-spacing: .08em;
      text-transform: uppercase;
    }
    .venue-card h3 {
      font-size: clamp(26px, 2.8vw, 40px);
      line-height: 1.03;
      letter-spacing: -.035em;
    }
    .venue-card-description {
      max-width: 52ch;
      margin: 12px 0 0;
      color: var(--muted);
      font-size: 15px;
      line-height: 1.65;
    }
    .venue-card-combo {
      margin: 14px 0 0;
      color: var(--fg);
      font-family: var(--font-mono);
      font-size: 11px;
      line-height: 1.6;
      letter-spacing: .04em;
    }
    .venue-action {
      display: inline-flex;
      min-height: 44px;
      flex: 0 0 auto;
      align-items: center;
      gap: 9px;
      padding: 0;
      border: 0;
      border-bottom: 1px solid color-mix(in oklch, var(--fg) 42%, transparent);
      background: transparent;
      color: var(--fg);
      font-weight: 650;
      letter-spacing: .02em;
      white-space: nowrap;
      transition: border-color .2s ease, gap .2s ease;
    }
    .venue-action:hover,
    .venue-action:focus-visible {
      gap: 13px;
      border-color: var(--fg);
    }
    .venue-action:focus-visible {
      outline: 2px solid currentColor;
      outline-offset: 4px;
    }
    .oem-process {
      padding-block: clamp(84px, 10vw, 144px);
      background: var(--surface);
      color: var(--fg);
    }
    .oem-process-shell {
      display: grid;
      grid-template-columns: minmax(0, .82fr) minmax(420px, 1.18fr);
      align-items: start;
      gap: clamp(48px, 8vw, 120px);
    }
    .oem-process-intro {
      position: sticky;
      top: 110px;
      align-self: start;
    }
    .oem-process .eyebrow {
      margin-bottom: 18px;
      color: var(--accent);
    }
    .oem-process-title {
      max-width: 11ch;
      font-size: clamp(44px, 5vw, 72px);
      font-weight: 620;
      line-height: .98;
      letter-spacing: -.045em;
    }
    .oem-process-lead {
      max-width: 42ch;
      margin: 24px 0 0;
      color: var(--muted);
      font-size: clamp(16px, 1.25vw, 19px);
      line-height: 1.65;
    }
    .oem-process-visual {
      margin: clamp(34px, 5vw, 56px) 0 0;
    }
    .oem-process-visual img {
      width: 100%;
      aspect-ratio: 4 / 3;
      -o-object-fit: cover;
         object-fit: cover;
    }
    .oem-process-visual figcaption {
      padding-top: 10px;
      color: var(--muted);
      font-family: var(--font-mono);
      font-size: 10px;
      line-height: 1.5;
      letter-spacing: .08em;
      text-transform: uppercase;
    }
    .oem-process-list {
      border-top: 1px solid var(--fg);
    }
    .oem-step {
      display: grid;
      grid-template-columns: 72px minmax(0, 1fr);
      gap: 24px;
      padding: clamp(28px, 4vw, 46px) 0;
      border-bottom: 1px solid var(--border);
    }
    .oem-step-number {
      padding-top: 5px;
      color: var(--muted);
      font-family: var(--font-mono);
      font-size: 11px;
      letter-spacing: .08em;
    }
    .oem-step h3 {
      font-size: clamp(24px, 2.4vw, 34px);
      line-height: 1.08;
      letter-spacing: -.03em;
    }
    .oem-step p {
      max-width: 58ch;
      margin: 10px 0 0;
      color: var(--muted);
      font-size: 15px;
      line-height: 1.65;
    }
    .oem-process-cta {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 24px;
      padding-top: 32px;
    }
    .oem-process-cta p {
      max-width: 42ch;
      margin: 0;
      color: var(--muted);
      font-size: 14px;
      line-height: 1.6;
    }
    .global-support {
      padding-block: clamp(84px, 10vw, 144px);
      background: var(--fg);
      color: var(--bg);
    }
    .global-support-head {
      display: grid;
      grid-template-columns: minmax(0, 1.15fr) minmax(320px, .85fr);
      align-items: end;
      gap: clamp(40px, 8vw, 128px);
    }
    .global-support .eyebrow {
      margin-bottom: 18px;
      color: var(--accent);
    }
    .global-support-title {
      max-width: 11ch;
      font-size: clamp(48px, 6vw, 86px);
      font-weight: 620;
      line-height: .94;
      letter-spacing: -.05em;
    }
    .global-support-lead {
      max-width: 48ch;
      margin: 0;
      color: color-mix(in oklch, var(--bg) 68%, transparent);
      font-size: clamp(16px, 1.35vw, 20px);
      line-height: 1.65;
    }
    .global-support-cta {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 24px;
      margin-top: 30px;
    }
    .global-support-cta p {
      max-width: 38ch;
      margin: 0;
      color: color-mix(in oklch, var(--bg) 58%, transparent);
      font-size: 13px;
      line-height: 1.6;
    }
    .global-support-grid {
      display: grid;
      grid-template-columns: repeat(4, minmax(0, 1fr));
      margin-top: clamp(56px, 7vw, 96px);
      border-top: 1px solid color-mix(in oklch, var(--bg) 34%, transparent);
      border-bottom: 1px solid color-mix(in oklch, var(--bg) 34%, transparent);
    }
    .global-support-card {
      display: flex;
      min-width: 0;
      min-height: clamp(300px, 27vw, 390px);
      flex-direction: column;
      padding: clamp(24px, 3vw, 40px);
      border-left: 1px solid color-mix(in oklch, var(--bg) 22%, transparent);
      transition: background-color .25s ease;
    }
    .global-support-card:first-child { border-left: 0; }
    .global-support-card:hover,
    .global-support-card:focus-within {
      background: color-mix(in oklch, var(--bg) 7%, transparent);
    }
    .global-support-card-number {
      color: color-mix(in oklch, var(--bg) 48%, transparent);
      font-family: var(--font-mono);
      font-size: 11px;
      letter-spacing: .08em;
    }
    .global-support-card-body {
      margin-top: auto;
      padding-top: 72px;
    }
    @media (min-width: 641px) {
      html[lang="zh-CN"] .global-support-card[data-od-id="global-support-card-installation"] .global-support-card-body {
        padding-bottom: clamp(25px, 2.4vw, 34px);
      }
      html[lang="zh-CN"] .global-support-card[data-od-id="global-support-card-parts"] .global-support-card-body {
        padding-bottom: clamp(25px, 2.4vw, 34px);
      }
    }
    .global-support-card-label {
      margin: 0 0 14px;
      color: color-mix(in oklch, var(--bg) 52%, transparent);
      font-family: var(--font-mono);
      font-size: 10px;
      letter-spacing: .08em;
      text-transform: uppercase;
    }
    .global-support-card h3 {
      max-width: 12ch;
      font-size: clamp(24px, 2.25vw, 34px);
      line-height: 1.06;
      letter-spacing: -.035em;
    }
    .global-support-card-description {
      margin: 16px 0 0;
      color: color-mix(in oklch, var(--bg) 66%, transparent);
      font-size: 14px;
      line-height: 1.65;
    }
    .faq-section {
      padding-block: clamp(84px, 10vw, 144px);
      background: var(--bg);
      color: var(--fg);
    }
    .faq-shell {
      display: grid;
      grid-template-columns: minmax(280px, .72fr) minmax(500px, 1.28fr);
      align-items: start;
      gap: clamp(48px, 9vw, 140px);
    }
    .faq-intro {
      position: sticky;
      top: 110px;
      align-self: start;
    }
    .faq-section .eyebrow {
      margin-bottom: 18px;
      color: var(--accent);
    }
    .faq-title {
      max-width: 10ch;
      font-size: clamp(46px, 5.5vw, 78px);
      font-weight: 620;
      line-height: .96;
      letter-spacing: -.048em;
    }
    .faq-lead {
      max-width: 38ch;
      margin: 24px 0 0;
      color: var(--muted);
      font-size: 16px;
      line-height: 1.65;
    }
    .faq-contact {
      margin-top: 36px;
      padding-top: 24px;
      border-top: 1px solid var(--border);
    }
    .faq-contact p {
      max-width: 34ch;
      margin: 0 0 18px;
      color: var(--muted);
      font-size: 13px;
      line-height: 1.6;
    }
    .faq-list {
      border-top: 1px solid var(--fg);
    }
    .faq-item {
      border-bottom: 1px solid var(--border);
    }
    .faq-item summary {
      display: grid;
      min-height: 94px;
      grid-template-columns: 56px minmax(0, 1fr) 32px;
      align-items: center;
      gap: 20px;
      padding: 24px 0;
      cursor: pointer;
      list-style: none;
    }
    .faq-item summary::-webkit-details-marker { display: none; }
    .faq-number {
      color: var(--muted);
      font-family: var(--font-mono);
      font-size: 11px;
      letter-spacing: .08em;
    }
    .faq-item h3 {
      font-size: clamp(21px, 2vw, 29px);
      line-height: 1.18;
      letter-spacing: -.025em;
    }
    .faq-toggle {
      position: relative;
      width: 24px;
      height: 24px;
      justify-self: end;
    }
    .faq-toggle::before,
    .faq-toggle::after {
      position: absolute;
      top: 50%;
      left: 50%;
      width: 16px;
      height: 1px;
      background: currentColor;
      content: "";
      transform: translate(-50%, -50%);
      transition: transform .2s ease;
    }
    .faq-toggle::after { transform: translate(-50%, -50%) rotate(90deg); }
    .faq-item[open] .faq-toggle::after { transform: translate(-50%, -50%) rotate(0); }
    .faq-item[open] summary { color: var(--fg); }
    .faq-answer {
      max-width: 65ch;
      margin: 0;
      padding: 0 48px 32px 76px;
      color: var(--muted);
      font-size: 15px;
      line-height: 1.72;
    }
    .faq-item summary:hover h3,
    .faq-item summary:focus-visible h3 {
      text-decoration: underline;
      text-decoration-thickness: 1px;
      text-underline-offset: 5px;
    }
    .faq-item summary:focus-visible {
      outline: 1px solid var(--fg);
      outline-offset: 5px;
    }
    .final-cta {
      padding-block: clamp(88px, 10vw, 144px);
      background: var(--accent);
      color: var(--fg);
    }
    .final-cta-shell {
      display: grid;
      grid-template-columns: minmax(300px, .78fr) minmax(560px, 1.22fr);
      align-items: start;
      gap: clamp(48px, 8vw, 128px);
    }
    .final-cta .eyebrow {
      margin-bottom: 20px;
      color: var(--fg);
    }
    .final-cta-title {
      max-width: 9ch;
      font-size: clamp(56px, 6.6vw, 96px);
      font-weight: 650;
      line-height: .92;
      letter-spacing: -.055em;
    }
    .final-cta-lead {
      max-width: 38ch;
      margin: 30px 0 0;
      color: color-mix(in oklch, var(--fg) 76%, transparent);
      font-size: clamp(16px, 1.3vw, 19px);
      line-height: 1.65;
    }
    .project-form {
      min-width: 0;
    }
    .project-form-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 22px 18px;
    }
    .project-field {
      display: flex;
      min-width: 0;
      flex-direction: column;
      gap: 8px;
    }
    .project-field--full { grid-column: 1 / -1; }
    .project-field label {
      color: var(--fg);
      font-family: var(--font-mono);
      font-size: 10px;
      font-weight: 700;
      letter-spacing: .08em;
      text-transform: uppercase;
    }
    .project-input,
    .project-textarea {
      width: 100%;
      border: 1px solid color-mix(in oklch, var(--fg) 18%, transparent);
      border-radius: 2px;
      background: var(--bg);
      color: var(--fg);
      font: inherit;
      transition: border-color .2s ease, box-shadow .2s ease;
    }
    .project-input {
      min-height: 60px;
      padding: 0 18px;
    }
    .project-textarea {
      min-height: 142px;
      padding: 17px 18px;
      line-height: 1.55;
      resize: vertical;
    }
    .project-input:focus,
    .project-textarea:focus {
      border-color: var(--fg);
      box-shadow: 0 0 0 3px color-mix(in oklch, var(--fg) 14%, transparent);
    }
    .project-input[aria-invalid="true"],
    .project-textarea[aria-invalid="true"] {
      border-color: var(--fg);
      box-shadow: inset 0 -2px 0 var(--fg);
    }
    .project-error {
      min-height: 17px;
      color: var(--fg);
      font-size: 11px;
      line-height: 1.4;
    }
    .project-form-actions {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 22px;
      margin-top: 24px;
    }
    .project-upload {
      position: relative;
      display: inline-flex;
      min-height: 44px;
      align-items: center;
      color: var(--fg);
      font-size: 13px;
      font-weight: 650;
      text-decoration: underline;
      text-underline-offset: 4px;
      cursor: pointer;
    }
    .project-upload input {
      position: absolute;
      width: 1px;
      height: 1px;
      overflow: hidden;
      clip: rect(0 0 0 0);
      -webkit-clip-path: inset(50%);
              clip-path: inset(50%);
      white-space: nowrap;
    }
    .project-upload:focus-within {
      outline: 2px solid var(--fg);
      outline-offset: 4px;
    }
    .project-submit {
      min-width: 200px;
      flex: 0 0 auto;
    }
    .final-cta-secondary {
      border: 1px solid color-mix(in oklch, var(--fg) 42%, transparent);
      background: transparent;
      color: var(--fg);
    }
    .final-cta-secondary:hover,
    .final-cta-secondary:focus-visible {
      border-color: var(--fg);
      background: var(--fg);
      color: var(--bg);
    }
    .project-form-note {
      margin: 14px 0 0;
      color: color-mix(in oklch, var(--fg) 62%, transparent);
      font-family: var(--font-mono);
      font-size: 10px;
      line-height: 1.6;
      letter-spacing: .05em;
      text-transform: uppercase;
    }
    .project-success {
      min-height: 480px;
      padding: clamp(34px, 5vw, 64px);
      border: 1px solid color-mix(in oklch, var(--fg) 18%, transparent);
      background: var(--bg);
      color: var(--fg);
    }
    .project-success[hidden] { display: none; }
    .project-success h3 {
      max-width: 14ch;
      margin-top: 22px;
      font-size: clamp(36px, 4vw, 56px);
      line-height: 1;
      letter-spacing: -.04em;
    }
    .project-success p {
      max-width: 46ch;
      margin: 20px 0 0;
      color: var(--muted);
      line-height: 1.65;
    }
    .project-success-actions {
      display: flex;
      flex-wrap: wrap;
      gap: 12px;
      margin-top: 34px;
    }
    .log-row {
      display: grid;
      grid-template-columns: 150px minmax(0, 1fr) 140px;
      align-items: baseline;
      gap: var(--gap-lg);
      padding: 26px 0;
      border-top: 1px solid var(--border);
    }
    .log-row .meta { color: var(--muted); }
    .log-row h3 { font-size: 20px; }
    .log-row p { margin: 6px 0 0; color: var(--muted); font-size: 14px; }
    .log-row .pull { text-align: right; }

    .service-panel {
      border-top: 1px solid var(--fg);
      padding-top: 24px;
    }
    .service-list {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 1px;
      margin-top: 36px;
      background: var(--border);
      border: 1px solid var(--border);
    }
    .service-item {
      min-height: 148px;
      background: var(--bg);
      padding: 24px;
    }
    .service-item .num {
      display: block;
      margin-bottom: 30px;
      color: var(--muted);
      font-size: 12px;
    }
    .service-item strong {
      display: block;
      margin-bottom: 5px;
      font-family: var(--font-display);
      font-size: 19px;
    }
    .service-item p { margin: 0; color: var(--muted); font-size: 14px; }

    @media (max-width: 920px) {
      .hero {
        min-height: calc(100svh - 96px);
      }
      .hero-shell {
        padding-block: 112px 46px;
      }
      .hero-copy { width: min(720px, calc(100% - 70px)); }
      .hero h1 { max-width: 960px; }
      .company-proof-head {
        grid-template-columns: 1fr;
        align-items: start;
      }
      .company-proof-lead { max-width: 58ch; }
      .product-categories-head {
        grid-template-columns: 1fr;
        align-items: start;
      }
      .product-categories-lead { max-width: 58ch; }
      .product-slider-track .product-category-card {
        flex-basis: calc((100% - 20px) / 2);
      }
      .venue-solutions-head {
        grid-template-columns: 1fr;
        align-items: start;
      }
      .venue-solutions-lead { max-width: 58ch; }
      .venue-card--wide,
      .venue-card--narrow { grid-column: span 6; }
      .venue-card-body { grid-template-columns: 1fr; }
      .venue-action { justify-self: start; }
      .oem-process-shell {
        grid-template-columns: 1fr;
        gap: 64px;
      }
      .oem-process-intro { position: static; }
      .oem-process-title { max-width: 13ch; }
      .oem-process-visual img { aspect-ratio: 16 / 9; }
      .global-support-head {
        grid-template-columns: 1fr;
        align-items: start;
      }
      .global-support-lead { max-width: 58ch; }
      .global-support-cta {
        max-width: 58ch;
        align-items: flex-end;
      }
      .global-support-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
      .global-support-card { border-bottom: 1px solid color-mix(in oklch, var(--bg) 22%, transparent); }
      .global-support-card:nth-child(odd) { border-left: 0; }
      .global-support-card:nth-last-child(-n + 2) { border-bottom: 0; }
      .faq-shell {
        grid-template-columns: 1fr;
        gap: 64px;
      }
      .faq-intro { position: static; }
      .faq-title { max-width: 12ch; }
      .faq-lead { max-width: 52ch; }
      .faq-contact {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 24px;
      }
      .faq-contact p { margin-bottom: 0; }
      .final-cta-shell {
        grid-template-columns: 1fr;
        align-items: start;
      }
      .final-cta-title { max-width: 11ch; }
      .final-cta-lead { max-width: 52ch; }
      .log-row { grid-template-columns: 120px minmax(0, 1fr); }
      .log-row .pull { grid-column: 2; text-align: left; }
    }

    @media (max-width: 600px) {
      .hero { min-height: calc(100svh - 90px); }
      .hero::after {
        background:
          linear-gradient(0deg, color-mix(in oklch, var(--fg) 82%, transparent) 0%, color-mix(in oklch, var(--fg) 30%, transparent) 68%, transparent 100%);
      }
      .hero-video { -o-object-position: 58% center; object-position: 58% center; }
      .hero-shell { padding-block: 128px 34px; }
      .hero-copy { width: 100%; padding-right: 0; }
      .hero h1 {
        max-width: 100%;
        font-size: clamp(40px, 10vw, 54px);
        line-height: 1;
      }
      .hero .lead {
        max-width: 35ch;
        margin-top: 20px;
        font-size: 15px;
      }
      .hero-cta { width: 100%; }
      .hero-cta .btn { flex: 1 1 auto; min-width: 0; padding-inline: 16px; }
      .hero-proof { max-width: calc(100% - 58px); font-size: 10px; line-height: 1.5; }
      .company-proof { padding-block: 72px; }
      .company-proof-title {
        max-width: 12ch;
        font-size: clamp(38px, 10vw, 52px);
      }
      .company-marquee {
        margin-top: 36px;
        -webkit-mask-image: linear-gradient(to right, transparent, var(--fg) 2%, var(--fg) 98%, transparent);
                mask-image: linear-gradient(to right, transparent, var(--fg) 2%, var(--fg) 98%, transparent);
      }
      .company-marquee-track { animation-duration: 38s; }
      .company-marquee-group { gap: 14px; padding-right: 14px; }
      .proof-card--wide { width: min(82vw, 360px); }
      .proof-card--portrait { width: min(64vw, 270px); }
      .product-categories { padding-block: 72px; }
      .product-categories-title {
        max-width: 12ch;
        font-size: clamp(38px, 10vw, 52px);
      }
      .product-static-grid {
        grid-template-columns: 1fr;
        gap: 42px;
      }
      .product-module-head {
        align-items: start;
      }
      .product-module-meta {
        max-width: 18ch;
        text-align: right;
      }
      .product-slider-module {
        margin-top: 64px;
      }
      .product-slider-head {
        align-items: end;
      }
      .product-slider-controls {
        flex: none;
      }
      .product-slider-button {
        width: 44px;
        height: 44px;
      }
      .product-slider-track {
        gap: 16px;
        margin-inline: calc(var(--gutter) * -1);
        padding: 0 var(--gutter) 12px;
      }
      .product-slider-track .product-category-card {
        flex: 0 0 min(82vw, 360px);
      }
      .product-category-media { aspect-ratio: 1 / 1; }
      .product-category-body p { min-height: 0; }
      .venue-solutions { padding-block: 72px; }
      .venue-solutions-title {
        max-width: 12ch;
        font-size: clamp(38px, 10vw, 52px);
      }
      .venue-card--wide,
      .venue-card--narrow { grid-column: 1 / -1; }
      .venue-card-media { aspect-ratio: 4 / 3; }
      .venue-card--product .venue-card-media img { padding: 0; }
      .venue-card h3 { font-size: clamp(27px, 8vw, 36px); }
      .oem-process { padding-block: 72px; }
      .oem-process-title {
        max-width: 12ch;
        font-size: clamp(38px, 10vw, 52px);
      }
      .oem-step {
        grid-template-columns: 48px minmax(0, 1fr);
        gap: 14px;
      }
      .oem-process-cta {
        align-items: stretch;
        flex-direction: column;
      }
      .oem-process-cta .btn { width: 100%; }
      .global-support { padding-block: 72px; }
      .global-support-title {
        max-width: 11ch;
        font-size: clamp(42px, 12vw, 58px);
      }
      .global-support-cta {
        align-items: stretch;
        flex-direction: column;
      }
      .global-support-cta .btn { width: 100%; }
      .global-support-grid { grid-template-columns: 1fr; }
      .global-support-card {
        min-height: 250px;
        border-left: 0;
        border-bottom: 1px solid color-mix(in oklch, var(--bg) 22%, transparent);
      }
      .global-support-card:nth-last-child(-n + 2) { border-bottom: 1px solid color-mix(in oklch, var(--bg) 22%, transparent); }
      .global-support-card:last-child { border-bottom: 0; }
      .global-support-card-body { padding-top: 52px; }
      .faq-section { padding-block: 72px; }
      .faq-title {
        max-width: 11ch;
        font-size: clamp(40px, 11vw, 54px);
      }
      .faq-contact {
        align-items: stretch;
        flex-direction: column;
      }
      .faq-contact .btn { width: 100%; }
      .faq-item summary {
        grid-template-columns: 38px minmax(0, 1fr) 24px;
        gap: 12px;
      }
      .faq-item h3 { font-size: 21px; }
      .faq-answer { padding: 0 0 28px 50px; }
      .final-cta { padding-block: 82px; }
      .final-cta-title {
        max-width: 11ch;
        font-size: clamp(46px, 13vw, 64px);
      }
      .project-form-grid { grid-template-columns: 1fr; }
      .project-field--full { grid-column: auto; }
      .project-form-actions {
        align-items: stretch;
        flex-direction: column;
      }
      .project-form-actions .btn { width: 100%; }
      .project-upload { align-self: flex-start; }
      .project-success { min-height: 0; }
      .project-success-actions {
        align-items: stretch;
        flex-direction: column;
      }
      .project-success-actions .btn { width: 100%; }
      .log-row { grid-template-columns: 1fr; gap: 8px; }
      .log-row .pull { grid-column: 1; }
      .service-list { grid-template-columns: 1fr; }
      .service-item { min-height: 126px; }
    }

    @media (prefers-reduced-motion: reduce) {
      .company-marquee {
        overflow-x: auto;
        -webkit-mask-image: none;
                mask-image: none;
      }
      .company-marquee-track { animation: none; }
      .company-marquee-group[aria-hidden="true"] { display: none; }
    }
    .home-intro {
      position: fixed;
      z-index: 10000;
      inset: 0;
      display: grid;
      min-height: 100svh;
      overflow: hidden;
      place-items: center;
      background: var(--fg);
      color: var(--bg);
      isolation: isolate;
    }
    .home-intro[hidden] { display: none; }
    .home-intro::before,
    .home-intro::after {
      position: absolute;
      z-index: -1;
      left: 0;
      width: 100%;
      height: 1px;
      background: color-mix(in oklch, var(--accent) 34%, transparent);
      content: '';
      transform: scaleX(0);
      transform-origin: left;
      animation: home-intro-scan 1.25s cubic-bezier(.22, 1, .36, 1) forwards;
    }
    .home-intro::before { top: 27%; }
    .home-intro::after { right: 0; bottom: 25%; transform-origin: right; animation-delay: .14s; }
    .home-intro-frame {
      position: absolute;
      inset: clamp(18px, 3vw, 48px);
      border: 1px solid color-mix(in oklch, var(--bg) 12%, transparent);
      pointer-events: none;
    }
    .home-intro-frame::before,
    .home-intro-frame::after {
      position: absolute;
      width: clamp(54px, 9vw, 140px);
      height: 2px;
      background: var(--accent);
      content: '';
      transform: scaleX(0);
      animation: home-intro-corner .72s .2s cubic-bezier(.22, 1, .36, 1) forwards;
    }
    .home-intro-frame::before { top: -1px; left: -1px; transform-origin: left; }
    .home-intro-frame::after { right: -1px; bottom: -1px; transform-origin: right; }
    .home-intro-meta {
      position: absolute;
      top: clamp(32px, 5vw, 72px);
      right: clamp(32px, 5vw, 72px);
      display: flex;
      align-items: center;
      gap: 12px;
      color: color-mix(in oklch, var(--bg) 58%, transparent);
      font-family: var(--font-mono);
      font-size: 10px;
      letter-spacing: .12em;
      text-transform: uppercase;
      opacity: 0;
      animation: home-intro-fade .45s .3s ease forwards;
    }
    .home-intro-meta::before { width: 28px; height: 1px; background: var(--accent); content: ''; }
    .home-intro-brand {
      display: grid;
      width: min(760px, calc(100vw - 64px));
      justify-items: center;
      gap: clamp(22px, 4vw, 40px);
      text-align: center;
    }
    .home-intro-mark-shell {
      position: relative;
      display: grid;
      width: min(680px, 100%);
      aspect-ratio: 1371 / 626;
      place-items: center;
      opacity: 0;
      transform: translateY(20px) scale(.88);
      animation: home-intro-mark .72s .24s cubic-bezier(.16, 1, .3, 1) forwards;
    }
    .home-intro-mark-shell::before,
    .home-intro-mark-shell::after {
      display: none;
    }
    .home-intro-mark-shell::after { inset: -36%; animation-delay: .58s; }
    .home-intro-mark {
      width: 100%;
      height: 100%;
      -o-object-fit: contain;
         object-fit: contain;
      filter: drop-shadow(0 16px 36px color-mix(in oklch, var(--accent) 28%, transparent));
    }
    .home-intro-wordmark {
      overflow: visible;
      max-width: 100%;
      padding: .12em .18em .2em;
      color: var(--bg);
      font-family: var(--font-display);
      font-size: clamp(38px, 6.2vw, 88px);
      font-weight: 750;
      line-height: 1.12;
      letter-spacing: -.035em;
      white-space: nowrap;
      -webkit-clip-path: inset(-20% 100% -20% 0);
              clip-path: inset(-20% 100% -20% 0);
      animation: home-intro-reveal .78s .72s cubic-bezier(.22, 1, .36, 1) forwards;
    }
    .home-intro-wordmark small {
      display: block;
      margin-bottom: 12px;
      color: var(--accent);
      font-family: var(--font-mono);
      font-size: clamp(10px, 1.1vw, 13px);
      font-weight: 600;
      line-height: 1.2;
      letter-spacing: .22em;
      text-transform: uppercase;
    }
    .home-intro-wordmark sup { margin-left: 5px; font-size: .16em; vertical-align: top; }
    .home-intro-rails { position: absolute; z-index: -1; inset: 0; pointer-events: none; }
    .home-intro-rail {
      position: absolute;
      left: -12vw;
      width: 34vw;
      height: 2px;
      background: var(--accent);
      opacity: 0;
      transform: translateX(-110%) skewX(-28deg);
      animation: home-intro-rail 1s cubic-bezier(.3, .7, .2, 1) forwards;
    }
    .home-intro-rail:nth-child(1) { top: 39%; animation-delay: .08s; }
    .home-intro-rail:nth-child(2) { top: 48%; width: 24vw; animation-delay: .2s; }
    .home-intro-rail:nth-child(3) { top: 61%; width: 42vw; animation-delay: .34s; }
    .home-intro-progress {
      position: absolute;
      right: clamp(32px, 5vw, 72px);
      bottom: clamp(32px, 5vw, 72px);
      left: clamp(32px, 5vw, 72px);
      height: 1px;
      overflow: hidden;
      background: color-mix(in oklch, var(--bg) 14%, transparent);
    }
    .home-intro-progress::after {
      display: block;
      width: 100%;
      height: 100%;
      background: var(--accent);
      content: '';
      transform: scaleX(0);
      transform-origin: left;
      animation: home-intro-progress 1.85s .18s linear forwards;
    }
    .home-intro-skip {
      position: absolute;
      z-index: 2;
      left: clamp(32px, 5vw, 72px);
      bottom: clamp(44px, 6vw, 84px);
      display: inline-flex;
      min-height: 44px;
      align-items: center;
      gap: 10px;
      padding: 0 2px;
      border: 0;
      background: transparent;
      color: color-mix(in oklch, var(--bg) 62%, transparent);
      font-family: var(--font-mono);
      font-size: 10px;
      letter-spacing: .14em;
      text-transform: uppercase;
      opacity: 0;
      transition: color .2s ease;
      animation: home-intro-fade .4s .85s ease forwards;
    }
    .home-intro-skip::after { content: '→'; color: var(--accent); font-size: 15px; transition: transform .2s ease; }
    .home-intro-skip:hover,
    .home-intro-skip:focus-visible { color: var(--bg); }
    .home-intro-skip:hover::after { transform: translateX(4px); }
    .home-intro.is-leaving { animation: home-intro-leave .48s cubic-bezier(.76, 0, .24, 1) forwards; }

    @keyframes home-intro-scan { to { transform: scaleX(1); } }
    @keyframes home-intro-corner { to { transform: scaleX(1); } }
    @keyframes home-intro-fade { to { opacity: 1; } }
    @keyframes home-intro-mark { to { opacity: 1; transform: translateY(0) scale(1); } }
    @keyframes home-intro-ring { 55% { opacity: .65; } 100% { opacity: 0; transform: scale(1.15); } }
    @keyframes home-intro-reveal { to { -webkit-clip-path: inset(-20% 0 -20% 0); clip-path: inset(-20% 0 -20% 0); } }
    @keyframes home-intro-rail { 20% { opacity: .9; } 100% { opacity: 0; transform: translateX(430%) skewX(-28deg); } }
    @keyframes home-intro-progress { to { transform: scaleX(1); } }
    @keyframes home-intro-leave { 0% { -webkit-clip-path: inset(0); clip-path: inset(0); } 100% { -webkit-clip-path: inset(0 0 100% 0); clip-path: inset(0 0 100% 0); } }

    @media (max-width: 600px) {
      .home-intro-frame { inset: 14px; }
      .home-intro-meta { top: 30px; right: 26px; max-width: 25ch; justify-content: flex-end; text-align: right; }
      .home-intro-brand { width: calc(100vw - 44px); gap: 24px; }
      .home-intro-wordmark { padding-inline: .08em; font-size: clamp(32px, 9.8vw, 46px); letter-spacing: -.025em; }
      .home-intro-progress { right: 26px; bottom: 28px; left: 26px; }
      .home-intro-skip { left: 26px; bottom: 38px; }
    }

    @media (prefers-reduced-motion: reduce) {
      .home-intro *, .home-intro *::before, .home-intro *::after { animation: none !important; transition: none !important; }
      .home-intro-meta, .home-intro-mark-shell, .home-intro-skip { opacity: 1; transform: none; }
      .home-intro-wordmark { -webkit-clip-path: none; clip-path: none; }
      .home-intro-progress::after { transform: scaleX(1); }
    }

/* Shoplazza Theme Editor overrides: OpenDesign values remain the preset defaults. */
.hero-video--mobile { display: none; }
.jis-native-section {
  background-color: var(--jis-section-bg, transparent);
}

/* Shoplazza form app integration; appended after the exact OpenDesign source CSS. */
.project-form-status { margin: 12px 0 0; font-size: 13px; }
.project-form-status:empty { display: none; }
.project-form--app input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
.project-form--app select,
.project-form--app textarea {
  width: 100%;
  min-height: 60px;
  border: 1px solid color-mix(in oklch, var(--fg) 18%, transparent);
  border-radius: 2px;
  background: var(--bg);
  color: var(--fg);
  font: inherit;
}
.project-form--app input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
.project-form--app select { padding: 0 18px; }
.project-form--app textarea { min-height: 142px; padding: 17px 18px; }
.project-form--app button,
.project-form--app input[type="submit"] {
  min-height: 48px;
  border: 1px solid var(--fg);
  border-radius: 999px;
  padding: 0 24px;
  background: var(--fg);
  color: var(--bg);
  font: inherit;
  font-weight: 700;
}
.jis-native-section > .container,
.jis-native-section > .container[class] {
  width: min(calc(100% - (var(--gutter, 32px) * 2)), var(--jis-section-content-width, var(--container, 1180px)));
  max-width: none;
}
.jis-native-section:not(.hero) {
  padding-top: var(--jis-space-top, 104px);
  padding-bottom: var(--jis-space-bottom, 104px);
}
.hero[data-image-position="left"] .hero-video { -o-object-position: left center; object-position: left center; }
.hero[data-image-position="right"] .hero-video { -o-object-position: right center; object-position: right center; }
.product-categories .product-static-grid {
  grid-template-columns: repeat(var(--jis-columns, 2), minmax(0, 1fr));
}
.product-category-media { display: block; }
.global-support .global-support-grid {
  grid-template-columns: repeat(var(--jis-columns, 4), minmax(0, 1fr));
}
.company-proof[data-desktop-layout="grid"] .company-marquee { overflow: visible; }
.company-proof[data-desktop-layout="grid"] .company-marquee-track { animation: none; }
.company-proof[data-desktop-layout="grid"] .company-marquee-group:first-child {
  display: grid;
  width: min(calc(100% - (var(--gutter, 32px) * 2)), var(--jis-section-content-width, var(--container, 1180px)));
  margin-inline: auto;
  grid-template-columns: repeat(var(--jis-columns, 3), minmax(0, 1fr));
}
.company-proof[data-desktop-layout="grid"] .company-marquee-group[aria-hidden="true"] { display: none; }
.company-proof[data-desktop-layout="grid"] .proof-card { width: auto; }
.venue-solutions[data-desktop-layout="cards"] .venue-solutions-grid {
  grid-template-columns: repeat(var(--jis-columns, 4), minmax(0, 1fr));
}
.venue-solutions[data-desktop-layout="cards"] .venue-card { grid-column: auto; }
.oem-process[data-desktop-layout="cards"] .oem-process-shell { grid-template-columns: 1fr; }
.oem-process[data-desktop-layout="cards"] .oem-process-intro { position: static; }
.oem-process[data-desktop-layout="cards"] .oem-process-list { display: grid; grid-template-columns: repeat(var(--jis-columns, 3), minmax(0, 1fr)); gap: 20px; border: 0; }
.oem-process[data-desktop-layout="cards"] .oem-step { display: block; border-top: 1px solid var(--fg); }
.faq-section[data-desktop-layout="stack"] .faq-shell,
.final-cta[data-desktop-layout="stack"] .final-cta-shell { grid-template-columns: 1fr; }
@media (min-width: 768px) {
  .hero[data-desktop-layout="split"] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    min-height: 720px;
    color: var(--fg);
  }
  .hero[data-desktop-layout="split"]::after { display: none; }
  .hero[data-desktop-layout="split"] .hero-video {
    position: relative;
    grid-column: 2;
    grid-row: 1;
    min-height: 720px;
  }
  .hero[data-desktop-layout="split"] .hero-shell {
    grid-column: 1;
    grid-row: 1;
    width: min(calc(100% - 64px), 590px);
    min-height: 720px;
    padding-block: var(--jis-space-top, 80px) var(--jis-space-bottom, 80px);
    align-items: center;
  }
  .hero[data-desktop-layout="split"] .hero-copy { width: 100%; }
  .hero[data-desktop-layout="split"] .hero .lead { color: var(--muted); }
  .hero[data-desktop-layout="split"][data-image-position="left"] .hero-video { grid-column: 1; }
  .hero[data-desktop-layout="split"][data-image-position="left"] .hero-shell { grid-column: 2; }
}
@media (max-width: 767px) {
  .jis-native-section:not(.hero) {
    padding-top: var(--jis-space-top-mobile, 72px);
    padding-bottom: var(--jis-space-bottom-mobile, 72px);
  }
  .jis-native-section > .container,
  .jis-native-section > .container[class] {
    width: min(calc(100% - 36px), var(--jis-section-content-width, var(--container, 1180px)));
  }
  .hero[data-desktop-layout="split"] { display: flex; min-height: 0; flex-direction: column; color: var(--fg); }
  .hero[data-desktop-layout="split"]::after { display: none; }
  .hero[data-desktop-layout="split"] .hero-video { position: relative; min-height: 0; aspect-ratio: 4 / 3; }
  .hero[data-has-mobile-video="true"] .hero-video--desktop { display: none; }
  .hero[data-has-mobile-video="true"] .hero-video--mobile { display: block; }
  .hero[data-desktop-layout="split"] .hero-shell { min-height: 0; padding-block: var(--jis-space-top-mobile, 64px) var(--jis-space-bottom-mobile, 64px); }
  .hero[data-desktop-layout="split"][data-mobile-layout="media-first"] .hero-video { order: 1; }
  .hero[data-desktop-layout="split"][data-mobile-layout="media-first"] .hero-shell { order: 2; }
  .hero[data-desktop-layout="split"][data-mobile-layout="text-first"] .hero-video { order: 2; }
  .hero[data-desktop-layout="split"][data-mobile-layout="text-first"] .hero-shell { order: 1; }
  .company-proof[data-mobile-layout="stack"] .company-marquee { overflow: visible; }
  .company-proof[data-mobile-layout="stack"] .company-marquee-track { animation: none; }
  .company-proof[data-mobile-layout="stack"] .company-marquee-group:first-child { display: grid; width: calc(100% - 36px); margin-inline: auto; grid-template-columns: repeat(var(--jis-columns-mobile, 1), minmax(0, 1fr)); }
  .company-proof[data-mobile-layout="stack"] .company-marquee-group[aria-hidden="true"] { display: none; }
  .company-proof[data-mobile-layout="stack"] .proof-card { width: auto; }
  .product-categories[data-mobile-layout="scroll"] .product-static-grid { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; }
  .product-categories[data-mobile-layout="scroll"] .product-category-card { flex: 0 0 min(84vw, 360px); scroll-snap-align: start; }
  .product-categories[data-mobile-layout="grid"] .product-static-grid { grid-template-columns: repeat(var(--jis-columns-mobile, 1), minmax(0, 1fr)); }
  .venue-solutions[data-mobile-layout="scroll"] .venue-solutions-grid { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; }
  .venue-solutions[data-mobile-layout="scroll"] .venue-card { flex: 0 0 min(86vw, 380px); scroll-snap-align: start; }
  .global-support[data-mobile-layout="stack"] .global-support-grid { grid-template-columns: 1fr; }
  .global-support[data-mobile-layout="grid"] .global-support-grid { grid-template-columns: repeat(var(--jis-columns-mobile, 1), minmax(0, 1fr)); }
  .oem-process[data-mobile-layout="compact"] .oem-process-visual { display: none; }
  .faq-section[data-mobile-layout="compact"] .faq-intro { margin-bottom: 28px; }
  .final-cta[data-mobile-layout="form-first"] .project-form { order: 1; }
  .final-cta[data-mobile-layout="form-first"] .final-cta-shell > :first-child { order: 2; }
}

/* Theme Editor-only compact placeholders keep unbound collection blocks editable without a fake product database. */
.product-category-card--editor-compact {
  position: relative;
  min-height: 74px;
  padding: 16px 18px;
  border: 1px dashed color-mix(in oklch, var(--bg) 32%, transparent);
}
.product-category-card--editor-compact .product-category-index {
  position: static;
  display: block;
  margin-bottom: 6px;
}
.product-category-card--editor-compact .product-category-body {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: 8px 18px;
  padding-top: 0;
  border-top: 0;
}
.product-category-card--editor-compact .product-category-body h3 { font-size: 16px; }
.product-category-card--editor-compact .product-category-body p { grid-column: 1 / -1; min-height: 0; margin: 0; }
.product-category-card--editor-compact .product-category-action { min-height: 28px; font-size: 14px; }