.n1-experience{padding:100px 0 88px;background:radial-gradient(ellipse at 50% 58%,#eaf0f8 0%,transparent 66%),linear-gradient(180deg,#fbfcfe 0%,#f4f7fb 64%,#f8fafc 100%);scroll-margin-top:30px}
.n1-experience #n1-app-demo{scroll-margin-top:40px}
.n1-experience-heading{max-width:760px;margin:0 auto 44px;text-align:center}
.n1-experience-heading .eyebrow{margin-bottom:18px;font-size:12px;letter-spacing:.14em}
.n1-experience-heading h2{font-size:clamp(34px,3.8vw,48px);font-weight:500;line-height:1.28;letter-spacing:-.045em}
.n1-experience-heading>p:last-child{max-width:650px;margin:22px auto 0;font-size:15px;line-height:1.9;color:#718092}
.n1-app-demo{width:min(100%,1000px);margin:0 auto}
.n1-app-tabs{display:flex;align-items:stretch;justify-content:center;gap:38px;margin-bottom:28px;border-bottom:1px solid #dce4ed}
.n1-app-tabs button{position:relative;min-height:49px;padding:12px 3px 16px;background:none;border-bottom:2px solid transparent;font-size:13px;line-height:1.5;color:#8290a0}
.n1-app-tabs button[aria-selected="true"]{color:#24568a;border-bottom-color:#3d7cc0}
.n1-app-tabs button:hover{color:#24568a}
.n1-app-panel{margin:0}
.n1-app-panel[hidden]{display:none}
.n1-app-panel-copy{display:flex;justify-content:space-between;align-items:flex-start;gap:28px;min-height:75px;margin-bottom:24px}
.n1-app-panel-copy h3{flex:0 1 43%;font-size:20px;font-weight:500;line-height:1.5;letter-spacing:-.025em}
.n1-app-panel-copy p{flex:0 1 52%;font-size:14px;line-height:1.85;color:#5f6f82}
.n1-app-capture{position:relative;display:block;width:100%;padding:0;background:none;cursor:zoom-in;text-align:left}
.n1-app-capture .app-window-surface{--app-radius:14px}
.n1-app-capture img{display:block;width:100%;height:auto}
.n1-app-capture:hover .app-window-surface{border-color:#8397ae}
.n1-app-zoom{position:absolute;right:17px;bottom:16px;z-index:3;display:inline-flex;align-items:center;gap:7px;padding:9px 12px;border:1px solid #dbe4ee;border-radius:24px;background:#ffffffed;box-shadow:0 3px 12px #304c6c16;font-size:12px;line-height:1.4;color:#36587c;opacity:0;transform:translateY(3px);transition:opacity .2s,transform .2s;pointer-events:none}
.n1-app-zoom svg{width:14px;height:14px;flex:none}
.n1-app-capture:hover .n1-app-zoom,.n1-app-capture:focus-visible .n1-app-zoom{opacity:1;transform:none}
.n1-app-note{margin-top:22px;font-size:12px;line-height:1.8;color:#637489;text-align:center}
.n1-experience-links{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:16px 32px;margin-top:22px}
.n1-experience-links .text-link{font-size:12px}
@media(max-width:800px){
  body[data-page="n1"] .related .family-item:nth-child(5){grid-column:1/-1;width:100%;max-width:160px;justify-self:center;transform:none}
  .n1-experience{padding:62px 0 54px;scroll-margin-top:20px}
  .n1-experience-heading{text-align:left;margin-bottom:28px}
  .n1-experience-heading .eyebrow{font-size:12px;margin-bottom:16px}
  .n1-experience-heading h2{font-size:32px;line-height:1.3}
  .n1-experience-heading>p:last-child{margin-top:20px;font-size:13px;line-height:1.9}
  .n1-experience #n1-app-demo{scroll-margin-top:24px}
  .n1-app-tabs{gap:0;justify-content:space-between;margin-bottom:24px}
  .n1-app-tabs button{min-height:46px;flex:1;min-width:0;padding:12px 4px 14px;font-size:12px;line-height:1.5}
  html[lang="en"] .n1-app-tabs button:first-child{flex:1.3}
  .n1-app-panel-copy{display:block;min-height:116px;margin-bottom:19px}
  .n1-app-panel-copy h3{font-size:19px;line-height:1.5}
  .n1-app-panel-copy p{margin-top:10px;font-size:13px;line-height:1.85}
  .n1-app-capture .app-window-surface{--app-radius:9px}
  .n1-app-zoom{position:static;display:flex;justify-content:center;flex-wrap:wrap;gap:7px;min-height:44px;opacity:1;transform:none;margin:16px auto 0;padding:10px 16px;width:fit-content;background:#fff;border:1px solid #d3dfed;border-radius:24px;box-shadow:0 3px 12px #304c6c0a;font-size:12px;color:#365d86}
  .n1-app-note{text-align:left;margin-top:20px;font-size:12px}
  .n1-experience-links{justify-content:flex-start;gap:14px 24px;margin-top:18px}
  .n1-experience-links .text-link{font-size:12px}
}
@media(hover:none){.n1-app-zoom{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.n1-app-zoom{transition:none}}
