/* Product presentation is isolated from the shared header, inquiry and footer. */
.imgview-experience-page { background: #f5f6f8; --max-width: 1280px; }
#ivx { --ivx-lime: #d2f86b; --ivx-ink: #10120f; --ivx-paper: #f2f3ec; --ivx-muted: #969c90; --ivx-header: 86px; background: var(--ivx-ink); color: var(--ivx-paper); font-family: 'Pretendard Variable', Pretendard, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; line-height: 1.6; -webkit-font-smoothing: antialiased; overflow: clip; }
:where(#ivx) * { box-sizing: border-box; }
:where(#ivx) h1, :where(#ivx) h2, :where(#ivx) h3, :where(#ivx) p, :where(#ivx) figure { margin: 0; }
:where(#ivx) h1, :where(#ivx) h2, :where(#ivx) h3 { font-weight: 650; line-height: 1.15; letter-spacing: -.055em; text-wrap: balance; }
:where(#ivx) p, :where(#ivx) h1, :where(#ivx) h2, :where(#ivx) h3, :where(#ivx) summary { word-break: keep-all; overflow-wrap: anywhere; }
:where(#ivx) p { text-wrap: pretty; }
:where(#ivx) a { color: inherit; text-decoration: none; }
:where(#ivx) a:hover { color: inherit; }
:where(#ivx) button { color: inherit; font: inherit; cursor: pointer; }
:where(#ivx) button:focus-visible, :where(#ivx) a:focus-visible, :where(#ivx) summary:focus-visible, #ivx .ivx-viewer:focus-visible { outline: 3px solid #79ae2c; outline-offset: 6px; }
:where(#ivx) img { display: block; width: 100%; object-fit: cover; }
:where(#ivx) em { font-style: normal; }
:where(#ivx) button { -webkit-tap-highlight-color: transparent; }
:where(#ivx) [hidden] { display: none !important; }
:where(#ivx) section[id], #contact { scroll-margin-top: 110px; }
#ivx .ivx-shell { width: min(100% - 96px, 1280px); margin-inline: auto; }
#ivx .ivx-eyebrow { font-size: 14px; font-weight: 650; letter-spacing: .14em; display: flex; align-items: center; gap: 10px; }
#ivx .ivx-dot { width: 7px; height: 7px; border-radius: 50%; display: inline-block; background: var(--ivx-lime); flex: none; }
#ivx .ivx-muted { color: var(--ivx-muted); }
#ivx .ivx-small { font-size: 14px; }
#ivx .ivx-sr, #ivx .ivx-skip:not(:focus) { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; clip-path: inset(50%); overflow: hidden; white-space: nowrap; }
#ivx .ivx-skip:focus { position: fixed; z-index: 100; top: 100px; left: 20px; padding: 15px; color: #10120f; background: var(--ivx-lime); }
#ivx .ivx-button { display: inline-flex; align-items: center; justify-content: space-between; gap: 36px; padding: 16px 24px; min-height: 56px; font-size: 15px; font-weight: 650; border-radius: 4px; transition: background .2s, transform .2s; }
#ivx .ivx-button:hover { transform: translateY(-3px); }
#ivx .ivx-button--lime { background: var(--ivx-lime); color: var(--ivx-ink); }
#ivx .ivx-button--lime:hover { background: #e5ff9c; }
#ivx .ivx-button--dark { background: var(--ivx-ink); color: #fff; }
#ivx .ivx-button--dark:hover { background: #343a28; }
#ivx .ivx-button > span { font-size: 22px; font-weight: 400; line-height: 1; }
#ivx .ivx-hero { position: relative; min-height: 810px; }
#ivx .ivx-hero-stage { position: relative; height: 810px; max-height: 1100px; overflow: hidden; isolation: isolate; }
#ivx .ivx-hero-top { display: flex; align-items: center; justify-content: space-between; padding-top: 27px; }
#ivx .ivx-product { display: inline-flex; align-items: center; gap: 10px; font-size: 24px; letter-spacing: -.06em; font-weight: 650; line-height: 1; }
#ivx .ivx-icon { display: inline-flex; align-items: center; justify-content: center; width: 27px; height: 27px; background: var(--ivx-lime); color: #111; font-size: 23px; border-radius: 5px; font-weight: 500; }
#ivx .ivx-version { color: #9ca294; font-size: 14px; font-weight: 400; letter-spacing: .015em; margin-left: 2px; align-self: flex-end; padding-bottom: 3px; }
#ivx .ivx-product-nav { display: flex; align-items: center; gap: 27px; font-size: 14px; }
#ivx .ivx-product-nav a:last-child { color: var(--ivx-lime); }
#ivx .ivx-product-nav a:hover { text-decoration: underline; text-underline-offset: 6px; }
#ivx .ivx-hero-copy { display: grid; grid-template-columns: 1.6fr 1fr; gap: 40px; align-items: end; padding-top: clamp(40px, 5.8vh, 80px); }
#ivx .ivx-hero-copy .ivx-eyebrow { color: #b5bcaa; margin-bottom: 22px; font-size: 14px; }
#ivx .ivx-hero-copy h1 { font-size: clamp(48px, 5.6vw, 84px); line-height: 1.16; letter-spacing: -.075em; font-weight: 600; }
#ivx .ivx-hero-copy h1 em { color: var(--ivx-lime); }
#ivx .ivx-hero-side { justify-self: end; padding-bottom: 1px; }
#ivx .ivx-hero-side > p { font-size: 15px; line-height: 1.75; color: #b8bdaf; margin-bottom: 23px; }
#ivx .ivx-hero-side .ivx-button { padding: 14px 21px; min-height: 51px; gap: 56px; }
#ivx .ivx-micro { display: block; color: #969d8b; font-size: 14px; margin-top: 10px; }
#ivx .ivx-hero-window { position: absolute; top: 46%; left: 24%; width: 52%; height: 46%; border: 1px solid #4c5446; border-radius: 9px; background: #1c2119; box-shadow: 0 25px 80px #0007; overflow: hidden; z-index: 2; display: flex; flex-direction: column; }
#ivx .ivx-window-bar, #ivx .ivx-window-bottom { display: flex; align-items: center; justify-content: space-between; padding: 0 15px; height: 31px; flex: 0 0 31px; font-size: 14px; color: #c2c8b9; letter-spacing: .02em; }
#ivx .ivx-window-bar > span:first-child { display: flex; align-items: center; gap: 8px; }
#ivx .ivx-window-bar i:not(.ivx-status-dot) { font-style: normal; padding-left: 22px; }
#ivx .ivx-status-dot { width: 5px; height: 5px; background: var(--ivx-lime); border-radius: 50%; }
#ivx .ivx-window-bottom { height: 24px; flex-basis: 24px; font-size: 14px; }
#ivx .ivx-hero-photo { position: relative; flex: 1; overflow: hidden; min-height: 0; }
#ivx .ivx-hero-photo > img { height: 100%; }
#ivx .ivx-immersive { display: none; position: absolute; inset: 0; padding: 5%; color: #fff; flex-direction: column; justify-content: center; background: linear-gradient(90deg, #04130c80, transparent 85%); }
#ivx .ivx-immersive .ivx-eyebrow { font-size: 14px; margin-bottom: 20px; }
#ivx .ivx-immersive h2 { font-size: clamp(64px, 8vw, 134px); letter-spacing: -.07em; line-height: 1.1; font-weight: 600; }
#ivx .ivx-immersive p { font-size: 15px; margin-top: 20px; }
#ivx .ivx-photo-label { position: absolute; right: 19px; bottom: 19px; font-size: 14px; letter-spacing: .15em; color: #fff; text-shadow: 0 1px 8px #000; }
#ivx .ivx-orbit { position: absolute; width: 18%; top: 51%; padding: 7px; background: #24281e; border: 1px solid #4c5446; border-radius: 5px; }
#ivx .ivx-orbit img { height: 100%; aspect-ratio: 1/1.2; }
#ivx .ivx-orbit span { display: block; font-size: 14px; letter-spacing: .07em; padding: 9px 3px 3px; color: #a9b09d; }
#ivx .ivx-orbit--left { left: 3.5%; transform: rotate(-9deg); }
#ivx .ivx-orbit--right { right: 3.5%; top: 59%; transform: rotate(8deg); }
#ivx .ivx-orbit--right img { aspect-ratio: 1.3/1; }
#ivx .ivx-hero-bottom { position: absolute; bottom: 17px; left: 0; right: 0; display: flex; justify-content: space-between; align-items: center; font-size: 14px; color: #a1a894; letter-spacing: .02em; z-index: 3; }
#ivx .ivx-hero-bottom a { font-size: 14px; letter-spacing: .12em; }
#ivx .ivx-hero-bottom a span { display: inline-block; padding-left: 12px; color: var(--ivx-lime); font-size: 15px; }
#ivx .ivx-scroll-counter { width: 142px; text-align: right; }
#ivx .ivx-facts { background: var(--ivx-lime); color: var(--ivx-ink); }
#ivx .ivx-facts-grid { display: grid; grid-template-columns: repeat(3,1fr); padding-block: 50px; }
#ivx .ivx-facts-grid > div { padding-left: 44px; border-left: 1px solid #10120f30; }
#ivx .ivx-facts-grid > div:first-child { padding-left: 0; border: 0; }
#ivx .ivx-facts strong { font-size: clamp(38px, 5.4vw, 76px); letter-spacing: -.055em; line-height: 1; font-weight: 600; }
#ivx .ivx-facts small { font-size: 16px; margin-left: 10px; letter-spacing: -.035em; font-weight: 600; }
#ivx .ivx-facts p { font-size: 14px; padding-top: 13px; }
#ivx .ivx-intro { padding-block: 125px 130px; }
#ivx .ivx-intro > .ivx-eyebrow { color: var(--ivx-lime); margin-bottom: 37px; }
#ivx .ivx-section-title { font-size: clamp(36px, 4.3vw, 64px); line-height: 1.2; letter-spacing: -.06em; }
#ivx .ivx-section-title > span { color: #949d87; }
#ivx .ivx-intro-grid { display: grid; grid-template-columns: 1.4fr 1fr; gap: 60px; margin-bottom: 70px; }
#ivx .ivx-intro-text { font-size: 16px; line-height: 1.85; padding-top: 6px; }
#ivx .ivx-intro-text p + p { margin-top: 20px; font-size: 14px; }
#ivx .ivx-feature-lines > div { display: grid; grid-template-columns: 60px 1.05fr 1fr 30px; gap: 24px; padding-block: 31px; border-top: 1px solid #414739; align-items: center; }
#ivx .ivx-feature-lines > div:last-child { border-bottom: 1px solid #414739; }
#ivx .ivx-feature-lines > div > span:first-child { font-size: 14px; color: var(--ivx-lime); }
#ivx .ivx-feature-lines h3 { font-size: 27px; }
#ivx .ivx-feature-lines p { font-size: 14px; color: #a3ac98; line-height: 1.8; }
#ivx .ivx-feature-lines > div > span:last-child { font-size: 27px; color: #9ca88c; font-weight: 300; }
#ivx .ivx-story { position: relative; background: var(--ivx-paper); color: var(--ivx-ink); }
#ivx .ivx-story-stage { padding-block: 62px; }
#ivx .ivx-story-heading { display: flex; justify-content: space-between; align-items: center; gap: 25px; }
#ivx .ivx-story-heading .ivx-eyebrow { color: #626e54; }
#ivx .ivx-story-heading h2 { font-size: 25px; }
#ivx .ivx-story-tabs { display: flex; border-bottom: 1px solid #bcc4b1; margin-top: 35px; }
#ivx .ivx-story-tabs button { background: none; border: 0; border-bottom: 2px solid transparent; display: flex; gap: 24px; padding: 16px 20px 15px 0; flex: 1; text-align: left; font-size: 14px; color: #647153; }
#ivx .ivx-story-tabs button span { font-size: 14px; font-weight: 600; }
#ivx .ivx-story-tabs button[aria-pressed="true"] { border-color: #111; color: #111; }
#ivx .ivx-story-tabs button:hover { color: #111; }
#ivx .ivx-story-panel { display: grid; grid-template-columns: 1.3fr 1fr; gap: 8%; align-items: center; padding-top: 38px; }
#ivx .ivx-story-panel + .ivx-story-panel { margin-top: 55px; }
#ivx .ivx-story-art { height: 385px; position: relative; border-radius: 3px; overflow: hidden; isolation: isolate; background: #dbe1d1; }
#ivx .ivx-art-coordinate { position: absolute; left: 25px; top: 20px; font-size: 14px; letter-spacing: .14em; z-index: 3; }
#ivx .ivx-art-bottom { position: absolute; bottom: 20px; left: 25px; right: 25px; font-size: 14px; letter-spacing: .1em; display: flex; align-items: center; justify-content: space-between; z-index: 3; }
#ivx .ivx-art-bottom b { font-size: 23px; font-weight: 400; }
#ivx .ivx-stack { position: absolute; width: 55%; left: 22%; top: 26%; height: 53%; border: 4px solid #f7f8f3; border-bottom-width: 27px; box-shadow: 0 8px 25px #14240820; transition: transform .6s; }
#ivx .ivx-stack img { height: 100%; }
#ivx .ivx-stack--back { transform: translate(41px,-34px) rotate(11deg); }
#ivx .ivx-stack--middle { transform: translate(-40px,7px) rotate(-13deg); }
#ivx .ivx-stack--front { transform: rotate(1deg); }
#ivx .ivx-stack--front > span { font-size: 14px; display: flex; justify-content: space-between; padding: 7px 5px; }
#ivx .ivx-stack--front b { font-weight: 400; }
#ivx .ivx-chapter { color: #667450; font-size: 14px; font-weight: 650; letter-spacing: .1em; }
#ivx .ivx-story-copy h3 { font-size: clamp(31px, 3.6vw, 53px); line-height: 1.22; margin-block: 19px 24px; letter-spacing: -.06em; }
#ivx .ivx-story-copy > p { font-size: 15px; line-height: 1.85; color: #5a6251; }
#ivx .ivx-key-hint { display: flex; gap: 6px; align-items: center; margin-top: 29px; font-size: 14px; }
#ivx .ivx-key-hint > span { margin-left: 6px; color: #646c5d; }
#ivx kbd { display: inline-flex; align-items: center; justify-content: center; font: inherit; font-size: 14px; border: 1px solid currentColor; border-radius: 4px; padding: 3px 8px; min-width: 27px; }
#ivx .ivx-key-hint kbd { border-color: #bdc6b0; box-shadow: 0 3px 0 #c4cbb9; background: #fafbf7; font-size: 17px; width: 35px; height: 33px; }
#ivx .ivx-art--archive { background: #e2d3be; }
#ivx .ivx-archive-photo { position: absolute; width: 43%; height: 54%; left: 32%; top: 16%; transform: rotate(10deg); border: 5px solid #faf5ec; box-shadow: 0 5px 30px #51351220; }
#ivx .ivx-archive-photo img { height: 100%; }
#ivx .ivx-folder { background: var(--ivx-lime); position: absolute; left: 17%; top: 41%; width: 64%; padding: 24px; transform: rotate(-7deg); border-radius: 0 9px 9px 9px; box-shadow: 0 13px 30px #3322052b; }
#ivx .ivx-folder:before { content: ''; position: absolute; width: 43%; height: 19px; left: 0; top: -18px; background: var(--ivx-lime); border-radius: 7px 12px 0 0; }
#ivx .ivx-folder > span, #ivx .ivx-folder small { display: block; font-size: 14px; letter-spacing: .08em; }
#ivx .ivx-folder strong { font-size: 52px; display: flex; justify-content: space-between; align-items: center; font-weight: 500; letter-spacing: -.04em; line-height: 1.3; }
#ivx .ivx-folder strong > span { font-size: 42px; }
#ivx .ivx-archive-tag { position: absolute; right: 12%; top: 29%; background: #171c12; color: #fff; padding: 8px 17px; border-radius: 99px; font-size: 14px; transform: rotate(6deg); }
#ivx .ivx-text-tag { display: inline-block; border-top: 1px solid #c3cbb7; padding-top: 20px; margin-top: 25px; color: #5c684d; font-size: 14px; }
#ivx .ivx-art--convert { background: #d5dfd7; }
#ivx .ivx-convert-inputs { position: absolute; left: 15%; right: 15%; top: 20%; display: flex; justify-content: space-between; gap: 16px; }
#ivx .ivx-convert-inputs span { background: #f9faf4; border: 1px solid #c6cfc5; padding: 24px 10px 9px; width: 29%; border-radius: 4px 16px 4px 4px; font-size: 17px; box-shadow: 0 4px 0 #bdc8bc; letter-spacing: -.04em; }
#ivx .ivx-convert-line { position: absolute; left: 19%; right: 19%; top: 43%; display: flex; justify-content: center; color: #587258; }
#ivx .ivx-convert-line b { font-size: 33px; font-weight: 400; }
#ivx .ivx-convert-output { position: absolute; top: 54%; left: 21%; width: 58%; background: #263c2c; color: #fff; padding: 15px 21px; border-radius: 5px; transform: rotate(-4deg); box-shadow: 0 7px 20px #172c2020; }
#ivx .ivx-convert-output > span { font-size: 14px; letter-spacing: .14em; color: #c2d0b2; }
#ivx .ivx-convert-output strong { font-size: 35px; font-weight: 500; letter-spacing: -.06em; display: flex; align-items: center; justify-content: space-between; line-height: 1.35; }
#ivx .ivx-convert-output i { color: var(--ivx-lime); font-size: 30px; font-style: normal; }
#ivx .ivx-convert-output div { display: flex; justify-content: space-between; font-size: 14px; color: #cbd4c4; }
#ivx .ivx-convert-output b { font-weight: 400; }
#ivx .ivx-story-progress { height: 2px; background: #c9d0c0; margin-top: 34px; }
#ivx .ivx-story-progress > span { display: block; width: 33.33%; height: 100%; background: #27391a; }
#ivx .ivx-demo { padding-block: 130px; }
#ivx .ivx-demo-heading { display: flex; align-items: end; justify-content: space-between; gap: 50px; margin-bottom: 50px; }
#ivx .ivx-demo-heading .ivx-eyebrow { color: var(--ivx-lime); margin-bottom: 25px; }
#ivx .ivx-demo-heading > div:last-child { max-width: 380px; }
#ivx .ivx-demo-heading > div > p:not(.ivx-eyebrow) { font-size: 16px; line-height: 1.9; margin-bottom: 14px; }
#ivx .ivx-demo-heading kbd { color: var(--ivx-lime); border-color: #5b654b; padding-block: 0; }
#ivx .ivx-viewer { border: 1px solid #4c5541; background: #1c2018; border-radius: 8px; overflow: hidden; }
#ivx .ivx-viewer-top { display: flex; justify-content: space-between; align-items: center; padding: 18px 25px; font-size: 14px; color: #aab39d; }
#ivx .ivx-viewer-top .ivx-product { font-size: 17px; color: var(--ivx-paper); }
#ivx .ivx-viewer-top .ivx-icon { width: 19px; height: 19px; font-size: 17px; border-radius: 3px; }
#ivx .ivx-viewer-tag { font-size: 14px; letter-spacing: .12em; }
#ivx .ivx-filename { font-family: ui-monospace, monospace; font-size: 14px; white-space: nowrap; }
#ivx .ivx-viewer-image { position: relative; height: clamp(300px, 42vw, 560px); overflow: hidden; background: #090c08; }
#ivx .ivx-viewer-image img { width: 100%; height: 100%; object-fit: cover; transition: transform .42s cubic-bezier(.2,.6,.3,1); }
#ivx .ivx-viewer-index { position: absolute; bottom: 23px; right: 29px; font-size: 29px; font-weight: 500; text-shadow: 0 1px 10px #0008; }
#ivx .ivx-viewer-index i { font-size: 14px; font-style: normal; color: #f6f6f6bb; }
#ivx .ivx-viewer-controls { display: flex; align-items: center; justify-content: space-between; padding: 16px 25px; }
#ivx .ivx-thumbs { display: flex; gap: 6px; min-width: 0; overflow-x: auto; scrollbar-width: none; margin-right: 16px; }
#ivx .ivx-thumbs::-webkit-scrollbar { display: none; }
#ivx .ivx-thumbs button { flex: none; border: 1px solid transparent; background: none; padding: 3px; border-radius: 2px; width: 54px; }
#ivx .ivx-thumbs button[aria-pressed="true"] { border-color: var(--ivx-lime); }
#ivx .ivx-thumbs img { height: 35px; }
#ivx .ivx-viewer-actions { display: flex; align-items: center; gap: 8px; }
#ivx .ivx-viewer-actions button { border: 1px solid #48513c; border-radius: 4px; width: 44px; height: 42px; background: #262c20; font-size: 21px; }
#ivx .ivx-viewer-actions button:last-child { font-size: 14px; }
#ivx .ivx-viewer-actions button:hover { background: #3b462d; color: var(--ivx-lime); }
#ivx .ivx-viewer-actions > span { width: 12px; }
#ivx .ivx-demo-help { display: flex; justify-content: space-between; align-items: center; gap: 20px; padding-top: 15px; font-size: 14px; color: #939e84; }
#ivx .ivx-demo-help > span:first-child { display: flex; align-items: center; gap: 8px; }
#ivx .ivx-shortcuts { border-top: 1px solid #47513b; border-bottom: 1px solid #47513b; margin-top: 48px; }
#ivx .ivx-shortcuts summary { display: flex; justify-content: space-between; align-items: center; cursor: pointer; padding: 23px 0; font-size: 15px; list-style: none; }
#ivx .ivx-shortcuts summary::-webkit-details-marker, #ivx .ivx-faq summary::-webkit-details-marker { display: none; }
#ivx .ivx-shortcuts summary > span { color: var(--ivx-lime); }
#ivx .ivx-shortcuts[open] summary > span, #ivx .ivx-faq details[open] summary > span { transform: rotate(45deg); }
#ivx .ivx-shortcut-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 0 50px; padding-bottom: 27px; }
#ivx .ivx-shortcut-grid > div { display: flex; gap: 15px; justify-content: space-between; align-items: center; font-size: 14px; padding: 12px 0; border-top: 1px solid #ffffff10; }
#ivx .ivx-shortcut-grid > div > span:first-child { display: flex; gap: 4px; align-items: center; }
#ivx .ivx-shortcut-grid kbd { font-size: 14px; padding: 1px 5px; border-color: #4b5540; min-width: 23px; }
#ivx .ivx-everyday { background: #e6eade; color: var(--ivx-ink); padding-bottom: 100px; overflow: hidden; }
#ivx .ivx-type-band { border-bottom: 1px solid #bdc7af; padding-block: 28px; white-space: nowrap; overflow: hidden; }
#ivx .ivx-type-band > span { display: block; font-size: clamp(56px, 11vw, 160px); line-height: 1; letter-spacing: -.065em; font-weight: 500; color: #c2cdb4; width: max-content; margin-left: -30px; }
#ivx .ivx-everyday-heading { padding-top: 85px; }
#ivx .ivx-everyday-heading .ivx-eyebrow { color: #5e6c4d; margin-bottom: 29px; }
#ivx .ivx-everyday-heading > p:last-child { font-size: 15px; color: #5d6653; margin-top: 24px; }
#ivx .ivx-everyday-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 32px; margin-top: 66px; }
#ivx .ivx-everyday-grid article { padding-top: 23px; border-top: 1px solid #adb99f; display: flex; flex-direction: column; align-items: flex-start; }
#ivx .ivx-feature-symbol { font-size: 36px; line-height: 1; font-weight: 400; margin-bottom: 44px; color: #61734b; }
#ivx .ivx-everyday-grid h3 { font-size: 24px; margin-bottom: 18px; }
#ivx .ivx-everyday-grid p { font-size: 14px; color: #616957; line-height: 1.85; flex: 1; }
#ivx .ivx-everyday-grid p kbd { padding: 0 5px; font-size: 14px; min-width: 20px; }
#ivx .ivx-everyday-grid article > span:last-child { font-size: 14px; letter-spacing: .09em; color: #6b765e; margin-top: 36px; }
#ivx .ivx-format-note { border-top: 1px solid #b8c3aa; padding-top: 22px; margin-top: 55px; font-size: 14px; color: #657257; }
#ivx .ivx-download { background: var(--ivx-lime); color: var(--ivx-ink); padding-block: 55px 35px; }
#ivx .ivx-download-top { display: flex; align-items: center; justify-content: space-between; }
#ivx .ivx-download-top .ivx-dot { background: #18200b; }
#ivx .ivx-download-top > span { font-size: 14px; letter-spacing: .12em; }
#ivx .ivx-download-grid { display: grid; grid-template-columns: 1.5fr 1fr; gap: 30px; align-items: center; padding-block: 55px 60px; }
#ivx .ivx-download h2 { font-size: clamp(48px, 6.7vw, 104px); line-height: 1.15; letter-spacing: -.06em; font-weight: 600; }
#ivx .ivx-download h2 > span { color: #516e19; }
#ivx .ivx-download-grid p { margin-block: 23px 26px; font-size: 17px; }
#ivx .ivx-download-meta { margin-top: 14px; font-size: 14px; color: #4f631f; }
#ivx .ivx-download-mark { justify-self: center; width: 75%; aspect-ratio: 1; border: 1px solid #769a30; border-radius: 25%; display: grid; place-items: center; transform: rotate(-10deg); background: #bbdf50; box-shadow: 10px 12px 0 #a5c647; }
#ivx .ivx-download-mark > span { display: block; font-size: clamp(100px, 17vw, 265px); line-height: 1; font-family: Arial, sans-serif; font-weight: 400; margin-top: -5%; }
#ivx .ivx-requirements { display: grid; grid-template-columns: repeat(3,1fr); padding-top: 25px; border-top: 1px solid #769a3066; margin: 0; gap: 25px; }
#ivx .ivx-requirements dt { font-size: 14px; color: #586f25; margin-bottom: 5px; }
#ivx .ivx-requirements dd { font-size: 14px; margin: 0; }
#ivx .ivx-requirements a { text-decoration: underline; text-underline-offset: 4px; }
#ivx .ivx-install-note { font-size: 14px; color: #586b29; padding-top: 27px; line-height: 1.8; }
#ivx .ivx-faq { display: grid; grid-template-columns: .95fr 1.3fr; gap: 8%; padding-block: 120px; }
#ivx .ivx-faq .ivx-eyebrow { color: #a4b48b; margin-bottom: 30px; }
#ivx .ivx-faq .ivx-section-title { font-size: clamp(32px, 3.4vw, 49px); }
#ivx .ivx-faq-link { display: inline-block; font-size: 14px; color: #b3c29d; margin-top: 30px; }
#ivx .ivx-faq-list { border-top: 1px solid #49543d; }
#ivx .ivx-faq details { border-bottom: 1px solid #49543d; }
#ivx .ivx-faq summary { display: flex; align-items: center; gap: 20px; justify-content: space-between; padding-block: 24px; font-size: 15px; cursor: pointer; list-style: none; }
#ivx .ivx-faq summary > span { font-size: 20px; color: #a3b988; flex: none; }
#ivx .ivx-faq details > div { padding-bottom: 26px; color: #a5b198; font-size: 14px; line-height: 1.85; word-break: keep-all; }
#ivx .ivx-faq details a { text-decoration: underline; text-underline-offset: 4px; color: var(--ivx-lime); }

/* Native scrolling; motion is only enhanced when the complete scene fits. */
#ivx.ivx-motion .ivx-hero { height: 220svh; }
#ivx.ivx-motion .ivx-hero-stage { position: sticky; top: var(--ivx-header); height: calc(100svh - var(--ivx-header)); max-height: none; }
#ivx.ivx-motion .ivx-hero-copy { transform: translateY(calc(var(--hero-progress, 0) * -110px)); opacity: calc(1 - var(--hero-progress, 0) * 2.8); }
#ivx.ivx-motion .ivx-hero-top { opacity: calc(1 - var(--hero-progress, 0) * 3); }
#ivx.ivx-motion .ivx-hero-window { top: calc(46% - var(--hero-progress, 0) * 43%); left: calc(24% - var(--hero-progress, 0) * 22%); width: calc(52% + var(--hero-progress, 0) * 44%); height: calc(46% + var(--hero-progress, 0) * 44%); }
#ivx.ivx-motion .ivx-orbit--left { transform: translate(calc(var(--hero-progress, 0) * -250px), calc(var(--hero-progress, 0) * 80px)) rotate(calc(-9deg - var(--hero-progress, 0) * 24deg)); opacity: calc(1 - var(--hero-progress, 0) * 2); }
#ivx.ivx-motion .ivx-orbit--right { transform: translate(calc(var(--hero-progress, 0) * 250px), calc(var(--hero-progress, 0) * 80px)) rotate(calc(8deg + var(--hero-progress, 0) * 24deg)); opacity: calc(1 - var(--hero-progress, 0) * 2); }
#ivx.ivx-motion .ivx-immersive { display: flex; opacity: var(--hero-caption, 0); transform: translateY(calc(20px - var(--hero-caption, 0) * 20px)); }
#ivx.ivx-enhanced .ivx-story-panels { display: grid; }
#ivx.ivx-enhanced .ivx-story-panel { grid-area: 1 / 1; margin: 0; visibility: hidden; opacity: 0; transform: translateY(16px); transition: opacity .4s, transform .5s, visibility .4s; }
#ivx.ivx-enhanced .ivx-story-panel.is-active { visibility: visible; opacity: 1; transform: none; }
#ivx.ivx-motion .ivx-story { height: 270svh; }
#ivx.ivx-motion .ivx-story-stage { position: sticky; top: var(--ivx-header); min-height: calc(100svh - var(--ivx-header)); display: flex; flex-direction: column; justify-content: center; padding-block: 32px; }
#ivx.ivx-motion .ivx-story-art { height: clamp(280px, 40vh, 440px); }
#ivx.ivx-enhanced .ivx-reveal { transition: transform .8s cubic-bezier(.2,.65,.3,1), opacity .8s; }
#ivx.ivx-enhanced .ivx-reveal.is-waiting { opacity: 0; transform: translateY(27px); }
#ivx.ivx-enhanced .ivx-story-tabs { display: flex; }
#ivx:not(.ivx-enhanced) .ivx-story-tabs, #ivx:not(.ivx-enhanced) .ivx-viewer-actions, #ivx:not(.ivx-enhanced) .ivx-thumbs { display: none; }

@media (min-width: 1600px) {
    #ivx .ivx-hero-copy h1 { font-size: 88px; }
    #ivx .ivx-hero-copy { padding-top: 7vh; }
}
@media (max-width: 1050px) {
    #ivx .ivx-shell { width: calc(100% - 64px); }
    #ivx .ivx-hero-copy { grid-template-columns: 1.7fr 1fr; gap: 20px; }
    #ivx .ivx-hero-copy h1 { font-size: 5.7vw; }
    #ivx .ivx-hero-side > p { font-size: 14px; }
    #ivx .ivx-hero-side .ivx-button { font-size: 14px; padding-inline: 16px; gap: 30px; }
    #ivx .ivx-facts-grid > div { padding-left: 25px; }
    #ivx .ivx-facts p { font-size: 14px; }
    #ivx .ivx-intro-grid { gap: 35px; }
    #ivx .ivx-feature-lines > div { grid-template-columns: 35px 1.1fr 1fr 20px; gap: 20px; }
    #ivx .ivx-feature-lines h3 { font-size: 23px; }
    #ivx .ivx-everyday-grid { grid-template-columns: repeat(2,1fr); gap: 45px 35px; }
    #ivx .ivx-story-panel { gap: 5%; }
    #ivx .ivx-story-copy h3 { font-size: 36px; }
    #ivx .ivx-story-copy > p { font-size: 14px; }
    #ivx .ivx-demo-heading { gap: 25px; }
    #ivx .ivx-demo-heading > div:last-child { max-width: 320px; }
    #ivx .ivx-demo-heading > div > p:not(.ivx-eyebrow) { font-size: 14px; }
}
@media (max-width: 760px) {
    #ivx { --ivx-header: 70px; }
    #ivx .ivx-shell { width: calc(100% - 40px); }
    #ivx .ivx-hero { min-height: 750px; }
    #ivx .ivx-hero-stage { height: 750px; }
    #ivx .ivx-hero-top { padding-top: 21px; }
    #ivx .ivx-product { font-size: 21px; }
    #ivx .ivx-product-nav { gap: 18px; font-size: 14px; }
    #ivx .ivx-product-nav a:first-child, #ivx .ivx-product-nav a:nth-child(2) { display: none; }
    #ivx .ivx-hero-copy { display: block; padding-top: 39px; }
    #ivx .ivx-hero-copy .ivx-eyebrow { font-size: 14px; margin-bottom: 17px; }
    #ivx .ivx-hero-copy h1 { font-size: clamp(36px, 8.5vw, 60px); line-height: 1.2; letter-spacing: -.068em; }
    #ivx .ivx-hero-side { margin-top: 20px; justify-self: auto; width: 100%; }
    #ivx .ivx-hero-side > p { font-size: 14px; line-height: 1.65; margin-bottom: 16px; }
    #ivx .ivx-hero-side > p br:first-child { display: none; }
    #ivx .ivx-hero-side > p br:first-child::after { content: ' '; }
    #ivx .ivx-hero-side .ivx-button { min-height: 45px; padding: 12px 16px; font-size: 14px; gap: 31px; }
    #ivx .ivx-micro { display: inline-block; margin-left: 9px; font-size: 14px; margin-top: 0; vertical-align: middle; }
    #ivx .ivx-hero-window { left: 12%; width: 76%; top: 57%; height: 33%; border-radius: 6px; }
    #ivx .ivx-orbit { width: 28%; padding: 4px; }
    #ivx .ivx-orbit--left { left: -10%; top: 62%; }
    #ivx .ivx-orbit--right { right: -9%; top: 68%; }
    #ivx .ivx-orbit span { font-size: 14px; padding: 5px 2px 2px; }
    #ivx .ivx-window-bar { height: 25px; flex-basis: 25px; padding-inline: 9px; font-size: 14px; }
    #ivx .ivx-window-bar i:not(.ivx-status-dot) { padding-left: 8px; }
    #ivx .ivx-window-bottom { height: 20px; flex-basis: 20px; padding-inline: 9px; font-size: 14px; }
    #ivx .ivx-hero-bottom { bottom: 28px; font-size: 14px; }
    #ivx .ivx-hero-bottom a { font-size: 14px; }
    #ivx .ivx-scroll-counter { display: none; }
    #ivx .ivx-photo-label { font-size: 14px; bottom: 10px; right: 10px; }
    #ivx .ivx-immersive { padding: 8%; }
    #ivx .ivx-immersive .ivx-eyebrow { font-size: 14px; }
    #ivx .ivx-immersive h2 { font-size: clamp(56px, 15vw, 95px); }
    #ivx .ivx-immersive p { font-size: 14px; max-width: 225px; }
    #ivx .ivx-facts-grid { padding-block: 31px; }
    #ivx .ivx-facts-grid > div { padding-left: 15px; padding-right: 8px; }
    #ivx .ivx-facts strong { font-size: clamp(24px, 7.6vw, 46px); }
    #ivx .ivx-facts small { font-size: 14px; margin-left: 3px; }
    #ivx .ivx-facts p { font-size: 14px; padding-top: 9px; line-height: 1.6; }
    #ivx .ivx-intro { padding-block: 75px; }
    #ivx .ivx-intro > .ivx-eyebrow { margin-bottom: 24px; }
    #ivx .ivx-eyebrow { font-size: 14px; }
    #ivx .ivx-intro-grid { display: block; margin-bottom: 36px; }
    #ivx .ivx-section-title { font-size: clamp(32px, 8.5vw, 50px); }
    #ivx .ivx-intro-text { font-size: 14px; padding-top: 25px; }
    #ivx .ivx-intro-text p + p { font-size: 14px; margin-top: 14px; }
    #ivx .ivx-feature-lines > div { grid-template-columns: 20px 1fr 18px; gap: 10px 13px; padding-block: 22px; }
    #ivx .ivx-feature-lines h3 { font-size: 22px; }
    #ivx .ivx-feature-lines p { grid-column: 2 / 3; grid-row: 2; font-size: 14px; }
    #ivx .ivx-feature-lines > div > span:last-child { grid-column: 3; grid-row: 1; font-size: 21px; }
    #ivx .ivx-story-stage { padding-block: 40px; }
    #ivx .ivx-story-heading { display: block; }
    #ivx .ivx-story-heading h2 { font-size: 23px; margin-top: 13px; }
    #ivx .ivx-story-tabs { margin-top: 23px; }
    #ivx .ivx-story-tabs button { font-size: 14px; gap: 8px; padding-block: 13px; padding-right: 2px; }
    #ivx .ivx-story-tabs button span { font-size: 14px; }
    #ivx .ivx-story-panel { grid-template-columns: 1fr; gap: 22px; padding-top: 24px; }
    #ivx .ivx-story-art { height: 270px; }
    #ivx .ivx-story-copy h3 { font-size: 31px; margin-block: 10px 13px; }
    #ivx .ivx-story-copy h3 br { display: none; }
    #ivx .ivx-story-copy > p { font-size: 14px; line-height: 1.8; }
    #ivx .ivx-chapter { font-size: 14px; }
    #ivx .ivx-key-hint { margin-top: 17px; }
    #ivx .ivx-key-hint kbd { width: 28px; height: 25px; font-size: 14px; }
    #ivx .ivx-text-tag { margin-top: 14px; padding-top: 12px; font-size: 14px; }
    #ivx .ivx-art-coordinate, #ivx .ivx-art-bottom { font-size: 14px; left: 17px; }
    #ivx .ivx-art-coordinate { top: 13px; }
    #ivx .ivx-art-bottom { bottom: 12px; }
    #ivx .ivx-folder { padding: 15px 20px; }
    #ivx .ivx-folder strong { font-size: 41px; }
    #ivx .ivx-folder > span, #ivx .ivx-folder small { font-size: 14px; }
    #ivx .ivx-convert-inputs { top: 19%; }
    #ivx .ivx-convert-inputs span { padding-top: 16px; font-size: 14px; }
    #ivx .ivx-convert-line { top: 40%; }
    #ivx .ivx-convert-output { top: 54%; padding: 9px 15px; }
    #ivx .ivx-convert-output strong { font-size: 26px; }
    #ivx .ivx-convert-output div { font-size: 14px; }
    #ivx .ivx-story-progress { margin-top: 24px; }
    #ivx .ivx-demo { padding-block: 75px; }
    #ivx .ivx-demo-heading { display: block; margin-bottom: 28px; }
    #ivx .ivx-demo-heading .ivx-eyebrow { margin-bottom: 21px; }
    #ivx .ivx-demo-heading > div:last-child { max-width: none; margin-top: 23px; }
    #ivx .ivx-demo-heading > div > p:not(.ivx-eyebrow) { font-size: 14px; margin-bottom: 7px; }
    #ivx .ivx-demo-heading .ivx-small { font-size: 14px; }
    #ivx .ivx-viewer-top { padding: 13px 12px; }
    #ivx .ivx-viewer-top .ivx-product { font-size: 14px; gap: 6px; }
    #ivx .ivx-viewer-top .ivx-icon { width: 16px; height: 16px; font-size: 14px; }
    #ivx .ivx-viewer-tag { display: none; }
    #ivx .ivx-filename { font-size: 14px; }
    #ivx .ivx-viewer-image { height: 300px; }
    #ivx .ivx-viewer-controls { padding: 10px; gap: 10px; }
    #ivx .ivx-viewer-controls { flex-wrap: wrap; justify-content: center; }
    #ivx .ivx-thumbs { order: 2; flex: 1 1 100%; gap: 4px; margin-right: 0; }
    #ivx .ivx-thumbs button { width: 44px; padding: 2px; }
    #ivx .ivx-thumbs img { height: 28px; }
    #ivx .ivx-viewer-actions { gap: 4px; }
    #ivx .ivx-viewer-actions button { width: 34px; height: 36px; font-size: 16px; }
    #ivx .ivx-viewer-actions > span { width: 2px; }
    #ivx .ivx-demo-help { display: block; font-size: 14px; padding-top: 12px; }
    #ivx .ivx-demo-help > span + span { display: block; margin-top: 5px; padding-left: 15px; font-size: 14px; }
    #ivx .ivx-shortcuts { margin-top: 28px; }
    #ivx .ivx-shortcuts summary { font-size: 14px; padding-block: 19px; }
    #ivx .ivx-shortcut-grid { grid-template-columns: 1fr; }
    #ivx .ivx-shortcut-grid > div { font-size: 14px; }
    #ivx .ivx-everyday { padding-bottom: 65px; }
    #ivx .ivx-everyday-heading { padding-top: 55px; }
    #ivx .ivx-everyday-heading > p:last-child { font-size: 14px; margin-top: 19px; }
    #ivx .ivx-everyday-grid { margin-top: 38px; gap: 30px 22px; }
    #ivx .ivx-feature-symbol { margin-bottom: 27px; font-size: 28px; }
    #ivx .ivx-everyday-grid h3 { font-size: 20px; line-height: 1.25; }
    #ivx .ivx-everyday-grid p { font-size: 14px; }
    #ivx .ivx-everyday-grid article > span:last-child { font-size: 14px; margin-top: 22px; }
    #ivx .ivx-format-note { margin-top: 33px; font-size: 14px; }
    #ivx .ivx-download { padding-block: 32px; }
    #ivx .ivx-download-top .ivx-eyebrow { font-size: 14px; gap: 7px; }
    #ivx .ivx-download-top > span { font-size: 14px; }
    #ivx .ivx-download-grid { padding-block: 37px; display: block; position: relative; }
    #ivx .ivx-download h2 { font-size: clamp(40px, 11.5vw, 65px); }
    #ivx .ivx-download-grid p { font-size: 14px; margin-block: 20px; }
    #ivx .ivx-download .ivx-button { font-size: 14px; gap: 28px; min-height: 50px; padding: 14px 18px; }
    #ivx .ivx-download-mark { position: absolute; right: 3%; top: 51px; width: 19%; border-radius: 16px; box-shadow: 4px 5px 0 #a5c647; opacity: .7; }
    #ivx .ivx-download-mark > span { font-size: 15vw; }
    #ivx .ivx-requirements { grid-template-columns: 1fr; gap: 16px; padding-top: 20px; }
    #ivx .ivx-requirements > div { display: grid; grid-template-columns: 90px 1fr; gap: 15px; }
    #ivx .ivx-requirements dt { font-size: 14px; margin: 0; }
    #ivx .ivx-requirements dd { font-size: 14px; }
    #ivx .ivx-install-note { font-size: 14px; padding-top: 21px; }
    #ivx .ivx-faq { display: block; padding-block: 70px; }
    #ivx .ivx-faq .ivx-eyebrow { margin-bottom: 21px; }
    #ivx .ivx-faq .ivx-section-title { font-size: 35px; }
    #ivx .ivx-faq-link { margin-top: 22px; font-size: 14px; }
    #ivx .ivx-faq-list { margin-top: 35px; }
    #ivx .ivx-faq summary { font-size: 14px; padding-block: 22px; }
    #ivx .ivx-faq details > div { font-size: 14px; }
    #ivx.ivx-motion .ivx-hero { height: 200svh; }
    #ivx.ivx-motion .ivx-hero-window { top: calc(57% - var(--hero-progress, 0) * 54%); left: calc(12% - var(--hero-progress, 0) * 8%); width: calc(76% + var(--hero-progress, 0) * 16%); height: calc(33% + var(--hero-progress, 0) * 55%); }
    #ivx.ivx-motion .ivx-story { height: 300svh; }
    #ivx.ivx-motion .ivx-story-stage { padding-block: 23px 80px; }
    #ivx.ivx-motion .ivx-story-art { height: clamp(210px, 29vh, 320px); }
    #ivx.ivx-motion .ivx-story-heading h2 { font-size: 22px; }
    #ivx.ivx-motion .ivx-story-tabs { margin-top: 15px; }
    #ivx.ivx-motion .ivx-story-panel { padding-top: 19px; gap: 17px; }
    #ivx.ivx-motion .ivx-story-progress { margin-top: 18px; }
    #ivx.ivx-motion .ivx-hero-bottom { bottom: 67px; }
    #ivx.ivx-motion .ivx-hero-window { height: calc(30% + var(--hero-progress, 0) * 55%); }
}
@media (max-width: 360px) {
    #ivx .ivx-shell { width: calc(100% - 32px); }
    #ivx .ivx-hero-side .ivx-micro { display: block; margin: 9px 0 0; }
    #ivx .ivx-viewer-actions button { width: 30px; }
    #ivx .ivx-thumbs button { width: 32px; }
    #ivx .ivx-facts small { display: block; margin-left: 1px; margin-top: 6px; }
    #ivx .ivx-facts strong { min-height: 45px; display: block; }
}
@media (prefers-reduced-motion: reduce) {
    #ivx *, #ivx *::before, #ivx *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}