:root{--na-panel:#18232d;--na-manuscript:#1e1e1e;--na-control:#202c37;--na-text:#d4d4d4;--na-blue:#3b82b6;--na-teal:#4fa7a0;--na-teal-text:#62b5ae;--na-retake:#c94b52}*{box-sizing:border-box}html{scroll-behavior:smooth}body{background:var(--na-panel);color:var(--na-text);margin:0;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;overflow-x:hidden}a{color:inherit;text-decoration:none}.site-header{z-index:100;background:#18232df5;border-bottom:1px solid #d4d4d40f;justify-content:space-between;align-items:center;height:76px;padding:0 42px;display:flex;position:fixed;top:0;left:0;right:0}.main-nav{align-items:center;gap:34px;display:flex}.nav-links{flex-wrap:wrap;flex:1;justify-content:space-evenly;align-items:center;gap:34px;display:flex}.main-nav a{color:#d4d4d4b8;font-size:14px;font-weight:500;transition:color .16s}.main-nav a:hover{color:#d4d4d4}.header-button{color:#d4d4d4;width:128px;height:42px;box-shadow:none;background:linear-gradient(#323e49 0%,#202c37 16%,#1c2732 72%,#18232d 100%) padding-box padding-box,linear-gradient(#4b5964 0%,#39454f 15%,#2a323b 50%,#18232d 100%) border-box;border:1px solid #0000;border-radius:10px;justify-content:center;align-items:center;font-size:14px;font-weight:600;transition:filter .16s,transform .12s;display:flex;position:relative;overflow:hidden}.header-button:before{content:"";pointer-events:none;z-index:1;background:linear-gradient(90deg,#fff0,#ffffff1a 20%,#fff3 50%,#ffffff1a 80%,#fff0);height:2px;position:absolute;top:0;left:7%;right:7%}.header-button:hover{filter:brightness(1.06)}.header-button:active{filter:brightness(.98);transform:translateY(1px)}main{width:100%}.hero-frame{background:linear-gradient(#4b5964 0%,#39454f 15%,#2a323b 50%,#18232d 100%);border-radius:24px;width:min(1440px,100%);padding:1px}.hero-surface{background:linear-gradient(#323e49 0%,#202c37 16%,#1c2732 72%,#18232d 100%);border-radius:23px;justify-content:center;align-items:flex-start;width:100%;height:auto;display:flex;position:relative;overflow:hidden}.hero-surface:before{content:"";pointer-events:none;z-index:1;background:linear-gradient(90deg,#fff0,#ffffff1a 20%,#fff3 50%,#ffffff1a 80%,#fff0);height:2px;position:absolute;top:0;left:6%;right:6%}.hero-content{padding-top:46px;padding-bottom:80px}.hero-brand{color:#3b82b6;letter-spacing:.24em;margin:0 0 34px;font-size:13px;font-weight:600}.hero-content h1{color:#d4d4d4;letter-spacing:-.045em;flex-direction:column;max-width:900px;margin:0;font-size:clamp(56px,7vw,96px);font-weight:500;line-height:.98;display:flex}.hero-content h1 span{display:block}.na-button{color:#d4d4d4;width:min(310px,100%);height:150px;box-shadow:none;background:linear-gradient(#323e49 0%,#202c37 16%,#1c2732 72%,#18232d 100%) padding-box padding-box,linear-gradient(#4b5964 0%,#39454f 15%,#2a323b 50%,#18232d 100%) border-box;border:1px solid #0000;border-radius:10px;flex-shrink:0;justify-content:center;align-items:center;gap:28px;padding:0 30px;font-size:23px;font-weight:600;transition:filter .16s,transform .12s;display:flex;position:relative;overflow:hidden}.na-button:before{content:"";pointer-events:none;z-index:1;background:linear-gradient(90deg,#fff0,#ffffff1a 20%,#fff3 50%,#ffffff1a 80%,#fff0);height:2px;position:absolute;top:0;left:6%;right:6%}.na-button>*{z-index:2;position:relative}.na-button .arrow{font-size:39px;font-weight:300;line-height:1}.na-button:hover{filter:brightness(1.06)}.na-button:active{filter:brightness(.98);transform:translateY(1px)}.na-button.retake{border:2px solid var(--na-retake);color:#d4d4d4;background:linear-gradient(#323e49 0%,#202c37 16%,#1c2732 72%,#18232d 100%)}.na-button.retake .arrow{color:var(--na-retake)}.scroll-cue{color:#d4d4d46b;cursor:pointer;flex-direction:column;align-items:center;gap:10px;transition:color .16s;display:flex}.scroll-cue:hover{color:#d4d4d4b8}.scroll-line{background:linear-gradient(#d4d4d480,#d4d4d400);width:1px;height:32px}.scroll-arrow{border-bottom:1px solid;border-right:1px solid;width:7px;height:7px;transform:rotate(45deg)}.scroll-arrow.up{transform:rotate(225deg)}.hero-section,.placeholder-section{justify-content:center;align-items:center;min-height:100vh;padding:108px 34px 34px;display:flex}.placeholder-surface{box-sizing:border-box;background:linear-gradient(#323e49 0%,#202c37 16%,#1c2732 72%,#18232d 100%) padding-box padding-box,linear-gradient(#4b5964 0%,#39454f 15%,#2a323b 50%,#18232d 100%) border-box;border:1px solid #0000;border-radius:24px;justify-content:center;align-items:flex-start;width:min(1440px,100%);display:flex;position:relative;overflow:hidden}.placeholder-surface:before{content:"";pointer-events:none;z-index:1;background:linear-gradient(90deg,#fff0,#ffffff1a 20%,#fff3 50%,#ffffff1a 80%,#fff0);height:2px;position:absolute;top:0;left:6%;right:6%}.hero-frame{height:auto;min-height:clamp(560px,44vw,680px)}.hero-surface,.placeholder-surface{min-height:clamp(560px,44vw,680px)}.placeholder-content{box-sizing:border-box;text-align:center;flex-direction:column;justify-content:flex-start;align-items:center;width:min(1400px,100%);height:auto;padding:30px 24px 80px;display:flex;container-type:inline-size}.placeholder-surface>*{max-width:100%}.workflow-eyebrow{color:#3b82b6;letter-spacing:.3em;margin:0 0 20px;font-size:13px;font-weight:600;line-height:1}.workflow-heading{text-align:center;flex:none;width:100%}.modes-heading{flex:none;width:100%}.recovery-content{text-align:center;flex-direction:column;justify-content:flex-start;align-items:center;display:flex}.retake-button{background:linear-gradient(#323e49 0%,#202c37 16%,#1c2732 72%,#18232d 100%) padding-box padding-box,linear-gradient(#ff4b5c 0% 50%,#d93648 100%) border-box;border-color:#ff4b5c;flex-direction:column;gap:14px;margin-bottom:34px;padding:20px}.retake-title{z-index:2;color:#d4d4d4;font-size:18px;font-weight:600;line-height:1;position:relative}.retake-icon{flex:none;width:46px;height:46px;display:block}.retake-button:hover{filter:brightness(1.08)}.retake-button:active{transform:translateY(1px)}.mode-button{flex-direction:column;gap:0;padding:28px 24px 24px}.mode-icon{z-index:2;color:#3b82b6;justify-content:center;align-items:center;width:58px;height:58px;margin:0 0 25px;display:flex;position:relative}.mode-icon span{font-size:42px;font-weight:400;line-height:1;display:block}.annotation-icon{color:#3b82b6}.recording-icon{color:#ff4b5c}.mode-title{z-index:2;color:#d4d4d4;font-size:18px;font-weight:600;line-height:1.35;position:relative}.mode-description{z-index:2;color:#d4d4d4c7;margin-top:14px;font-size:15px;font-weight:400;line-height:1.45;position:relative}.workflow-button.na-button{text-align:center;min-width:0;font-size:inherit;font-weight:inherit;border-radius:10px;flex-direction:column;justify-content:flex-start;align-items:center;gap:0;padding:28px 18px 24px;display:flex}.workflow-icon{z-index:2;color:#3b82b6;justify-content:center;align-items:center;width:58px;height:58px;margin:0 0 25px;display:flex;position:relative}.workflow-icon svg{width:100%;height:100%;display:block}.prepare-icon{color:#3b82b6;transform:rotate(180deg)}.retake-icon{color:#f04b50}.waveform-icon{color:var(--na-blue)}.workflow-title{z-index:2;color:#d4d4d4;margin:0;font-size:18px;font-weight:600;line-height:1.35;position:relative}.workflow-description{z-index:2;color:#d4d4d4c7;margin-top:14px;font-size:15px;font-weight:400;line-height:1.45;position:relative}.section-subtext{color:#d4d4d4b8;letter-spacing:-.015em;flex:none;width:min(760px,100%);margin-top:20px;font-size:clamp(18px,2vw,24px);font-weight:400;line-height:1.5}.button-row{flex:none;justify-content:center;gap:28px;width:100%;display:grid}.placeholder-content>.button-row{margin-top:20px}.button-row-1{grid-template-columns:min(310px,100%)}.button-row-2{grid-template-columns:repeat(2,min(310px,100%))}.button-row-4{grid-template-columns:repeat(4,min(310px,100%))}@container (width<=1323px){.button-row-4{grid-template-columns:repeat(2,min(310px,100%));row-gap:10px}}@container (width<=647px){.button-row-4,.button-row-2{grid-template-columns:min(310px,100%);row-gap:10px}}.placeholder-surface p{box-sizing:border-box}.placeholder-surface>.placeholder-content{max-width:100%}.hero-section,.placeholder-section{scroll-snap-align:center;scroll-snap-stop:normal}html{scroll-snap-type:y proximity}.hero-surface .scroll-cue,.placeholder-surface .scroll-cue{position:absolute;bottom:24px;left:50%;transform:translate(-50%)}@media (width<=1100px){.hero-content h1{font-size:clamp(52px,7vw,76px)}.hero-content p{max-width:760px}}@media (width<=900px){.site-header{padding:0 24px}.main-nav,.nav-links{gap:18px}.main-nav a{font-size:12px}.hero-section,.placeholder-section{padding-left:20px;padding-right:20px}}@media (width<=900px) and (width>=651px){.hero-surface,.placeholder-surface{padding-left:28px;padding-right:28px}.hero-surface{padding-top:50px;padding-bottom:50px}.placeholder-content{padding-top:22px}.hero-content{padding-top:38px}.hero-content h1{font-size:clamp(48px,7vw,68px)}.hero-content p{max-width:650px;font-size:17px}.placeholder-surface h2{font-size:clamp(34px,5vw,48px)}}@media (width<=650px){.site-header{height:64px;padding:0 14px}.nav-links{display:none}.header-button{width:110px;height:38px}.hero-frame,.placeholder-surface{height:auto;min-height:0}.hero-surface{height:auto;min-height:0;padding-top:42px;padding-bottom:42px}.hero-content{padding-top:60px;padding-bottom:80px}.hero-brand{margin-bottom:26px;font-size:11px}.hero-content h1{font-size:clamp(40px,12vw,58px);line-height:.98}.section-subtext{font-size:16px}.hero-section,.placeholder-section{min-height:0;padding:88px 14px 20px}.hero-surface,.placeholder-surface{padding-left:18px;padding-right:18px}.placeholder-surface{border-radius:20px;width:100%;min-height:0}.workflow-content,.modes-content{height:auto}.workflow-content h2{font-size:38px}.placeholder-content{width:100%;height:auto;padding-top:18px;padding-left:18px;padding-right:18px}}.workflow-content h2,.modes-heading h2,.placeholder-content h2{color:#d4d4d4;letter-spacing:-.035em;margin:0;font-size:clamp(42px,4.5vw,60px);font-weight:700;line-height:1.05}@media (width<=900px) and (width>=651px){.hero-section,.placeholder-section{height:auto;min-height:100vh}.hero-frame,.placeholder-surface,.hero-surface{height:auto;min-height:560px}.hero-content,.placeholder-content{height:auto}}.site-footer{border-top:1px solid #d4d4d412;padding:60px 34px 34px}.footer-inner{flex-wrap:wrap;justify-content:space-between;gap:48px;width:min(1200px,100%);margin:0 auto;display:flex}.footer-brand{max-width:320px}.footer-logo{color:#d4d4d4;letter-spacing:.24em;margin:0 0 12px;font-size:15px;font-weight:600}.footer-tagline{color:#d4d4d4b8;margin:0;font-size:15px;line-height:1.5}.footer-columns{flex-wrap:wrap;gap:48px;display:flex}.footer-column{flex-direction:column;min-width:140px;display:flex}.footer-column a{color:#d4d4d4b8;margin-bottom:10px;font-size:14px;transition:color .16s}.footer-column a:last-child{margin-bottom:0}.footer-column a:hover{color:#d4d4d4}.footer-bottom{color:#d4d4d46b;text-align:center;border-top:1px solid #d4d4d412;width:min(1200px,100%);margin:40px auto 0;padding-top:24px;font-size:12px}@media (width<=900px){.footer-inner{flex-direction:column;gap:32px}.footer-columns{gap:32px}}@media (width<=650px){.site-footer{padding:40px 14px 20px}.footer-columns{flex-direction:column;gap:24px}}.retake-screenshot{background:var(--na-manuscript);color:#d4d4d466;letter-spacing:.05em;text-align:center;border:1px solid #d4d4d41f;border-radius:16px;justify-content:center;align-items:center;width:100%;max-width:760px;height:clamp(120px,16vw,200px);margin-top:20px;padding:16px;font-size:13px;display:flex}.retake-screenshot--large{max-width:100%;height:clamp(160px,22vw,280px)}.workflow-product-frame{box-sizing:border-box;border:1px solid #d4d4d41f;border-radius:16px;max-width:100%;margin:20px auto 0;padding:10px;display:table}.workflow-product-image{object-fit:contain;border-radius:8px;width:auto;max-width:100%;height:auto;max-height:clamp(200px,28vw,300px);display:block}.workflow-product-image--prominent{min-height:clamp(160px,22vw,240px)}.workflow-product-placeholder{aspect-ratio:16/9;box-sizing:border-box;background:var(--na-manuscript);color:#d4d4d466;letter-spacing:.05em;text-align:center;border-radius:8px;justify-content:center;align-items:center;width:100%;max-width:533px;padding:16px;font-size:13px;display:flex}.workflow-product-placeholder--4-3{aspect-ratio:4/3;max-width:400px}.workflow-detail{margin-top:10px}.workflow-video-frame{box-sizing:border-box;border:1px solid #d4d4d41f;border-radius:16px;width:100%;max-width:880px;margin:20px auto 0;padding:10px}.workflow-video{aspect-ratio:16/9;object-fit:contain;background:#000;border-radius:8px;width:100%;height:auto;display:block}
