/* OpenDesign source: jisultra-about.css */
.about-page { min-height: 70vh; overflow: clip; background: var(--bg); color: var(--fg); }
.about-page h1,
.about-page h2,
.about-page h3,
.about-page p { margin-top: 0; }

.about-breadcrumb { display: flex; min-height: 62px; align-items: center; gap: 8px; color: var(--muted); font-size: 12px; }
.about-breadcrumb a { display: inline-flex; min-height: 44px; align-items: center; }
.about-breadcrumb a:hover,
.about-breadcrumb [aria-current="page"] { color: var(--fg); }

.about-eyebrow { margin-bottom: 18px; color: var(--accent); font-family: var(--font-mono); font-size: 11px; letter-spacing: .08em; text-transform: uppercase; }
.about-hero {
  position: relative;
  overflow: hidden;
  padding: clamp(58px, 7vw, 112px) 0 clamp(84px, 9vw, 142px);
  background: var(--bg);
}
.about-hero-head { display: grid; grid-template-columns: minmax(0, .88fr) minmax(480px, 1.12fr); align-items: center; gap: clamp(48px, 7vw, 112px); }
.about-hero-copy { max-width: 700px; }
.about-hero h1 { max-width: 9ch; margin-bottom: clamp(30px, 4vw, 48px); font-size: clamp(56px, 6.4vw, 96px); font-weight: 650; line-height: .92; letter-spacing: -.058em; }
.about-hero-intro { max-width: 560px; }
.about-hero-intro > p { max-width: 54ch; margin-bottom: 30px; color: var(--fg); font-size: clamp(16px, 1.4vw, 19px); line-height: 1.75; }
.about-hero-actions { display: flex; flex-wrap: wrap; gap: 12px; }
.about-hero-media { margin: 0; overflow: hidden; background: var(--surface); }
.about-hero-media img { display: block; width: 100%; aspect-ratio: 6 / 5; -o-object-fit: cover; object-fit: cover; -o-object-position: center; object-position: center; }

.about-identity { padding-block: clamp(90px, 10vw, 150px); border-top: 1px solid var(--border); }
.about-identity-grid { display: grid; grid-template-columns: minmax(0, .88fr) minmax(440px, 1.12fr); gap: clamp(60px, 9vw, 150px); }
.about-identity h2,
.about-section-head h2,
.about-field-copy h2,
.about-cta h2 { margin-bottom: 0; font-size: clamp(40px, 5.2vw, 76px); font-weight: 650; line-height: .98; letter-spacing: -.05em; }
.about-identity h2 { max-width: 12ch; }
.about-identity-lead { max-width: 58ch; margin-bottom: 46px; color: var(--muted); font-size: 16px; line-height: 1.8; }
.about-priority-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-top: 1px solid var(--border); border-left: 1px solid var(--border); }
.about-priority-grid article { min-height: 218px; padding: 24px; border-right: 1px solid var(--border); border-bottom: 1px solid var(--border); }
.about-priority-grid span,
.about-principles-grid span { display: block; margin-bottom: 38px; color: var(--accent); font-family: var(--font-mono); font-size: 10px; }
.about-priority-grid h3 { margin-bottom: 11px; font-size: 18px; }
.about-priority-grid p { margin-bottom: 0; color: var(--muted); font-size: 12px; line-height: 1.65; }

.about-proof { padding-block: clamp(88px, 9vw, 138px); background: var(--surface); }
.about-section-head { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(300px, .9fr); align-items: end; gap: 44px; margin-bottom: clamp(42px, 6vw, 72px); }
.about-section-head > p { max-width: 56ch; margin-bottom: 4px; color: var(--muted); font-size: 14px; line-height: 1.7; }
.about-proof-tabs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border: 1px solid var(--border); background: var(--border); gap: 1px; }
.about-proof-tabs button { min-height: 64px; padding: 14px 18px; border: 0; background: var(--bg); color: var(--muted); font: inherit; font-size: 12px; font-weight: 650; cursor: pointer; transition: background .2s ease, color .2s ease; }
.about-proof-tabs button:hover { color: var(--fg); }
.about-proof-tabs button[aria-selected="true"] { background: var(--fg); color: var(--bg); }
.about-proof-tabs button:focus-visible { position: relative; z-index: 1; outline: 2px solid var(--accent); outline-offset: -4px; }
.about-proof-panel { border-right: 1px solid var(--border); border-bottom: 1px solid var(--border); border-left: 1px solid var(--border); }
.about-proof-content { display: grid; grid-template-columns: minmax(0, 1.22fr) minmax(320px, .78fr); min-height: 560px; background: var(--bg); }
.about-proof-media { position: relative; min-height: 560px; overflow: hidden; background: var(--surface); }
.about-proof-media img { position: absolute; inset: 0; width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; }
.about-proof-media.is-document img { inset: 7%; width: 86%; height: 86%; -o-object-fit: contain; object-fit: contain; }
.about-proof-copy { display: flex; flex-direction: column; justify-content: space-between; padding: clamp(34px, 5vw, 66px); border-left: 1px solid var(--border); }
.about-proof-copy > span { color: var(--accent); font-family: var(--font-mono); font-size: 10px; letter-spacing: .08em; }
.about-proof-copy h3 { max-width: 11ch; margin: auto 0 22px; font-size: clamp(32px, 4vw, 56px); line-height: 1; letter-spacing: -.04em; }
.about-proof-copy p { max-width: 46ch; margin-bottom: 0; color: var(--muted); font-size: 13px; line-height: 1.75; }

