.npn-video-examples { --example-gold:#d9b77b; --example-ink:#102f33; margin-block:clamp(40px,6vw,92px); scroll-margin-top:100px; }
.npn-examples-heading { display:flex; justify-content:space-between; align-items:end; gap:32px; margin-bottom:28px; }
.npn-examples-heading > div { max-width:760px; }
.npn-examples-heading h2 { margin:9px 0 15px; font:700 clamp(30px,3.5vw,58px)/1.08 'Fraunces',Georgia,serif; letter-spacing:-.035em; }
.npn-examples-heading p { max-width:680px; line-height:1.7; }
.npn-examples-kicker { font-size:11px; font-weight:800; letter-spacing:.16em; text-transform:uppercase; }
.npn-examples-link { flex-shrink:0; color:inherit; text-underline-offset:5px; font-size:13px; font-weight:700; padding:12px 0; }
.npn-model-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; }
.npn-model-card { min-width:0; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,.92fr); align-items:center; background:linear-gradient(135deg,#16494a,#09272d); color:#fff8e9; border:1px solid #cdb17e77; border-radius:24px; overflow:hidden; }
.npn-model-card--premium { background:linear-gradient(135deg,#402c34,#222b32); }
.npn-model-visual { position:relative; width:100%; max-width:384px; aspect-ratio:9/16; background:#0b2628; justify-self:center; align-self:center; }
.npn-model-visual video { position:absolute; inset:0; display:block; width:100%; height:100%; object-fit:contain; }
.npn-model-badge { position:absolute; top:15px; left:15px; right:15px; width:max-content; max-width:calc(100% - 30px); padding:8px 12px; border:1px solid #e6ca92aa; border-radius:99px; color:#fff4dc; background:#103337e8; font-size:10px; font-weight:800; line-height:1.4; letter-spacing:.05em; }
.npn-model-copy { padding:clamp(18px,2.2vw,36px); min-width:0; }
.npn-model-copy .npn-model-name { color:#ecd3a8; font-size:11px; font-weight:800; letter-spacing:.13em; text-transform:uppercase; }
.npn-model-copy h3 { margin:13px 0 16px; font:700 clamp(24px,2.1vw,36px)/1.13 'Fraunces',Georgia,serif; letter-spacing:-.025em; color:#fff8e9; }
.npn-model-copy p { color:#e8e2d5; line-height:1.75; font-size:13px; margin:0 0 20px; }
.npn-example-audio { display:inline-flex; align-items:center; justify-content:center; padding:12px 17px; min-height:44px; border:1px solid #dbc18d; background:#fff5df; color:#163839; border-radius:99px; font:700 12px/1.3 Inter,sans-serif; cursor:pointer; }
.npn-example-audio[hidden] { display:none; }
.npn-example-audio:hover { background:#edd6ad; }
.npn-example-audio:focus-visible,.npn-examples-link:focus-visible { outline:3px solid #bd8233; outline-offset:5px; }
.npn-example-status { display:block; margin-top:15px; color:#f3d6a2; font-size:11px; font-weight:700; line-height:1.6; }
.npn-example-disclosure { margin:18px 0 0; font-size:11px; line-height:1.7; opacity:.8; max-width:860px; }
[data-story-surface="sales"] .npn-video-examples { color:#153335; }
[data-story-surface="workspace"] .npn-video-examples { margin-block:32px 42px; }
[data-story-surface="workspace"] .npn-examples-heading h2 { font-size:clamp(28px,3vw,43px); }
[data-story-surface="workspace"] .npn-model-grid { gap:18px; }
[data-story-surface="workspace"] .npn-model-copy { padding:20px; }
[data-story-surface="workspace"] .npn-model-copy h3 { font-size:27px; }
@media(min-width:1900px) { .npn-model-card { grid-template-columns:minmax(0,.9fr) minmax(0,1fr); } .npn-model-copy p { font-size:16px; } .npn-model-copy { padding:48px; } }
@media(max-width:1100px) { .npn-model-grid { grid-template-columns:1fr; } .npn-model-card { grid-template-columns:minmax(220px,.7fr) minmax(0,1fr); } .npn-model-visual { max-width:300px; } .npn-model-copy h3 { font-size:32px; } }
@media(max-width:560px) { .npn-examples-heading { display:block; } .npn-examples-heading h2 { font-size:34px; } .npn-examples-heading p { font-size:14px; } .npn-examples-link { display:inline-block; } .npn-model-card { grid-template-columns:1fr; } .npn-model-visual { max-width:300px; } .npn-model-copy { padding:24px; } .npn-model-copy h3 { font-size:30px; } .npn-model-badge { font-size:9px; } .npn-model-copy p { font-size:13px; } }