
:root{--navy:#10233e;--blue:#2563eb;--blue2:#154add;--light:#f6f9fe;--line:#e4ebf5;--muted:#667893;--ink:#142743;--radius:20px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:"DM Sans",system-ui,sans-serif;color:var(--ink);line-height:1.65;background:#fff;overflow-x:hidden}h1,h2,h3,p{margin-top:0}h1,h2,h3{font-family:Manrope,"DM Sans",sans-serif;line-height:1.17;letter-spacing:-.045em}h1{font-size:clamp(2.4rem,4.6vw,4.7rem)}h2{font-size:clamp(1.85rem,3vw,3.15rem)}h3{font-size:1.18rem}a{color:inherit}img{max-width:100%}.container{width:min(1190px,calc(100% - 48px));margin:0 auto}.skip-link{position:absolute;top:-60px;left:12px;background:#fff;padding:12px;z-index:10000}.skip-link:focus{top:10px}.site-header{position:sticky;top:0;z-index:100;background:rgba(255,255,255,.96);backdrop-filter:blur(18px);border-bottom:1px solid #e9edf4}.nav-shell{width:min(1230px,calc(100% - 48px));margin:auto;display:flex;align-items:center;justify-content:space-between;min-height:86px;gap:24px}.brand{display:inline-flex;align-items:center;gap:11px;text-decoration:none;white-space:nowrap}.brand img{width:44px;height:44px;object-fit:contain}.brand strong{font-family:Manrope,sans-serif;font-size:20px;font-weight:850;letter-spacing:-.07em;display:block;line-height:1.05}.brand small{display:block;font-size:9px;letter-spacing:.12em;color:#7e8ba1;text-transform:uppercase;font-weight:750;margin-top:4px}.dot,.footer-logo span{color:var(--blue)}.nav-links{display:flex;align-items:center;gap:30px}.nav-links>a{text-decoration:none;color:#475b78;font-weight:700;font-size:13px;transition:color .2s}.nav-links>a:hover,.nav-links>a.current{color:var(--blue)}.nav-links .nav-cta{background:var(--blue);color:#fff;padding:12px 19px;border-radius:10px;box-shadow:0 7px 19px #2563eb25}.nav-links .nav-cta:hover{color:#fff;background:#184db8}.menu-toggle{display:none;background:transparent;border:0;width:44px;height:44px;padding:12px;cursor:pointer}.menu-toggle span{height:2px;background:#18345b;display:block;margin:5px 0}.hero{padding:92px 0 80px;background:linear-gradient(145deg,#f8fbff 0%,#fff 53%,#f2f7ff 100%);position:relative}.hero-grid{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:55px}.hero-copy{padding:10px 0}.pill{display:inline-flex;align-items:center;gap:9px;border:1px solid #cde0fb;background:#edf5ff;border-radius:40px;color:#2250a8;padding:8px 13px;font-size:11px;font-weight:800;letter-spacing:.04em;text-transform:uppercase}.pill-dot{height:7px;width:7px;border-radius:50%;background:#29a66b;box-shadow:0 0 0 4px #29a66b1a}.hero h1{margin:25px 0 22px;font-weight:850;max-width:670px}.hero h1 em,.page-intro h1 em{font-style:normal;color:var(--blue)}.lead{font-size:17px;line-height:1.8;color:#586c89;max-width:610px;margin-bottom:27px}.hero-actions,.intro-actions,.cta-buttons{display:flex;gap:13px;flex-wrap:wrap;align-items:center}.btn{display:inline-flex;justify-content:center;align-items:center;gap:12px;padding:14px 21px;border-radius:10px;text-decoration:none;font-size:13px;font-weight:850;line-height:1.3;transition:transform .16s,background .16s;min-height:47px}.btn:hover{transform:translateY(-2px)}.btn-primary{background:var(--blue);color:#fff;box-shadow:0 8px 22px #2563eb21}.btn-primary:hover{background:var(--blue2)}.btn-outline{border:1px solid #cbd9eb;color:#285397;background:#fff}.btn-outline:hover{border-color:#8eafe6}.hero-points{display:flex;flex-wrap:wrap;gap:17px;color:#5d708a;font-weight:750;font-size:12px;margin-top:27px}.hero-visual{position:relative;padding:30px 0 20px}.visual-glow{position:absolute;inset:10% -10% 0 -10%;filter:blur(4px);background:radial-gradient(circle at 45% 45%,#a4cbff85 0%,#e4f1ff55 45%,transparent 70%);z-index:0}.dashboard-frame{position:relative;z-index:1;background:white;padding:10px;box-shadow:0 35px 85px #1b54a821;border:1px solid #dae5f4;border-radius:16px;transform:perspective(850px) rotateY(-3deg) rotateX(1deg)}.dashboard-frame img{width:100%;display:block;border-radius:8px}.dash-top{height:30px;display:flex;align-items:center;gap:6px;color:#8da0b9;font-size:10px;padding:0 7px}.dash-top>span:last-child{margin-left:8px}.dash-dot{height:6px;width:6px;background:#ced9e9;border-radius:50%}.floating-chip{position:absolute;z-index:2;bottom:-10px;right:-14px;display:flex;align-items:center;gap:12px;background:white;border:1px solid #edf1f6;padding:13px 17px;border-radius:14px;box-shadow:0 18px 40px #1b4a7b1c}.chip-icon{display:grid;place-items:center;width:39px;height:39px;border-radius:12px;color:#176ad9;background:#edf5ff;font-size:23px}.floating-chip strong{display:block;font-size:12px}.floating-chip small{display:block;color:#8595ab;font-size:10px}.trust-bar{border-top:1px solid #e9f0fa;border-bottom:1px solid #e9f0fa;background:#fff}.trust-inner{display:flex;align-items:center;justify-content:space-between;gap:30px;padding:25px 0;color:#5c718e;font-size:15px;font-weight:850}.trust-inner span:first-child{font-size:10px;letter-spacing:.13em;color:#a0aebf;max-width:155px}.section{padding:100px 0}.section-heading{max-width:700px;margin-bottom:44px}.section-heading.center{text-align:center;margin-left:auto;margin-right:auto}.section-heading.split{max-width:none;display:flex;align-items:end;justify-content:space-between;gap:25px}.eyebrow{font-size:11px;letter-spacing:.145em;color:var(--blue);font-weight:900;display:inline-block;margin-bottom:15px}.section-heading h2{margin-bottom:17px}.section-heading p,.feature-text>p,.screenshot-copy>p,.learning-grid p,.faq-grid>div>p{color:var(--muted);font-size:16px;line-height:1.85}.steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}.step{position:relative;border:1px solid #e4ecf6;border-radius:17px;padding:32px;background:#fff;transition:box-shadow .2s,transform .2s}.step:hover{box-shadow:0 18px 40px #1b54a818;transform:translateY(-3px)}.step-number{position:absolute;top:25px;right:28px;font-size:13px;color:#b6c6da;font-weight:800}.step-icon{display:grid;place-items:center;width:55px;height:55px;background:#eff5ff;border-radius:15px;color:#2563eb;font-size:29px;margin-bottom:25px}.step h3{font-size:19px;margin-bottom:12px}.step p{color:#667891;font-size:14px;margin:0;line-height:1.8}.feature-section{background:#f6f9ff}.feature-grid,.screenshot-grid,.learning-grid{display:grid;grid-template-columns:1fr 1fr;gap:86px;align-items:center}.feature-photo{position:relative;display:grid;place-items:center;min-height:430px;background:linear-gradient(150deg,#dcecff,#f8fbff);border-radius:25px;overflow:hidden}.feature-photo img{width:min(82%,420px);max-height:400px;object-fit:contain;filter:drop-shadow(0 28px 28px #274d9d2a)}.photo-label{position:absolute;bottom:22px;left:25px;border:1px solid #deebff;background:#ffffffed;padding:11px 17px;border-radius:11px;color:#31568e;font-size:12px;font-weight:850}.feature-text h2{margin-bottom:20px}.check-list{padding:0;margin:25px 0;list-style:none}.check-list li{position:relative;padding:9px 0 9px 30px;color:#506580;font-size:14px}.check-list li:before{content:'✓';position:absolute;left:0;top:8px;color:#248b5b;font-weight:900}.text-link{color:var(--blue);font-size:13px;font-weight:850;text-decoration:none}.text-link:hover{text-decoration:underline}.use-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:17px}.use-card{padding:27px;border-radius:17px;background:#f6f9fd;border:1px solid #ebf0f7;text-decoration:none;transition:transform .15s,background .15s}.use-card:hover{background:#edf5ff;transform:translateY(-3px)}.use-card>span{color:#2461d5;background:#e5efff;display:grid;place-items:center;width:48px;height:48px;border-radius:12px;font-size:25px;margin-bottom:27px}.use-card h3{font-size:17px}.use-card p{color:#6c7f98;font-size:13px;min-height:64px}.use-card b{font-size:12px;color:#2563eb}.screenshot-section{background:#f7faff}.mini-features{display:flex;gap:28px;flex-wrap:wrap;margin:27px 0 34px}.mini-features strong{display:block;font-size:15px}.mini-features span{font-size:12px;color:#7a8ca5}.screenshot-img{padding:11px;border:1px solid #dfebfa;background:#fff;border-radius:17px;box-shadow:0 28px 65px #153c8021}.screenshot-img img{display:block;width:100%;border-radius:8px}.article-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}.article-card{border:1px solid #e5edf6;background:#fff;border-radius:16px;overflow:hidden;display:flex;flex-direction:column;transition:transform .15s,box-shadow .15s}.article-card:hover{transform:translateY(-4px);box-shadow:0 17px 40px #1f49831b}.article-card-image{display:block;background:linear-gradient(135deg,#eaf3ff,#f4f9ff);height:210px;overflow:hidden;display:grid;place-items:center}.article-card-image img{width:100%;height:100%;object-fit:contain;padding:22px;transition:transform .2s}.article-card:hover img{transform:scale(1.04)}.article-card-content{padding:24px;display:flex;flex-direction:column;flex:1}.category{display:inline-block;color:#2563eb;font-size:10px;text-transform:uppercase;font-weight:850;letter-spacing:.1em;margin-bottom:12px}.article-card h3{font-size:18px;line-height:1.4;margin:0 0 11px}.article-card h3 a{text-decoration:none}.article-card h3 a:hover{color:var(--blue)}.article-card p{color:#6b7c93;font-size:13px;line-height:1.75;margin:0 0 18px;flex:1}.learning-banner{background:#f3f7fd}.learning-preview{min-height:265px;background:linear-gradient(130deg,#0e2d61,#2563eb);border-radius:24px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:9px;color:#fff;box-shadow:0 20px 46px #265bb62c}.learning-preview strong{font-size:20px}.learning-preview small{opacity:.7}.play-ring{height:70px;width:70px;border:2px solid #ffffffa3;border-radius:50%;display:grid;place-items:center;color:white;font-size:28px;padding-left:3px;margin-bottom:12px}.play-ring.compact{background:#2563eb;flex:none;height:58px;width:58px;font-size:18px}.faq-grid{display:grid;grid-template-columns:1fr 1.2fr;gap:90px}.faq-list details{border-bottom:1px solid #e2e9f3;padding:20px 0}.faq-list summary{font-weight:800;font-size:15px;cursor:pointer;list-style:none;padding-right:30px;position:relative}.faq-list summary:after{content:'+';position:absolute;right:0;color:#2a63d0;font-size:24px;top:-8px}.faq-list details[open] summary:after{content:'−'}.faq-list p{color:#687a91;font-size:14px;margin:13px 0 0}.cta-section{padding:0 0 85px}.cta-inner{background:linear-gradient(135deg,#0d2c65,#1d53c2 70%,#286ef2);color:#fff;border-radius:25px;text-align:center;padding:72px 30px;position:relative;overflow:hidden}.cta-inner:before,.cta-inner:after{content:'';position:absolute;border:1px solid #ffffff24;border-radius:50%;width:480px;height:480px;top:-260px;left:-180px}.cta-inner:after{left:auto;right:-190px;top:70px}.eyebrow.light{color:#9ec7ff}.cta-inner h2{max-width:710px;margin:0 auto 17px}.cta-inner p{max-width:650px;margin:0 auto 28px;color:#d9e8ff}.cta-buttons{justify-content:center}.btn-light{background:#fff;color:#174cc2}.btn-ghost{border:1px solid #ffffff70;color:#fff}.footer{background:#0d1d33;color:#c9d3e2;padding:68px 0 24px}.footer-top{display:grid;grid-template-columns:2fr 1fr 1fr;gap:75px;padding-bottom:60px}.footer-logo{font-size:26px;font-weight:900;text-decoration:none;color:#fff;letter-spacing:-.07em}.footer-top p{max-width:340px;color:#93a5bd;font-size:13px;line-height:1.9;margin:17px 0 0}.footer h3{font-size:13px;letter-spacing:0;color:#fff;margin:7px 0 23px}.footer-top>div:not(:first-child){display:flex;flex-direction:column;gap:12px}.footer-top a,.footer-top span{font-size:13px;color:#a9b9cd;text-decoration:none}.footer-top a:hover{color:#fff}.footer-bottom{display:flex;justify-content:space-between;border-top:1px solid #ffffff1b;padding-top:23px;gap:20px;font-size:11px;color:#8093ae}.page-intro{background:linear-gradient(155deg,#edf5ff,#fff);padding:95px 0 86px}.page-intro .container{max-width:900px}.page-intro h1{font-size:clamp(2.4rem,5vw,4.25rem)}.page-intro p{font-size:17px;color:#667b96;line-height:1.85;max-width:780px}.intro-actions{margin-top:25px}.filter-row{display:flex;justify-content:space-between;gap:25px;align-items:end;margin-bottom:40px}.filter-row h2{margin-bottom:0}.article-search{font:inherit;font-size:14px;border:1px solid #d8e3f2;outline-offset:2px;padding:14px 17px;min-width:330px;border-radius:12px}.article-hero{background:linear-gradient(145deg,#f2f7ff,#fff);padding:70px 0 85px}.article-hero-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:55px;align-items:center}.breadcrumbs{display:flex;align-items:center;gap:10px;font-size:12px;color:#7d8ba3;margin-bottom:34px;flex-wrap:wrap}.breadcrumbs a{text-decoration:none;color:#4b70ae}.article-hero h1{font-size:clamp(2.3rem,4.2vw,4rem)}.article-deck{color:#667b94;font-size:18px;line-height:1.75}.article-meta{font-size:12px;color:#98a5b6;margin:20px 0}.article-cover{min-height:330px;background:linear-gradient(130deg,#e0edff,#f7faff);border-radius:23px;display:grid;place-items:center;padding:35px}.article-cover img{max-height:360px;object-fit:contain}.article-main{padding:75px 0}.article-layout{display:grid;grid-template-columns:255px minmax(0,770px);gap:65px;align-items:start}.article-sidebar{position:sticky;top:115px}.toc-box{border:1px solid #e3ebf5;background:#f8fbff;border-radius:15px;padding:25px}.toc-box>b{display:block;font-size:14px;margin-bottom:15px}.toc-box ol{padding-left:20px;margin:0 0 20px}.toc-box li{font-size:13px;color:#637792;margin:13px 0}.toc-box a{text-decoration:none}.toc-box a:hover{color:#2563eb}.sidebar-link{font-size:13px;font-weight:800;color:#2563eb}.article-prose{color:#405773;font-size:16px;line-height:1.96}.article-lead{font-size:19px;line-height:1.85;color:#2f4766;margin-bottom:40px}.article-section{margin-bottom:47px;scroll-margin-top:120px}.article-section h2,.article-faq h2,.article-next h2{font-size:clamp(1.45rem,2vw,2.05rem);color:#172d4a;margin-bottom:15px}.article-section p,.article-faq p{margin-bottom:0}.article-tip{background:#eff6ff;border-left:3px solid #2563eb;border-radius:0 12px 12px 0;padding:18px 22px;margin-top:22px}.article-tip strong{display:block;font-size:12px;color:#1d56bb;margin-bottom:4px}.article-tip p{font-size:14px;line-height:1.75}.article-faq{padding:34px;border:1px solid #dae7f6;border-radius:14px;margin:40px 0}.article-faq h3{font-size:17px;margin:20px 0 8px}.article-next{background:#f2f7ff;border-radius:19px;padding:35px}.article-next .hero-actions{margin-top:25px}.article-next p{font-size:15px}.related{background:#f8fbff}.learn-intro{background:linear-gradient(135deg,#f0f7ff,#fff)}.learn-instructions{display:flex;gap:22px;align-items:center;border:1px solid #dce8f5;padding:22px 28px;background:#f8fbff;border-radius:16px;margin-bottom:35px}.learn-instructions h2{font-size:20px;margin-bottom:7px}.learn-instructions p{font-size:13px;color:#6e809a;margin:0}.lesson-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}.lesson-card{border-radius:16px;overflow:hidden;border:1px solid #e4ecf7;background:#fff}.lesson-thumb{height:180px;background:linear-gradient(135deg,#163865,#2465da);position:relative;display:grid;place-items:center}.lesson-thumb:before{content:'';position:absolute;inset:20px;border:1px solid #ffffff23;border-radius:13px}.lesson-no{position:absolute;top:17px;left:20px;color:#c6dbff;font-weight:800;font-size:13px}.lesson-play{height:55px;width:55px;display:grid;place-items:center;border-radius:50%;color:#fff;border:1px solid #ffffffba;font-size:20px;padding-left:3px}.lesson-tag{position:absolute;bottom:16px;left:19px;background:#ffffff21;color:#fff;border-radius:6px;padding:5px 9px;font-size:10px;font-weight:850}.lesson-content{padding:24px}.lesson-content h3{font-size:17px}.lesson-content p{font-size:13px;color:#6f8097;line-height:1.75;min-height:60px}.article-card[hidden]{display:none!important}@media(max-width:1100px){.nav-links{gap:16px}.hero-grid{gap:20px}.feature-grid,.screenshot-grid,.learning-grid{gap:40px}.use-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:800px){.container,.nav-shell{width:min(100% - 32px,1190px)}.nav-shell{min-height:72px}.menu-toggle{display:block}.nav-links{display:none;position:absolute;left:0;right:0;top:72px;padding:18px 20px 26px;background:#fff;box-shadow:0 20px 35px #193d6616;align-items:stretch;flex-direction:column;gap:10px}.nav-links.open{display:flex}.nav-links>a{padding:10px 0}.nav-links .nav-cta{text-align:center;padding:13px 18px}.hero{padding:62px 0 50px}.hero-grid,.feature-grid,.screenshot-grid,.learning-grid,.article-hero-grid,.faq-grid{grid-template-columns:1fr}.hero-visual{max-width:680px;width:100%;margin:auto}.hero h1{font-size:clamp(2.5rem,7vw,4.6rem)}.trust-inner{gap:18px;flex-wrap:wrap;justify-content:center}.trust-inner span:first-child{flex-basis:100%;text-align:center;max-width:none}.section{padding:68px 0}.steps,.article-grid,.lesson-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.footer-top{gap:28px}.article-layout{grid-template-columns:1fr}.article-sidebar{position:static}.toc-box ol{columns:2}.article-hero{padding:45px 0}.article-cover{max-width:650px}.filter-row{align-items:start;flex-direction:column}.article-search{width:100%;min-width:0}.article-prose{max-width:760px}}@media(max-width:560px){.brand strong{font-size:18px}.brand img{width:38px;height:38px}.hero h1{font-size:2.55rem}.hero-points{gap:8px 14px}.floating-chip{right:0;bottom:0;padding:10px}.steps,.article-grid,.lesson-grid,.use-grid{grid-template-columns:1fr}.section-heading.split{align-items:start;flex-direction:column}.feature-photo{min-height:320px}.feature-photo img{max-height:260px}.footer-top{grid-template-columns:1fr 1fr;gap:35px}.footer-top>div:first-child{grid-column:1/-1}.footer-bottom{flex-direction:column}.cta-inner{padding:55px 18px}.hero-actions .btn,.intro-actions .btn{width:100%}.article-card-image{height:185px}.article-hero h1{font-size:2.35rem}.article-next{padding:24px}.article-prose{font-size:15px}.toc-box ol{columns:1}.learn-instructions{flex-direction:column;align-items:start}.floating-chip small{display:none}}