.about-services { padding-block: clamp(90px, 10vw, 150px); }
.about-services-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 1px solid var(--border); border-left: 1px solid var(--border); }
.about-services-grid > * { display: flex; min-height: 360px; flex-direction: column; padding: 26px; border: 0; border-right: 1px solid var(--border); border-bottom: 1px solid var(--border); background: var(--bg); color: var(--fg); font: inherit; text-align: left; cursor: pointer; transition: transform .25s ease, background .25s ease; }
.about-services-grid > *:hover { position: relative; z-index: 1; transform: translateY(-4px); background: var(--surface); }
.about-services-grid > *:focus-visible { outline: 2px solid var(--fg); outline-offset: 3px; }
.about-services-grid span { color: var(--accent); font-family: var(--font-mono); font-size: 10px; }
.about-services-grid h3 { margin: auto 0 15px; font-size: 22px; line-height: 1.18; }
.about-services-grid p { margin-bottom: 26px; color: var(--muted); font-size: 12px; line-height: 1.7; }
.about-services-grid strong { font-size: 12px; }

.about-field { padding-block: clamp(90px, 10vw, 150px); background: var(--surface); }
.about-field-grid { display: grid; grid-template-columns: minmax(440px, 1.08fr) minmax(0, .92fr); align-items: center; gap: clamp(56px, 9vw, 138px); }
.about-field figure { margin: 0; overflow: hidden; background: var(--bg); }
.about-field figure img { display: block; width: 100%; aspect-ratio: 4 / 5; -o-object-fit: cover; object-fit: cover; -o-object-position: center; object-position: center; }
.about-field-copy h2 { max-width: 11ch; margin-bottom: 28px; }
.about-field-copy > p:not(.about-eyebrow) { max-width: 54ch; margin-bottom: 34px; color: var(--muted); font-size: 14px; line-height: 1.75; }
.about-field-copy ul { margin: 0; padding: 0; border-top: 1px solid var(--border); }
.about-field-copy li { display: grid; grid-template-columns: 42px minmax(0, 1fr); gap: 18px; padding: 20px 0; border-bottom: 1px solid var(--border); list-style: none; }
.about-field-copy li span { color: var(--accent); font-family: var(--font-mono); font-size: 10px; }
.about-field-copy li strong { font-size: 13px; line-height: 1.5; }

.about-principles { padding-block: clamp(90px, 10vw, 150px); }
.about-principles-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.about-principles-grid article { min-height: 300px; padding: 28px; border: 1px solid var(--border); background: var(--bg); }
.about-principles-grid h3 { margin: auto 0 14px; font-size: 24px; }
.about-principles-grid p { margin-bottom: 0; color: var(--muted); font-size: 13px; line-height: 1.7; }

.about-cta { padding-block: clamp(82px, 9vw, 132px); background: var(--fg); color: var(--bg); }
.about-cta-grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(320px, .85fr); align-items: end; gap: clamp(50px, 8vw, 128px); }
.about-cta h2 { max-width: 11ch; }
.about-cta-grid > div:last-child p { max-width: 50ch; margin-bottom: 28px; color: color-mix(in oklch, var(--bg) 68%, transparent); font-size: 14px; line-height: 1.7; }

@media (max-width: 1050px) {
  .about-services-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .about-services-grid > * { min-height: 300px; }
  .about-field-grid { grid-template-columns: minmax(360px, 1fr) 1fr; gap: 54px; }
}

@media (max-width: 880px) {
  .about-hero-head,
  .about-identity-grid,
  .about-section-head,
  .about-field-grid,
  .about-cta-grid { grid-template-columns: 1fr; }
  .about-hero h1 { max-width: 12ch; }
  .about-hero-head { gap: 48px; }
  .about-hero-copy,
  .about-hero-intro { max-width: 680px; }
  .about-hero-media img { aspect-ratio: 16 / 10; }
  .about-identity-grid { gap: 52px; }
  .about-identity h2 { max-width: 14ch; }
  .about-proof-content { grid-template-columns: 1fr; }
  .about-proof-copy { min-height: 370px; border-top: 1px solid var(--border); border-left: 0; }
  .about-proof-copy h3 { margin-top: 80px; }
  .about-field figure { order: 2; }
  .about-field figure img { aspect-ratio: 4 / 3; }
  .about-principles-grid { grid-template-columns: 1fr; }
  .about-principles-grid article { min-height: 240px; }
}

@media (max-width: 600px) {
  .about-breadcrumb { min-height: 54px; }
  .about-hero { padding: 34px 0 74px; }
  .about-hero-head { gap: 36px; }
  .about-hero h1 { font-size: clamp(44px, 14vw, 66px); }
  .about-hero-media img { aspect-ratio: 4 / 3; }
  .about-priority-grid,
  .about-proof-tabs,
  .about-services-grid { grid-template-columns: 1fr; }
  .about-priority-grid article { min-height: 190px; }
  .about-proof-tabs button { min-height: 56px; }
  .about-proof-media { min-height: 400px; }
  .about-services-grid > * { min-height: 250px; }
  .about-principles-grid article { min-height: 220px; }
}

@media (prefers-reduced-motion: reduce) {
  .about-services-grid > *,
  .about-proof-tabs button { transition: none; }
}

/* OpenDesign source: jisultra-oem-odm.css */
.oem-page {
  min-height: 70vh;
  overflow: clip;
  background: var(--bg);
  color: var(--fg);
}

.oem-page h1,
.oem-page h2,
.oem-page h3,
.oem-page p { margin-top: 0; }

.oem-breadcrumb {
  display: flex;
  min-height: 62px;
  align-items: center;
  gap: 8px;
  color: var(--muted);
  font-size: 12px;
}

