:root {
  --on-paper:#f2f2ee;
  --on-ink:#090a0d;
  --on-muted:#67686e;
  --on-line:#d8d8d2;
  --on-blue:#3157ff;
  --on-dark:#08090c;
  --on-panel:#121319;
}

html { scroll-behavior:smooth; }
body.omyne-product { margin:0; overflow-x:hidden; color:var(--on-ink); background:var(--on-paper); font-family:"Cabinet Grotesk","SF Pro Display","PingFang SC",sans-serif; }
.omyne-product * { box-sizing:border-box; }
.omyne-product a { color:inherit; text-decoration:none; }
.omyne-product img { display:block; }
.on-shell { width:min(1240px,calc(100% - 80px)); margin-inline:auto; }

.on-header { position:absolute; z-index:30; inset:0 0 auto; height:72px; }
.on-nav { width:min(1400px,calc(100% - 48px)); height:100%; display:grid; grid-template-columns:40px 1fr auto; align-items:center; gap:24px; margin:auto; }
.on-back { display:inline-flex; align-items:center; min-height:34px; font-size:11px; letter-spacing:.04em; transition:opacity .2s ease; }
.on-back:hover { opacity:.55; }
.on-brand { width:max-content; display:flex; align-items:baseline; gap:10px; }
.on-brand b { font-size:13px; font-weight:820; letter-spacing:.14em; }
.on-brand span { color:#787972; font-size:8px; font-weight:720; letter-spacing:.14em; }
.on-links { display:flex; align-items:center; gap:25px; }
.on-links > a { color:#55565b; font-size:11px; font-weight:680; }
.on-links > a:hover { color:var(--on-blue); }
.on-links .visitor-auth-slot:empty { display:none; }

.on-kicker,.on-index { color:#73747a; font-size:9px; font-weight:780; letter-spacing:.16em; }
.on-kicker { display:flex; align-items:center; gap:12px; margin:0 0 38px; }
.on-kicker i { width:8px; height:8px; border-radius:50%; background:var(--on-blue); box-shadow:0 0 0 5px rgba(49,87,255,.12); }
.on-hero { min-height:100svh; display:flex; flex-direction:column; justify-content:center; padding:120px 0 58px; }
.on-hero h1 { max-width:1180px; margin:0; font-size:clamp(82px,10.2vw,152px); font-weight:600; line-height:.86; letter-spacing:-.078em; text-wrap:balance; }
.on-hero h1 em { color:var(--on-blue); font-style:normal; }
.on-lead { max-width:680px; margin:58px 0 0 auto; color:#55565c; font-size:clamp(17px,1.5vw,21px); line-height:1.72; }
.on-demo-jumps { width:min(680px,100%); display:grid; grid-template-columns:1fr 1fr; gap:10px; margin:26px 0 0 auto; }
.on-demo-jumps a { min-height:66px; display:flex; align-items:center; gap:14px; padding:13px 16px; border:1px solid #d7d7d1; border-radius:10px; background:rgba(255,255,255,.3); transition:border-color .2s ease,background .2s ease,transform .2s ease; }
.on-demo-jumps a:hover { border-color:#a9afc8; background:rgba(255,255,255,.72); transform:translateY(-2px); }
.on-demo-jumps a > i { width:30px; height:30px; display:grid; flex:0 0 auto; place-items:center; border-radius:50%; color:white; background:var(--on-blue); }
.on-demo-jumps a > i::after { content:""; width:0; height:0; margin-left:2px; border-top:4px solid transparent; border-bottom:4px solid transparent; border-left:6px solid currentColor; }
.on-demo-jumps span { display:flex; flex-direction:column; gap:3px; }
.on-demo-jumps b { font-size:11px; font-weight:760; }
.on-demo-jumps small { color:#85868c; font-size:7px; font-weight:720; letter-spacing:.11em; }

.on-product-stage { position:relative; min-height:950px; padding:90px 5vw 130px; overflow:hidden; color:white; background:#08090c url('/assets/omyne-product-stage.png') center/cover no-repeat; }
@supports (background-image:image-set(url('/assets/omyne-product-stage-opt.webp') type('image/webp'))) {
  .on-product-stage { background-image:image-set(url('/assets/omyne-product-stage-opt.webp') type('image/webp'),url('/assets/omyne-product-stage.png') type('image/png')); }
}
.on-product-stage::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(3,4,7,.06),rgba(3,4,7,.35)); pointer-events:none; }
.on-stage-inner { position:relative; z-index:1; width:min(1380px,100%); min-height:730px; display:grid; place-items:center; margin:auto; }
.on-browser { position:relative; margin:0; overflow:hidden; border:1px solid rgba(255,255,255,.14); border-radius:14px; background:#0a0b0e; box-shadow:0 42px 120px rgba(0,0,0,.28); }
.on-browser > img { width:100%; height:auto; }
.on-browser-bar { height:34px; display:flex; align-items:center; gap:7px; padding:0 12px; border-bottom:1px solid #22242a; color:#70727a; background:#111216; }
.on-browser-bar i { width:6px; height:6px; border-radius:50%; background:#3d3f47; }
.on-browser-bar span { margin-left:7px; font-size:8px; letter-spacing:.05em; }
.on-browser-hero { width:min(1270px,92vw); transform:perspective(1900px) rotateX(1.2deg); }
.on-phone { position:relative; width:280px; aspect-ratio:390/844; margin:0; overflow:hidden; padding:16px 2px 14px; border:7px solid #24262c; border-radius:42px; background:#090a0d; box-shadow:0 34px 90px rgba(0,0,0,.34); }
.on-phone::before { content:""; position:absolute; z-index:3; bottom:5px; left:50%; width:34%; height:3px; border-radius:4px; background:rgba(255,255,255,.62); transform:translateX(-50%); }
.on-phone::after { content:""; position:absolute; inset:0; border:1px solid rgba(255,255,255,.12); border-radius:34px; pointer-events:none; }
.on-phone-speaker { position:absolute; z-index:2; top:8px; left:50%; width:54px; height:4px; border-radius:4px; background:#27292f; transform:translateX(-50%); opacity:.75; }
.on-phone img { width:100%; height:100%; object-fit:contain; }
.on-phone-hero { position:absolute; z-index:3; right:0; bottom:5px; width:245px; transform:rotate(1.7deg); }
.on-stage-note { position:absolute; bottom:0; left:0; display:grid; gap:7px; margin:0; }
.on-stage-note b { color:#8794ff; font-size:8px; letter-spacing:.15em; }
.on-stage-note span { color:#a3a5ad; font-size:10px; }

.on-statement { min-height:760px; display:flex; flex-direction:column; justify-content:center; padding-block:130px; }
.on-statement h2,.on-section-head h2,.on-closing h2 { margin:26px 0 0; font-size:clamp(58px,7.1vw,100px); font-weight:590; line-height:.94; letter-spacing:-.066em; text-wrap:balance; }
.on-heading-line { display:block; }
.on-statement > p:last-child,.on-section-head > p:last-child { max-width:570px; margin:44px 0 0 auto; color:var(--on-muted); font-size:15px; line-height:1.8; }

.on-dark,.on-terminal,.on-ops { padding:155px 0; color:white; background:var(--on-dark); }
.on-section { padding:155px 0; }
.on-section-head { display:grid; grid-template-columns:1fr 370px; column-gap:90px; align-items:end; }
.on-section-head .on-index { grid-column:1/-1; margin:0; }
.on-section-head h2 { font-size:clamp(54px,6.4vw,90px); }
.on-section-head > p:last-child { margin:0; }
.on-light-copy .on-index { color:#737680; }
.on-light-copy > p:last-child { color:#92949e; }

.on-node-strip { display:grid; grid-template-columns:1fr 80px 1.15fr 80px 1fr; align-items:center; gap:18px; margin:95px 0 24px; }
.on-node-strip article { min-height:150px; display:flex; flex-direction:column; justify-content:center; padding:24px; border:1px solid #292b31; border-radius:12px; background:#111218; }
.on-node-strip article.is-core { border-color:#3c5fff; background:radial-gradient(circle at 75% 15%,rgba(49,87,255,.3),transparent 48%),#151721; }
.on-node-strip small { color:#70727d; font-size:7px; letter-spacing:.14em; }
.on-node-strip b { margin-top:34px; font-size:24px; letter-spacing:-.04em; }
.on-node-strip span { margin-top:7px; color:#7d808b; font-size:9px; }
.on-node-strip > i { height:1px; background:linear-gradient(90deg,#2a2d35,#5470ff,#2a2d35); }
.on-browser-modal { width:100%; border-color:#2b2d34; box-shadow:none; }

.on-browser-wide { margin-top:88px; border-color:rgba(10,11,14,.15); box-shadow:0 36px 90px rgba(20,21,28,.16); }
.on-browser-wide .on-browser-bar { border-color:#d0d0ca; color:#83848a; background:#e7e7e2; }
.on-session-mobile-story { display:grid; grid-template-columns:330px minmax(0,520px); align-items:center; gap:clamp(45px,8vw,110px); margin:34px 0 0; }
.on-session-mobile-story .on-phone { width:100%; }
.on-session-mobile-story figcaption { margin:0; }
.on-session-mobile-story small,.on-desktop-demo header small { color:#777982; font-size:8px; font-weight:760; letter-spacing:.14em; }
.on-session-mobile-story h3,.on-desktop-demo h3 { margin:28px 0 18px; font-size:40px; line-height:1; letter-spacing:-.055em; }
.on-session-mobile-story p,.on-desktop-demo header p { max-width:460px; margin:0; color:#75767c; font-size:12px; line-height:1.75; }
.on-copy-card { min-height:300px; display:flex; flex-direction:column; justify-content:end; padding:36px; border:1px solid var(--on-line); border-radius:14px; background:#e8e8e3; }
.on-copy-card small,.on-module-grid small { color:#777982; font-size:8px; letter-spacing:.14em; }
.on-copy-card h3 { margin:auto 0 18px; font-size:40px; line-height:1; letter-spacing:-.055em; }
.on-copy-card p { margin:0; color:#75767c; font-size:12px; line-height:1.75; }

.on-video-slot { position:relative; min-width:0; overflow:hidden; display:flex; flex-direction:column; padding:30px; border:1px solid var(--on-line); border-radius:14px; background:#ecece7; }
.on-video-slot::before { content:""; position:absolute; inset:0; opacity:.5; background-image:linear-gradient(rgba(25,26,30,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(25,26,30,.05) 1px,transparent 1px); background-size:28px 28px; }
.on-video-slot > * { position:relative; z-index:1; }
.on-video-slot small { color:#7d7e84; font-size:8px; letter-spacing:.14em; }
.on-video-slot b { margin-top:auto; font-size:31px; letter-spacing:-.04em; }
.on-video-slot span { margin-top:8px; color:#77787e; font-size:9px; }
.on-video-slot i { align-self:flex-end; color:#7d7e84; font-size:8px; font-style:normal; }
.on-video-wide { min-height:310px; }
.on-video-player { position:relative; min-width:0; min-height:0; overflow:hidden; margin:0; border:1px solid var(--on-line); border-radius:14px; background:#090a0d; box-shadow:0 22px 60px rgba(15,16,22,.12); }
.on-video-player video { display:block; width:100%; height:auto; aspect-ratio:613/360; object-fit:cover; background:#090a0d; }
.on-video-player figcaption { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:15px 18px 17px; color:white; background:#111218; }
.on-video-player small { font-size:8px; letter-spacing:.13em; }
.on-video-player span { color:#b7b8bf; font-size:9px; }
.on-desktop-demo { margin-top:120px; padding:70px; border-radius:16px; background:#e7e7e2; }
.on-desktop-demo > header { display:grid; grid-template-columns:minmax(0,1fr) 420px; column-gap:70px; align-items:end; }
.on-desktop-demo > header small { grid-column:1/-1; }
.on-desktop-demo h3 { margin-bottom:0; font-size:clamp(42px,5vw,66px); }
.on-desktop-demo header p { margin-bottom:5px; }
.on-desktop-demo .on-video-wide { margin-top:48px; }

.on-terminal-grid { display:grid; grid-template-columns:1fr 280px; gap:18px; margin-top:90px; }
.on-browser-terminal { align-self:start; border-color:#2b2d34; }
.on-terminal-grid > .on-phone { width:100%; }
.on-terminal-meta { grid-column:1/-1; display:flex; flex-wrap:wrap; gap:8px; }
.on-terminal-meta span { padding:9px 12px; border:1px solid #303139; border-radius:5px; color:#8a8d97; font-size:8px; letter-spacing:.06em; }
.on-browser-terminal-menu { grid-column:1/-1; }
.on-video-dark { grid-column:1/-1; min-height:320px; color:white; border-color:#292a31; background:#111218; }
.on-video-dark::before,.on-video-mobile::before { background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px); }
.on-video-dark span,.on-video-mobile span { color:#81838c; }

.on-module-grid { display:grid; gap:18px; margin-top:88px; }
.on-module-grid article { display:grid; grid-template-columns:340px 1fr; gap:44px; align-items:center; min-height:480px; padding:34px; overflow:hidden; border-radius:14px; background:#e7e7e2; }
.on-module-grid article:first-child { color:white; background:#111218; }
.on-module-grid h3 { margin:50px 0 18px; font-size:39px; line-height:1.04; letter-spacing:-.052em; }
.on-module-grid p { margin:0; color:#81838b; font-size:12px; line-height:1.75; }
.on-module-grid .on-browser { border-color:rgba(255,255,255,.09); border-radius:9px; box-shadow:0 24px 60px rgba(0,0,0,.16); }

.on-ops-gallery { display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-top:88px; }
.on-ops-gallery figure { position:relative; min-width:0; margin:0; overflow:hidden; border:1px solid #292a31; border-radius:14px; background:#111218; }
.on-ops-gallery figcaption { display:flex; justify-content:space-between; align-items:baseline; gap:20px; padding:24px; }
.on-ops-gallery figcaption b { font-size:24px; letter-spacing:-.04em; }
.on-ops-gallery figcaption span { color:#7e818b; font-size:9px; }
.on-ops-gallery img { width:100%; height:auto; border-top:1px solid #292a31; }

.on-mobile { padding:155px 0 170px; }
.on-phone-gallery { display:grid; grid-template-columns:repeat(4,1fr); gap:18px; margin-top:88px; }
.on-phone-gallery figure { min-width:0; margin:0; text-align:center; }
.on-phone-gallery .on-phone { width:100%; border-width:6px; border-radius:34px; box-shadow:0 30px 70px rgba(20,21,28,.22); }
.on-phone-gallery figcaption { margin-top:17px; color:#717279; font-size:10px; letter-spacing:.08em; }
.on-video-mobile { min-height:430px; margin-top:70px; color:white; border-color:#292a31; background:#111218; }
.on-mobile-film { position:relative; min-height:760px; display:grid; grid-template-columns:minmax(280px,390px) minmax(220px,1fr); align-items:center; gap:clamp(55px,9vw,130px); margin:86px 0 0; padding:70px clamp(38px,7vw,95px); overflow:hidden; border-radius:16px; color:white; background:radial-gradient(circle at 28% 42%,rgba(49,87,255,.22),transparent 34%),#0b0c10; box-shadow:0 30px 90px rgba(18,19,25,.14); }
.on-mobile-film::before { content:""; position:absolute; inset:0; opacity:.35; background-image:linear-gradient(rgba(255,255,255,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.03) 1px,transparent 1px); background-size:34px 34px; pointer-events:none; }
.on-mobile-film-device { position:relative; z-index:1; width:100%; max-width:370px; justify-self:center; padding:15px 6px 13px; overflow:hidden; border:7px solid #25272e; border-radius:48px; background:#050609; box-shadow:0 40px 100px rgba(0,0,0,.52); }
.on-mobile-film-device::after { content:""; position:absolute; inset:0; border:1px solid rgba(255,255,255,.12); border-radius:40px; pointer-events:none; }
.on-mobile-film-device video { display:block; width:100%; aspect-ratio:59/128; object-fit:cover; border-radius:35px; background:#050609; }
.on-mobile-film-speaker { position:absolute; z-index:2; top:8px; left:50%; width:58px; height:4px; border-radius:10px; background:#30323a; transform:translateX(-50%); }
.on-mobile-film figcaption { position:relative; z-index:1; display:flex; flex-direction:column; gap:22px; }
.on-mobile-film figcaption small { color:#7185ff; font-size:9px; font-weight:780; letter-spacing:.16em; }
.on-mobile-film figcaption span { max-width:360px; font-size:clamp(30px,4vw,52px); font-weight:590; line-height:1.08; letter-spacing:-.05em; }

.on-closing { padding:180px 0; color:white; background:var(--on-blue); }
.on-closing span { font-size:10px; font-weight:820; letter-spacing:.15em; }
.on-closing h2 { max-width:1120px; }
.on-closing h2 em { color:#0b0c10; font-style:normal; }
.on-closing p { max-width:570px; margin:55px 0 0 auto; color:rgba(255,255,255,.76); font-size:15px; line-height:1.8; }
.on-social-proof { padding-top:120px; padding-bottom:135px; }
.on-social-card { display:block; padding:32px 34px 28px; border:1px solid var(--on-line); border-radius:14px; color:var(--on-ink); background:rgba(255,255,255,.74); transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease; }
.on-social-card:hover { border-color:#b5b8c2; transform:translateY(-3px); box-shadow:0 26px 80px rgba(17,18,24,.09); }
.on-social-card > header { display:flex; align-items:center; justify-content:space-between; gap:24px; }
.on-social-card > header > span { display:inline-flex; align-items:center; gap:11px; color:#777982; font-size:9px; font-weight:760; letter-spacing:.14em; }
.on-social-card > header i { width:8px; height:8px; border-radius:50%; background:#ff2442; box-shadow:0 0 0 5px rgba(255,36,66,.1); }
.on-social-card > header b { display:inline-flex; align-items:center; gap:9px; color:#292a2f; font-size:10px; font-weight:710; }
.on-social-arrow { width:14px; height:14px; display:inline-grid; place-items:center; flex:0 0 auto; font-size:17px; font-weight:420; line-height:1; transform:rotate(-45deg); transform-origin:center; }
.on-social-body { display:grid; grid-template-columns:minmax(0,1fr) minmax(380px,.72fr); gap:80px; align-items:end; padding:76px 0 64px; }
.on-social-copy small { color:#85868c; font-size:10px; }
.on-social-copy h2 { max-width:760px; margin:18px 0 20px; font-size:clamp(42px,5.1vw,70px); font-weight:600; line-height:1.02; letter-spacing:-.06em; }
.on-social-copy p { margin:0; color:#74757b; font-size:13px; line-height:1.7; }
.on-social-body dl { display:grid; grid-template-columns:repeat(3,1fr); margin:0; }
.on-social-body dl > div { min-height:140px; display:flex; flex-direction:column; justify-content:space-between; padding:22px; border-left:1px solid var(--on-line); }
.on-social-body dd { margin:0; font-size:clamp(44px,4.4vw,62px); font-weight:590; line-height:1; letter-spacing:-.055em; }
.on-social-body dt { color:#85868c; font-size:10px; }
.on-social-card > footer { padding-top:22px; border-top:1px solid var(--on-line); color:#92939a; font-size:9px; letter-spacing:.08em; }
.on-footer { color:#858791; background:#090a0d; }
.on-footer > div { min-height:140px; display:grid; grid-template-columns:1fr auto 1fr; gap:30px; align-items:center; border-top:1px solid #25262c; }
.on-footer b { color:white; font-size:12px; letter-spacing:.14em; }
.on-footer span { font-size:7px; letter-spacing:.12em; }
.on-footer a { position:relative; width:35px; height:35px; justify-self:end; border:1px solid #36373e; border-radius:50%; }
.on-footer a i::before { content:""; position:absolute; top:10px; left:16px; width:1.5px; height:13px; background:#8d8f99; }
.on-footer a i::after { content:""; position:absolute; top:10px; left:13px; width:7px; height:7px; border-top:1.5px solid #8d8f99; border-left:1.5px solid #8d8f99; transform:rotate(45deg); }

@media (min-width:1001px) {
  .on-nav { grid-template-columns:82px 1fr auto; }
  .on-back { width:max-content; white-space:nowrap; }
  .on-demo-jumps a { min-height:70px; padding:15px 18px; }
  .on-demo-jumps a > i { width:32px; height:32px; }
  .on-demo-jumps b { font-size:12px; }
  .on-demo-jumps small { font-size:7.5px; }
  .on-section-head { grid-template-columns:minmax(0,1fr) 430px; column-gap:60px; }
  .on-node-strip b { font-size:26px; }
  .on-module-grid h3 { font-size:42px; }
  .on-module-grid p { font-size:13px; }
  .on-mobile-film figcaption span { max-width:520px; font-size:clamp(30px,3.4vw,48px); }
  .on-closing h2 > span.on-heading-line { margin-bottom:22px; color:rgba(255,255,255,.9); font-size:14px; font-weight:760; line-height:1.2; letter-spacing:.06em; }
}

@media (min-width:1200px) {
  .on-mobile-film figcaption span { white-space:nowrap; }
}

@media (max-width:1000px) {
  .on-section-head { grid-template-columns:1fr; gap:30px; }
  .on-section-head .on-index { grid-column:1; }
  .on-section-head > p:last-child { margin:0; }
  .on-node-strip { grid-template-columns:1fr; }
  .on-node-strip > i { width:1px; height:42px; justify-self:center; }
  .on-session-pair { grid-template-columns:280px 1fr; }
  .on-desktop-demo > header { grid-template-columns:1fr; gap:25px; }
  .on-desktop-demo > header small { grid-column:1; }
  .on-module-grid article { grid-template-columns:1fr; }
  .on-phone-gallery { grid-template-columns:repeat(2,1fr); row-gap:55px; }
}

@media (max-width:700px) {
  html { scroll-behavior:auto; }
  .on-shell { width:calc(100% - 38px); }
  .on-header { height:64px; }
  .on-nav { width:calc(100% - 30px); grid-template-columns:auto 1fr auto; gap:14px; }
  .on-nav { position:relative; }
  .on-back { width:max-content; white-space:nowrap; font-size:10px; }
  .on-brand { position:absolute; left:50%; transform:translateX(-50%); }
  .on-links { grid-column:3; justify-self:end; }
  .on-brand span,.on-links > a { display:none; }
  .on-brand b { font-size:11px; }
  .on-hero { min-height:100svh; padding:104px 0 34px; }
  .on-kicker { margin-bottom:28px; font-size:7px; }
  .on-hero h1 { font-size:clamp(49px,13vw,57px); line-height:.93; letter-spacing:-.064em; }
  .on-lead { margin:42px 0 0; font-size:14px; line-height:1.72; }
  .on-demo-jumps { gap:8px; margin-top:24px; }
  .on-demo-jumps a { min-height:58px; gap:10px; padding:10px 11px; border-radius:9px; }
  .on-demo-jumps a > i { width:26px; height:26px; }
  .on-demo-jumps b { font-size:10px; }
  .on-demo-jumps small { font-size:6px; letter-spacing:.08em; }
  .on-product-stage { min-height:610px; padding:78px 14px 95px; }
  .on-stage-inner { min-height:430px; }
  .on-browser-hero { width:100%; transform:none; border-radius:8px; }
  .on-browser-bar { height:24px; }
  .on-browser-bar span { font-size:6px; }
  .on-phone-hero { right:7px; bottom:18px; width:112px; border-width:3px; border-radius:19px; }
  .on-phone { padding:8px 1px 7px; }
  .on-phone::before { bottom:2px; height:1.5px; }
  .on-phone-hero::after { border-radius:15px; }
  .on-phone-speaker { top:4px; width:28px; height:2px; }
  .on-stage-note { bottom:0; }
  .on-statement { min-height:610px; padding-block:105px; }
  .on-statement h2,.on-section-head h2,.on-closing h2 { font-size:43px; line-height:1.02; letter-spacing:-.055em; }
  .on-statement h2 { font-size:clamp(33px,9vw,37px); }
  .on-terminal .on-section-head h2 { font-size:clamp(36px,9.6vw,39px); }
  .on-closing h2 { font-size:clamp(36px,9.7vw,40px); }
  .on-heading-line { white-space:nowrap; }
  .on-statement > p:last-child,.on-section-head > p:last-child { margin:34px 0 0; font-size:13px; }
  .on-dark,.on-section,.on-terminal,.on-ops,.on-mobile,.on-closing { padding-top:105px; padding-bottom:105px; }
  .on-node-strip { margin-top:58px; }
  .on-node-strip article { min-height:135px; }
  .on-browser-modal,.on-browser-wide,.on-browser-terminal { border-radius:8px; }
  .on-browser-wide { margin-top:58px; }
  .on-session-mobile-story { grid-template-columns:1fr; gap:0; margin-top:22px; }
  .on-session-mobile-story .on-phone { width:230px; justify-self:center; }
  .on-session-mobile-story figcaption { width:100%; justify-self:center; margin-top:24px; text-align:center; }
  .on-session-mobile-story h3 { margin:16px 0 12px; font-size:30px; line-height:1.03; white-space:nowrap; }
  .on-session-mobile-story p { max-width:300px; margin-inline:auto; font-size:12px; }
  .on-copy-card { min-height:260px; padding:25px; }
  .on-copy-card h3 { font-size:32px; }
  .on-video-slot { min-height:280px; padding:24px; }
  .on-video-slot b { font-size:26px; }
  .on-video-player figcaption { align-items:start; flex-direction:column; gap:7px; padding:15px 17px 17px; }
  .on-desktop-demo { margin-top:82px; padding:34px 18px 18px; border-radius:12px; }
  .on-desktop-demo h3 { margin-top:20px; font-size:37px; line-height:1.04; }
  .on-desktop-demo header p { margin-top:0; font-size:12px; }
  .on-desktop-demo .on-video-wide { margin-top:34px; }
  .on-terminal-grid { grid-template-columns:1fr; margin-top:58px; }
  .on-terminal-grid > .on-phone { width:230px; justify-self:center; }
  .on-terminal-meta,.on-browser-terminal-menu,.on-video-dark { grid-column:1; }
  .on-module-grid { margin-top:58px; }
  .on-module-grid article { min-height:0; gap:40px; padding:24px; }
  .on-module-grid h3 { margin-top:45px; font-size:31px; }
  .on-ops-gallery { grid-template-columns:1fr; margin-top:58px; }
  .on-ops-gallery figcaption { padding:20px; }
  .on-phone-gallery { grid-template-columns:1fr 1fr; gap:12px; row-gap:42px; margin-top:58px; }
  .on-phone-gallery .on-phone { border-width:4px; border-radius:24px; }
  .on-phone-gallery .on-phone::after { border-radius:20px; }
  .on-video-mobile { min-height:420px; margin-top:62px; }
  .on-mobile-film { min-height:0; grid-template-columns:1fr; gap:38px; margin-top:62px; padding:42px 22px 34px; border-radius:12px; }
  .on-mobile-film-device { width:min(100%,280px); padding:11px 4px 10px; border-width:5px; border-radius:37px; }
  .on-mobile-film-device::after { border-radius:31px; }
  .on-mobile-film-device video { border-radius:27px; }
  .on-mobile-film-speaker { top:6px; width:45px; height:3px; }
  .on-mobile-film figcaption { gap:9px; text-align:center; }
  .on-mobile-film figcaption small { font-size:7px; }
  .on-mobile-film figcaption span { font-size:22px; }
  .on-closing p { margin:44px 0 0; font-size:13px; }
  .on-social-proof { padding-top:78px; padding-bottom:95px; }
  .on-social-card { padding:22px 20px 20px; border-radius:10px; }
  .on-social-card > header { gap:12px; }
  .on-social-card > header > span { max-width:190px; font-size:7px; line-height:1.5; letter-spacing:.1em; }
  .on-social-card > header b { gap:7px; font-size:8px; white-space:nowrap; }
  .on-social-arrow { width:12px; height:12px; font-size:15px; }
  .on-social-body { grid-template-columns:1fr; gap:42px; padding:58px 0 42px; }
  .on-social-copy small { font-size:8px; }
  .on-social-copy h2 { margin:15px 0 18px; font-size:33px; line-height:1.06; }
  .on-social-copy p { max-width:290px; font-size:11px; }
  .on-social-body dl > div { min-height:95px; padding:14px 13px; }
  .on-social-body dl > div:first-child { border-left:0; }
  .on-social-body dd { font-size:37px; }
  .on-social-body dt { font-size:8px; }
  .on-social-card > footer { padding-top:17px; font-size:7px; line-height:1.6; }
  .on-footer > div { grid-template-columns:1fr auto; min-height:120px; }
  .on-footer span { display:none; }
}

@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
}