.oem-breadcrumb a { display: inline-flex; min-height: 44px; align-items: center; }
.oem-breadcrumb a:hover,
.oem-breadcrumb [aria-current="page"] { color: var(--fg); }

.oem-eyebrow {
  margin-bottom: 18px;
  color: var(--accent);
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.oem-hero { padding: 0 0 clamp(90px, 10vw, 150px); }

.oem-hero-grid {
  display: grid;
  grid-template-columns: minmax(0, .88fr) minmax(460px, 1.12fr);
  align-items: center;
  gap: clamp(48px, 7vw, 112px);
  padding-top: clamp(30px, 4vw, 66px);
}

.oem-hero-copy h1 {
  max-width: 10ch;
  margin-bottom: 28px;
  font-size: clamp(52px, 6.2vw, 92px);
  font-weight: 650;
  line-height: .94;
  letter-spacing: -.055em;
}

.oem-hero-lead {
  max-width: 58ch;
  margin-bottom: 30px;
  color: var(--muted);
  font-size: clamp(16px, 1.4vw, 19px);
  line-height: 1.75;
}

.oem-hero-actions { display: flex; flex-wrap: wrap; gap: 12px; }

.oem-hero-facts {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin: 44px 0 0;
  border-top: 1px solid var(--border);
}

.oem-hero-facts div { padding: 20px 18px 0 0; }
.oem-hero-facts div + div { padding-left: 22px; border-left: 1px solid var(--border); }
.oem-hero-facts dt { color: var(--muted); font-family: var(--font-mono); font-size: 10px; letter-spacing: .06em; text-transform: uppercase; }
.oem-hero-facts dd { margin: 9px 0 0; font-size: 13px; font-weight: 650; line-height: 1.5; }

.oem-hero-media {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-content: start;
  gap: clamp(28px, 4vw, 48px);
  min-height: 0;
}

.oem-hero-media figure { margin: 0; overflow: visible; background: transparent; }
.oem-hero-primary { position: static; width: 100%; }
.oem-hero-secondary {
  position: static;
  width: min(68%, 420px);
  min-width: 0;
  justify-self: end;
}

.oem-hero-primary img,
.oem-hero-secondary img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 4 / 3;
  -o-object-fit: contain;
     object-fit: contain;
  background: var(--surface);
}
.oem-hero-media figcaption {
  position: static;
  display: grid;
  gap: 6px;
  padding: 14px 0 0;
  background: transparent;
  box-shadow: none;
  -webkit-backdrop-filter: none;
          backdrop-filter: none;
}

.oem-hero-media figcaption span { color: var(--muted); font-family: var(--font-mono); font-size: 9px; letter-spacing: .08em; }
.oem-hero-media figcaption strong { font-size: 13px; line-height: 1.45; }
.oem-hero-secondary figcaption { position: static; box-shadow: none; -webkit-backdrop-filter: none; backdrop-filter: none; }

.oem-scope {
  padding-block: clamp(86px, 9vw, 140px);
  border-top: 1px solid var(--border);
  background: var(--surface);
}

.oem-section-head {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(280px, .9fr);
  align-items: end;
  gap: 40px;
  margin-bottom: clamp(42px, 6vw, 72px);
}

.oem-section-head h2,
.oem-process-intro h2,
.oem-builder-copy h2,
.oem-delivery-copy h2,
.oem-faq-grid h2,
.oem-cta h2 {
  margin-bottom: 0;
  font-size: clamp(38px, 5vw, 72px);
  font-weight: 650;
  line-height: .98;
  letter-spacing: -.045em;
}

.oem-section-head > p { max-width: 58ch; margin-bottom: 3px; color: var(--muted); font-size: 14px; line-height: 1.7; }

.oem-scope-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 1px solid var(--border); border-left: 1px solid var(--border); }
.oem-scope-card { min-height: 270px; padding: 28px; border-right: 1px solid var(--border); border-bottom: 1px solid var(--border); background: var(--bg); transition: transform .25s ease, background .25s ease; }
.oem-scope-card:hover { position: relative; z-index: 1; transform: translateY(-4px); background: color-mix(in oklch, var(--bg) 88%, var(--surface)); }
.oem-scope-card > span { display: block; margin-bottom: 54px; color: var(--accent); font-family: var(--font-mono); font-size: 11px; }
.oem-scope-card h3 { margin-bottom: 14px; font-size: 22px; letter-spacing: -.025em; }
.oem-scope-card p { margin-bottom: 0; color: var(--muted); font-size: 13px; line-height: 1.7; }

.oem-process { padding-block: clamp(90px, 10vw, 150px); }
.oem-process-grid { display: grid; grid-template-columns: minmax(0, .78fr) minmax(440px, 1.22fr); gap: clamp(50px, 8vw, 130px); }
.oem-process-intro { align-self: start; position: sticky; top: 130px; }
.oem-process-intro h2 { max-width: 9ch; margin-bottom: 26px; }
.oem-process-intro > p:not(.oem-eyebrow) { max-width: 48ch; margin-bottom: 30px; color: var(--muted); font-size: 14px; line-height: 1.75; }
.oem-process-list { margin: 0; padding: 0; border-top: 1px solid var(--border); }
.oem-process-list li { display: grid; grid-template-columns: 56px minmax(0, 1fr); gap: 24px; padding: 30px 0; border-bottom: 1px solid var(--border); list-style: none; }
.oem-process-list > li > span { color: var(--accent); font-family: var(--font-mono); font-size: 11px; }
.oem-process-list h3 { margin-bottom: 10px; font-size: 21px; }
.oem-process-list p { max-width: 56ch; margin-bottom: 0; color: var(--muted); font-size: 13px; line-height: 1.7; }

.oem-builder { padding-block: clamp(82px, 9vw, 132px); background: var(--fg); color: var(--bg); }
.oem-builder-shell { display: grid; grid-template-columns: minmax(0, .86fr) minmax(430px, 1.14fr); align-items: start; gap: clamp(50px, 8vw, 120px); }
.oem-builder-copy h2 { max-width: 9ch; margin-bottom: 24px; }
.oem-builder-copy > p:not(.oem-eyebrow) { max-width: 48ch; margin-bottom: 0; color: color-mix(in oklch, var(--bg) 68%, transparent); font-size: 14px; line-height: 1.7; }
.oem-option-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px; background: color-mix(in oklch, var(--bg) 20%, transparent); border: 1px solid color-mix(in oklch, var(--bg) 20%, transparent); }
.oem-option-grid button { min-height: 82px; padding: 18px 20px; border: 0; background: var(--fg); color: color-mix(in oklch, var(--bg) 68%, transparent); font: inherit; font-size: 13px; font-weight: 650; text-align: left; cursor: pointer; transition: background .2s ease, color .2s ease; }
.oem-option-grid button:hover { color: var(--bg); }
.oem-option-grid button.is-selected { background: var(--bg); color: var(--fg); }
.oem-option-grid button:focus-visible { position: relative; z-index: 1; outline: 2px solid var(--accent); outline-offset: -4px; }
.oem-option-grid button[data-custom-option="custom"] { grid-column: 1 / -1; }
.oem-custom-requirement { margin-top: 16px; }
.oem-custom-requirement[hidden] { display: none; }
.oem-custom-requirement label { display: block; margin-bottom: 10px; color: var(--bg); font-size: 12px; font-weight: 650; }
.oem-custom-requirement textarea { display: block; width: 100%; min-height: 116px; resize: vertical; padding: 16px 18px; border: 1px solid color-mix(in oklch, var(--bg) 28%, transparent); border-radius: 0; background: color-mix(in oklch, var(--bg) 7%, var(--fg)); color: var(--bg); font: inherit; font-size: 14px; line-height: 1.65; }
.oem-custom-requirement textarea::-moz-placeholder { color: color-mix(in oklch, var(--bg) 48%, transparent); }
.oem-custom-requirement textarea::placeholder { color: color-mix(in oklch, var(--bg) 48%, transparent); }
.oem-custom-requirement textarea:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.oem-custom-requirement textarea[aria-invalid="true"] { border-color: var(--accent); }
.oem-custom-error { display: block; margin-top: 8px; color: var(--accent); font-size: 12px; }
.oem-custom-error[hidden] { display: none; }
.oem-builder-summary { min-height: 100px; margin: 28px 0; padding: 20px 0; border-top: 1px solid color-mix(in oklch, var(--bg) 22%, transparent); border-bottom: 1px solid color-mix(in oklch, var(--bg) 22%, transparent); }
.oem-builder-summary > span { display: block; margin-bottom: 14px; color: color-mix(in oklch, var(--bg) 55%, transparent); font-family: var(--font-mono); font-size: 10px; letter-spacing: .08em; text-transform: uppercase; }
.oem-builder-summary > div { display: flex; flex-wrap: wrap; gap: 8px; }
.oem-selected-chip { display: inline-flex; min-height: 34px; align-items: center; padding: 7px 10px; border: 1px solid color-mix(in oklch, var(--bg) 28%, transparent); color: var(--bg); font-size: 12px; }

.oem-delivery { padding-block: clamp(90px, 10vw, 150px); background: var(--surface); }
.oem-delivery-grid { display: grid; grid-template-columns: minmax(420px, 1.08fr) minmax(0, .92fr); align-items: center; gap: clamp(54px, 8vw, 124px); }
.oem-delivery-media { margin: 0; overflow: hidden; background: var(--bg); }
.oem-delivery-media img { display: block; width: 100%; aspect-ratio: 5 / 4; -o-object-fit: cover; object-fit: cover; }
.oem-delivery-copy h2 { max-width: 10ch; margin-bottom: 26px; }
.oem-delivery-copy > p:not(.oem-eyebrow) { max-width: 56ch; margin-bottom: 30px; color: var(--muted); font-size: 14px; line-height: 1.75; }
.oem-delivery-copy ul { margin: 0; padding: 0; border-top: 1px solid var(--border); }
.oem-delivery-copy li { display: grid; grid-template-columns: 42px minmax(0, 1fr); gap: 18px; padding: 20px 0; border-bottom: 1px solid var(--border); list-style: none; }
.oem-delivery-copy li > span { color: var(--accent); font-family: var(--font-mono); font-size: 10px; }
.oem-delivery-copy strong { display: block; margin-bottom: 7px; font-size: 14px; }
.oem-delivery-copy li p { margin-bottom: 0; color: var(--muted); font-size: 12px; line-height: 1.6; }

.oem-faq { padding-block: clamp(90px, 10vw, 150px); }
.oem-faq-grid { display: grid; grid-template-columns: minmax(0, .7fr) minmax(440px, 1.3fr); gap: clamp(50px, 8vw, 130px); }
.oem-faq-grid h2 { max-width: 8ch; }
.oem-faq-list { border-top: 1px solid var(--border); }
.oem-faq-list details { border-bottom: 1px solid var(--border); }
.oem-faq-list summary { min-height: 68px; padding: 22px 42px 22px 0; font-size: 16px; font-weight: 650; cursor: pointer; }
.oem-faq-list summary::marker { color: var(--accent); }
.oem-faq-list details p { max-width: 64ch; margin: -6px 0 24px; color: var(--muted); font-size: 13px; line-height: 1.7; }

.oem-cta { padding-block: clamp(80px, 9vw, 130px); background: var(--fg); color: var(--bg); }
.oem-cta-grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(300px, .85fr); align-items: end; gap: clamp(46px, 8vw, 120px); }
.oem-cta h2 { max-width: 13ch; }
.oem-cta-grid > div:last-child p { max-width: 48ch; margin-bottom: 28px; color: color-mix(in oklch, var(--bg) 68%, transparent); font-size: 14px; line-height: 1.7; }

@media (max-width: 1080px) {
  .oem-hero-grid { grid-template-columns: minmax(0, .9fr) minmax(380px, 1.1fr); gap: 48px; }
  .oem-scope-card { min-height: 250px; }
  .oem-delivery-grid { grid-template-columns: minmax(360px, 1fr) 1fr; gap: 48px; }
}

@media (max-width: 900px) {
  .oem-hero-grid,
  .oem-process-grid,
  .oem-builder-shell,
  .oem-delivery-grid,
  .oem-faq-grid,
  .oem-cta-grid { grid-template-columns: 1fr; }
  .oem-hero-copy h1 { max-width: 12ch; }
  .oem-hero-media { min-height: 0; }
  .oem-section-head { grid-template-columns: 1fr; align-items: start; }
  .oem-scope-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .oem-process-intro { position: static; }
  .oem-process-intro h2,
  .oem-builder-copy h2,
  .oem-delivery-copy h2 { max-width: 12ch; }
  .oem-builder-shell { gap: 50px; }
  .oem-delivery-media { order: 2; }
  .oem-faq-grid { gap: 44px; }
}

@media (max-width: 620px) {
  .oem-breadcrumb { min-height: 54px; }
  .oem-hero { padding-bottom: 78px; }
  .oem-hero-grid { padding-top: 20px; }
  .oem-hero-copy h1 { font-size: clamp(44px, 14vw, 64px); }
  .oem-hero-facts { grid-template-columns: 1fr; }
  .oem-hero-facts div + div { margin-top: 16px; padding-left: 0; border-left: 0; }
  .oem-hero-media { min-height: 0; gap: 28px; }
  .oem-hero-secondary { width: 100%; min-width: 0; }
  .oem-hero-primary figcaption { padding-top: 12px; }
  .oem-scope-grid { grid-template-columns: 1fr; }
  .oem-scope-card { min-height: 220px; padding: 24px; }
  .oem-scope-card > span { margin-bottom: 42px; }
  .oem-process-list li { grid-template-columns: 40px minmax(0, 1fr); gap: 14px; }
  .oem-option-grid { grid-template-columns: 1fr; }
  .oem-option-grid button { min-height: 64px; }
  .oem-delivery-media img { aspect-ratio: 4 / 3; }
  .oem-cta-grid { align-items: start; }
}

@media (prefers-reduced-motion: reduce) {
  .oem-scope-card,
  .oem-option-grid button { transition: none; }
}

/* OpenDesign source: jisultra-venue-solutions.css */
.venue-page {
  min-height: 70vh;
  overflow: clip;
  background: var(--bg);
  color: var(--fg);
}

.venue-page h1,
.venue-page h2,
.venue-page h3,
.venue-page p { margin-top: 0; }

.venue-breadcrumb {
  display: flex;
  min-height: 62px;
  align-items: center;
  gap: 8px;
  color: color-mix(in oklch, var(--bg) 72%, transparent);
  font-size: 12px;
}

.venue-breadcrumb a {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
}

.venue-breadcrumb a:hover { color: var(--bg); }
.venue-breadcrumb [aria-current="page"] { color: var(--bg); }

.venue-eyebrow {
  margin-bottom: 18px;
  color: var(--accent);
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.venue-hero {
  position: relative;
  isolation: isolate;
  min-height: clamp(680px, 88svh, 940px);
  overflow: hidden;
  padding: 0 0 clamp(84px, 10vw, 144px);
  background: var(--fg);
  color: var(--bg);
}

.venue-hero-video,
.venue-hero-overlay {
  position: absolute;
  inset: 0;
}

.venue-hero-video {
  z-index: -2;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
}

.venue-hero-overlay {
  z-index: -1;
  background:
    linear-gradient(90deg, color-mix(in oklch, var(--fg) 88%, transparent) 0%, color-mix(in oklch, var(--fg) 72%, transparent) 46%, color-mix(in oklch, var(--fg) 28%, transparent) 78%, color-mix(in oklch, var(--fg) 42%, transparent) 100%),
    linear-gradient(0deg, color-mix(in oklch, var(--fg) 54%, transparent), transparent 58%);
  pointer-events: none;
}

.venue-hero-grid {
  display: grid;
  grid-template-columns: minmax(0, 760px);
  align-items: center;
  min-height: clamp(590px, 76svh, 800px);
  padding-top: clamp(30px, 5vw, 74px);
}

.venue-hero-copy h1 {
  max-width: 11ch;
  margin-bottom: 26px;
  font-size: clamp(52px, 6.2vw, 92px);
  font-weight: 650;
  line-height: .94;
  letter-spacing: -.055em;
}

.venue-hero-lead {
  max-width: 58ch;
  margin-bottom: 30px;
  color: color-mix(in oklch, var(--bg) 78%, transparent);
  font-size: clamp(16px, 1.5vw, 19px);
  line-height: 1.75;
}

.venue-hero-actions,
.venue-cta-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.venue-hero-facts {
  display: grid;
  grid-template-columns: minmax(180px, .82fr) minmax(280px, 1.18fr);
  width: min(640px, 100%);
  margin: 38px 0 0;
  border-top: 1px solid color-mix(in oklch, var(--bg) 34%, transparent);
}

.venue-hero-facts div { padding: 20px 18px 0 0; }
.venue-hero-facts div + div { padding-left: 22px; border-left: 1px solid color-mix(in oklch, var(--bg) 34%, transparent); }
.venue-hero-facts dt { color: color-mix(in oklch, var(--bg) 62%, transparent); font-family: var(--font-mono); font-size: 10px; letter-spacing: .06em; text-transform: uppercase; }
.venue-hero-facts dd { margin: 9px 0 0; font-size: 13px; font-weight: 650; line-height: 1.5; }

.scenario-planner {
  padding-block: clamp(82px, 9vw, 132px);
  border-top: 1px solid var(--border);
  background: var(--surface);
}

.venue-section-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(320px, .75fr);
  align-items: end;
  gap: clamp(30px, 6vw, 94px);
}

.venue-section-head h2,
.venue-framework-intro h2,
.venue-cta h2 {
  max-width: 13ch;
  margin-bottom: 0;
  font-size: clamp(38px, 4.8vw, 70px);
  line-height: .98;
  letter-spacing: -.045em;
}

.venue-section-head > p,
.venue-framework-intro > p:last-child {
  max-width: 54ch;
  margin-bottom: 4px;
  color: var(--muted);
  font-size: 15px;
  line-height: 1.75;
}

.scenario-tabs {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-top: clamp(44px, 6vw, 72px);
  border: 1px solid var(--border);
}

.scenario-tabs button {
  min-height: 62px;
  padding: 12px 18px;
  border: 0;
  border-right: 1px solid var(--border);
  background: var(--bg);
  color: var(--muted);
  font: inherit;
  font-size: 13px;
  cursor: pointer;
  transition: background-color .2s ease, color .2s ease, transform .2s ease;
}

.scenario-tabs button:last-child { border-right: 0; }
.scenario-tabs button:hover { color: var(--fg); }
.scenario-tabs button[aria-selected="true"] { background: var(--fg); color: var(--bg); }
.scenario-tabs button:active { transform: scale(.985); }
.scenario-tabs button:focus-visible { position: relative; z-index: 1; outline: 2px solid var(--accent); outline-offset: 3px; }

.scenario-panel { margin-top: 24px; }

.scenario-overview {
  display: grid;
  grid-template-columns: minmax(350px, .9fr) minmax(0, 1.1fr);
  min-height: 540px;
  border: 1px solid var(--border);
  background: var(--bg);
}

.scenario-visual { position: relative; min-height: 500px; overflow: hidden; background: var(--surface); }
.scenario-visual img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; transition: transform .55s cubic-bezier(.2, .75, .25, 1); }
.scenario-overview:hover .scenario-visual img { transform: scale(1.025); }
.scenario-number { position: absolute; top: 20px; left: 20px; padding: 9px 11px; background: var(--bg); color: var(--fg); font-family: var(--font-mono); font-size: 10px; letter-spacing: .08em; }

.scenario-copy { display: flex; flex-direction: column; justify-content: space-between; padding: clamp(28px, 4vw, 58px); }
.scenario-copy h3 { max-width: 13ch; margin-bottom: 18px; font-size: clamp(34px, 4vw, 58px); line-height: 1; letter-spacing: -.04em; }
.scenario-summary { max-width: 58ch; margin-bottom: 30px; color: var(--muted); font-size: 15px; line-height: 1.75; }

.scenario-tags { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 34px; }
.scenario-tag { display: inline-flex; min-height: 32px; align-items: center; padding: 5px 10px; border: 1px solid var(--border); font-family: var(--font-mono); font-size: 10px; }

.scenario-layout { display: grid; gap: 1px; margin: 0; background: var(--border); border: 1px solid var(--border); }
.scenario-layout li { display: grid; grid-template-columns: 42px minmax(0, 1fr); gap: 14px; padding: 17px 18px; background: var(--bg); list-style: none; }
.scenario-layout span { color: var(--accent); font-family: var(--font-mono); font-size: 11px; }
.scenario-layout strong { display: block; margin-bottom: 5px; font-size: 13px; }
.scenario-layout p { margin-bottom: 0; color: var(--muted); font-size: 13px; line-height: 1.6; }

.scenario-products { margin-top: clamp(42px, 6vw, 72px); }
.scenario-products-head { display: flex; align-items: end; justify-content: space-between; gap: 24px; margin-bottom: 20px; }
.scenario-products-head h3 { margin-bottom: 0; font-size: clamp(28px, 3vw, 42px); letter-spacing: -.03em; }
.scenario-products-head p { max-width: 52ch; margin-bottom: 4px; color: var(--muted); font-size: 13px; line-height: 1.6; }
.scenario-product-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.scenario-product-card { display: flex; min-width: 0; flex-direction: column; border: 1px solid var(--border); background: var(--bg); transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease; }
.scenario-product-card:hover { transform: translateY(-4px); border-color: color-mix(in oklch, var(--fg) 28%, var(--border)); box-shadow: 0 18px 44px color-mix(in oklch, var(--fg) 10%, transparent); }
.scenario-product-card:focus-visible { outline: 2px solid var(--fg); outline-offset: 3px; }
.scenario-product-media { position: relative; display: grid; aspect-ratio: 4 / 3; place-items: center; overflow: hidden; background: var(--surface); }
.scenario-product-media img { position: absolute; inset: 10%; display: block; width: 80%; height: 80%; -o-object-fit: contain; object-fit: contain; -o-object-position: center; object-position: center; transition: transform .3s ease; }
.scenario-product-card:hover .scenario-product-media img { transform: scale(1.035); }
.scenario-product-body { display: grid; gap: 10px; padding: 20px; }
.scenario-product-body span { color: var(--muted); font-family: var(--font-mono); font-size: 10px; letter-spacing: .06em; text-transform: uppercase; }
.scenario-product-body strong { font-size: 18px; line-height: 1.25; }
.scenario-product-body p { margin-bottom: 0; color: var(--muted); font-size: 13px; line-height: 1.6; }
.scenario-product-action { display: flex; min-height: 44px; align-items: center; justify-content: space-between; margin-top: 4px; border-top: 1px solid var(--border); font-size: 12px; font-weight: 700; }
.scenario-product-action i { font-style: normal; transition: transform .2s ease; }
.scenario-product-card:hover .scenario-product-action i { transform: translateX(4px); }

.scenario-notes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: 18px; border: 1px solid var(--border); background: var(--border); gap: 1px; }
.scenario-note { padding: 20px; background: var(--bg); }
.scenario-note span { color: var(--muted); font-family: var(--font-mono); font-size: 10px; letter-spacing: .06em; text-transform: uppercase; }
.scenario-note p { margin: 9px 0 0; font-size: 13px; line-height: 1.65; }

.scenario-panel-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 24px; }

.scenario-advice { margin-top: 18px; padding: clamp(26px, 4vw, 46px); border: 1px solid var(--border); background: var(--surface); }
.scenario-advice[hidden] { display: none; }
.scenario-advice:focus { outline: none; }
.scenario-advice:focus-visible { outline: 2px solid var(--accent); outline-offset: 4px; }
.scenario-advice-eyebrow { margin: 0 0 12px; color: var(--accent); font-family: var(--font-mono); font-size: 10px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.scenario-advice > h3 { max-width: 25ch; margin: 0 0 28px; font-size: clamp(28px, 3.2vw, 46px); line-height: 1.08; letter-spacing: -.035em; }
.scenario-advice-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border: 1px solid var(--border); background: var(--border); gap: 1px; }
.scenario-advice-grid > div { padding: 22px; background: var(--bg); }
.scenario-advice-grid span { color: var(--accent); font-family: var(--font-mono); font-size: 10px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.scenario-advice-grid p { margin: 12px 0 0; color: var(--muted); font-size: 13px; line-height: 1.65; }
.scenario-advice-next { margin: 22px 0 0; padding-top: 18px; border-top: 1px solid var(--border); color: var(--muted); font-size: 13px; line-height: 1.65; }

.venue-framework { padding-block: clamp(84px, 10vw, 144px); }
.venue-framework-grid { display: grid; grid-template-columns: minmax(0, .72fr) minmax(420px, 1.28fr); gap: clamp(48px, 8vw, 128px); }
.venue-framework-intro { position: sticky; top: 110px; align-self: start; }
.venue-framework-intro h2 { margin-bottom: 24px; }
.venue-framework-list { margin: 0; padding: 0; border-top: 1px solid var(--fg); }
.venue-framework-list li { display: grid; grid-template-columns: 52px minmax(0, 1fr); gap: 24px; padding: 28px 0; border-bottom: 1px solid var(--border); list-style: none; }
.venue-framework-list > li > span { color: var(--accent); font-family: var(--font-mono); font-size: 12px; }
.venue-framework-list h3 { margin-bottom: 9px; font-size: 21px; }
.venue-framework-list p { max-width: 58ch; margin-bottom: 0; color: var(--muted); font-size: 14px; line-height: 1.7; }

.venue-cta { padding-block: clamp(76px, 9vw, 124px); border-top: 1px solid var(--border); background: var(--fg); color: var(--bg); }
.venue-cta .venue-eyebrow { color: var(--accent); }
.venue-cta-inner { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: 44px; }
.venue-cta h2 { max-width: 15ch; }
.venue-cta .btn-outline { border-color: color-mix(in oklch, var(--bg) 42%, transparent); color: var(--bg); }
.venue-cta .btn-outline:hover { border-color: var(--bg); background: var(--bg); color: var(--fg); }

@media (max-width: 1040px) {
  .venue-hero-grid,
  .scenario-overview,
  .venue-framework-grid { grid-template-columns: 1fr; }
  .venue-hero-copy { max-width: 760px; }
  .scenario-visual { min-height: min(72vw, 560px); }
  .venue-framework-intro { position: static; }
}

@media (max-width: 820px) {
  .venue-section-head,
  .venue-cta-inner { grid-template-columns: 1fr; align-items: start; }
  .scenario-tabs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .scenario-tabs button:nth-child(2) { border-right: 0; }
  .scenario-tabs button:nth-child(-n+2) { border-bottom: 1px solid var(--border); }
  .scenario-product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .scenario-notes,
  .scenario-advice-grid { grid-template-columns: 1fr; }
  .scenario-products-head { display: grid; align-items: start; }
}

@media (max-width: 560px) {
  .venue-hero { min-height: 720px; padding-bottom: 72px; }
  .venue-hero-grid { min-height: 640px; padding-top: 18px; }
  .venue-hero-copy h1 { max-width: 12ch; font-size: clamp(44px, 14vw, 64px); }
  .venue-hero-actions .btn,
  .venue-cta-actions .btn,
  .scenario-panel-actions .btn { width: 100%; }
  .venue-hero-facts { grid-template-columns: 1fr; }
  .venue-hero-facts div + div { padding-left: 0; border-top: 1px solid color-mix(in oklch, var(--bg) 34%, transparent); border-left: 0; }
  .venue-hero-video { -o-object-position: 58% center; object-position: 58% center; }
  .venue-hero-overlay {
    background: linear-gradient(90deg, color-mix(in oklch, var(--fg) 90%, transparent), color-mix(in oklch, var(--fg) 64%, transparent));
  }
  .scenario-planner { padding-block: 70px; }
  .scenario-tabs { grid-template-columns: 1fr; }
  .scenario-tabs button { border-right: 0; border-bottom: 1px solid var(--border); }
  .scenario-tabs button:last-child { border-bottom: 0; }
  .scenario-product-grid { grid-template-columns: 1fr; }
  .scenario-overview { min-height: 0; }
  .scenario-visual { min-height: 112vw; }
  .scenario-copy { padding: 26px 20px; }
  .scenario-layout li { grid-template-columns: 34px minmax(0, 1fr); padding-inline: 14px; }
  .venue-framework { padding-block: 76px; }
  .venue-framework-list li { grid-template-columns: 40px minmax(0, 1fr); gap: 14px; }
  .venue-cta { padding-block: 72px; }
}

@media (prefers-reduced-motion: reduce) {
  .scenario-tabs button,
  .scenario-visual img,
  .scenario-product-card,
  .scenario-product-media img,
  .scenario-product-action i { transition: none; }

  .venue-page .btn:hover,
  .venue-page .btn:active,
  .scenario-tabs button:active,
  .scenario-overview:hover .scenario-visual img,
  .scenario-product-card:hover,
  .scenario-product-card:hover .scenario-product-media img,
  .scenario-product-card:hover .scenario-product-action i {
    transform: none;
  }
}

/* Shoplazza Theme Editor overrides. */
.jis-core-section { background-color: var(--jis-section-bg, transparent); padding-top: var(--jis-space-top, 80px); padding-bottom: var(--jis-space-bottom, 80px); }
.jis-core-section > .container { width: min(calc(100% - (var(--gutter, 32px) * 2)), var(--jis-section-content-width, var(--container, 1180px))); max-width: none; }
.jis-core-section[data-desktop-layout="stack"] > .container[class] { grid-template-columns: 1fr; }
.about-priority-grid, .about-services-grid, .about-principles-grid, .oem-scope-grid, .oem-option-grid { grid-template-columns: repeat(var(--jis-columns, 3), minmax(0, 1fr)); }
@media (max-width: 767px) {
  .jis-core-section { padding-top: var(--jis-space-top-mobile, 56px); padding-bottom: var(--jis-space-bottom-mobile, 56px); }
  .jis-core-section > .container { width: min(calc(100% - 36px), var(--jis-section-content-width, var(--container, 1180px))); }
  .jis-core-section[data-mobile-layout="media-first"] figure { order: -1; }
  .jis-core-section[data-mobile-layout="content-first"] figure { order: 2; }
  .jis-core-section[data-mobile-layout="scroll"] [data-block-grid] { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; }
  .jis-core-section[data-mobile-layout="scroll"] [data-block-grid] > * { flex: 0 0 min(84vw, 360px); scroll-snap-align: start; }
  .about-priority-grid, .about-services-grid, .about-principles-grid, .oem-scope-grid, .oem-option-grid { grid-template-columns: repeat(var(--jis-columns-mobile, 1), minmax(0, 1fr)); }
}

/* Theme interaction enhancements layered after the audited OpenDesign sources. */
.oem-builder { background: var(--jis-section-bg, var(--fg)); }
.oem-builder-copy h2 { font-size: clamp(42px, 6.2vw, 92px); line-height: .88; overflow-wrap: normal; word-break: normal; }
.oem-option-grid button.is-selected { background: var(--bg); color: var(--fg); }
.oem-option-grid button:focus-visible { position: relative; z-index: 1; outline: 2px solid var(--accent); outline-offset: -4px; }
.oem-option-grid button[data-custom-option="custom"] { grid-column: 1 / -1; }
.oem-custom-requirement { margin-top: 16px; }
.oem-custom-requirement[hidden] { display: none; }
.oem-custom-requirement label { display: block; margin-bottom: 10px; color: var(--bg); font-size: 12px; font-weight: 650; }
.oem-custom-requirement textarea { display: block; width: 100%; min-height: 116px; resize: vertical; padding: 16px 18px; border: 1px solid color-mix(in oklch, var(--bg) 28%, transparent); background: color-mix(in oklch, var(--bg) 7%, var(--fg)); color: var(--bg); font: inherit; line-height: 1.65; }
.oem-custom-requirement textarea::-moz-placeholder { color: color-mix(in oklch, var(--bg) 48%, transparent); }
.oem-custom-requirement textarea::placeholder { color: color-mix(in oklch, var(--bg) 48%, transparent); }
.oem-builder-summary { min-height: 100px; margin: 28px 0; padding: 20px 0; border-block: 1px solid color-mix(in oklch, var(--bg) 22%, transparent); }
.oem-builder-summary > span { display: block; margin-bottom: 14px; color: color-mix(in oklch, var(--bg) 55%, transparent); font-family: var(--font-mono); font-size: 10px; letter-spacing: .08em; text-transform: uppercase; }
.oem-builder-summary [data-jis-oem-summary] { color: var(--bg); font-size: 13px; line-height: 1.6; }