@font-face{font-family:Poppins;src:url('design-samples/assets/Poppins-Regular.ttf')}@font-face{font-family:Poppins;src:url('design-samples/assets/Poppins-SemiBold.ttf');font-weight:600}@font-face{font-family:Poppins;src:url('design-samples/assets/Poppins-Bold.ttf');font-weight:700}:root{--purple:#7b2cbf;--deep:#32134f;--ink:#39234c;--muted:#7a6987;--line:#e9dff0;--mint:#c4f5df;--lav:#f3e7ff}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:24px}body{margin:0;color:var(--ink);background:#fff;font:14px/1.7 Poppins,sans-serif}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}button,a,summary{touch-action:manipulation}button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid #ac72d6;outline-offset:6px}[hidden]{display:none!important}.wrap{max-width:1240px;margin:auto;padding:0 44px}h1,h2,h3,p{margin:0}h1,h2,h3{line-height:1.16;letter-spacing:-1.5px;font-weight:700}p{color:var(--muted)}.nav{display:flex;align-items:center;justify-content:space-between;height:108px;gap:28px}.brand{display:flex;align-items:center;gap:8px;font-size:21px;color:var(--purple);letter-spacing:-.8px;font-weight:700;white-space:nowrap}.brand b{font-weight:400}.brand img{width:45px;height:45px}.nav nav{display:flex;gap:34px;font-weight:600;font-size:12px;color:#8b729b}.nav nav a{padding:12px 0}.button{display:inline-flex;align-items:center;justify-content:center;gap:27px;padding:15px 23px;min-height:58px;border:2px solid transparent;border-bottom-width:6px;border-radius:15px;font-size:12px;font-weight:700;letter-spacing:.4px;text-transform:uppercase;transition:transform .13s,background .13s;line-height:1.4}.button span{font-size:22px;line-height:1}.primary{background:var(--purple);border-color:var(--purple);border-bottom-color:#58218a;color:#fff}.primary:hover{background:#8938cd;border-color:#8938cd;border-bottom-color:#58218a}.outline{background:#fff;border-color:#e2d5ec;color:var(--purple)}.outline:hover{background:#fcf8ff}.button:active{transform:translateY(4px)}.small{font-size:10px;min-height:48px;padding:11px 18px;gap:17px;border-bottom-width:4px}.mint{background:var(--mint);color:#2c5941;border-color:var(--mint);border-bottom-color:#8cc4a7}.full{width:100%}.hero{display:grid;grid-template-columns:1.02fr 1fr;gap:60px;align-items:center;padding-top:30px;padding-bottom:70px;min-height:695px}.course{font-size:10px;font-weight:700;letter-spacing:1.1px;display:flex;align-items:center;gap:9px;color:#8a639f}.course-dot{width:8px;height:8px;border-radius:50%;background:#9ddab9}.course-divider{color:#d4bbdf;margin:0 5px}h1{font-size:79px;line-height:1.12;letter-spacing:-3.8px;margin-top:24px}.underlined{position:relative;color:var(--purple);display:inline-block}.underlined svg{position:absolute;bottom:-8px;left:-3px;width:100%;height:20px;stroke:#ba91d8;fill:none;stroke-width:4;stroke-linecap:round}.hero-copy>p{font-size:17px;line-height:1.85;margin-top:32px;max-width:400px}.hero-actions{display:flex;gap:24px;align-items:center;margin-top:31px}.micro{font-size:10px;color:#8a7896;line-height:1.8}.card-stage{position:relative;background:#f0e4fb;border:2px solid #e9d5f7;border-bottom:8px solid #dfc7ee;border-radius:35px;padding:24px 30px 25px;isolation:isolate}.stage-header{display:flex;align-items:center;justify-content:space-between;position:relative;z-index:2;margin-bottom:17px}.stage-label{font-size:10px;letter-spacing:1.7px;font-weight:700;color:#916ba9}.motion{height:36px;width:36px;border:2px solid #d9c1e9;border-radius:10px;background:#f7efff;color:#9670ad;display:grid;place-items:center}.motion svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2}.stage-dots{position:absolute;inset:80px 0 40px;z-index:-1;background-image:radial-gradient(#d9bce9 1.5px,transparent 1.5px);background-size:18px 18px;opacity:.5}.study-card{position:relative;border:2px solid #c6e7d7;border-bottom:7px solid #a6ccb8;background:#fff;border-radius:23px;padding:25px;box-shadow:9px 11px 0 #d0b4e12b;transform:rotate(-3deg);transition:transform .25s ease;min-height:425px}.study-card:hover,.study-card:focus-within{transform:rotate(0)}.sample-top{display:flex;justify-content:space-between;font-size:9px;font-weight:700;letter-spacing:.9px;color:#816691}.sample-top>span:first-child{background:#e8f8ee;color:#52846b;padding:5px 8px;border-radius:6px}.sample-top>span:last-child{padding:5px 0;color:#b4a0c1}.card-content{min-height:251px;padding-top:18px}.card-icon{width:52px;height:57px;color:#9e65c7;margin:0 0 15px}.card-icon svg{width:100%;height:100%;fill:#f3e7fc;stroke:currentColor;stroke-width:2}.card-label{font-size:9px;letter-spacing:1px;color:#ad99ba;font-weight:600}.study-card h2{font-size:30px;letter-spacing:-1px;margin-top:8px;line-height:1.3;max-width:325px}.study-card .button{font-size:11px;min-height:49px}.sample-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:17px;font-size:9px;color:#9b86a9}.sample-foot svg{width:15px;height:18px;stroke:#b099c0;fill:none;stroke-width:1.8}.stage-bottom{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:28px;font-size:8px;color:#9a78af}.card-progress{display:flex;gap:5px}.card-progress span{width:16px;height:6px;background:#dfc7ef;border-radius:4px}.card-progress .on{width:25px;background:#9c60c9}.sample-controls{display:flex;gap:10px}.sample-controls .button{flex:1;padding:12px 13px;font-size:10px}.sample-controls .outline{border-bottom-width:5px}#sample-answer{font-size:15px;line-height:1.9;color:#664878;margin:13px 0 22px}#sample-answer strong{color:#6b2c9b}.study-card.answered .card-icon{display:none}.study-card.answered h2{font-size:22px;line-height:1.4}.study-card.answered .card-content{padding-top:28px}.card-content.reveal-in{animation:reveal .24s ease-out}.benefits{border-top:2px solid #eee6f4;border-bottom:2px solid #eee6f4;background:#fcf9ff}.benefits .wrap{display:flex;justify-content:space-between;gap:25px;padding-top:23px;padding-bottom:23px;font-size:11px;color:#8b709d;font-weight:600}.benefits i{font-style:normal;color:#a779c4;background:#f1e5fa;display:inline-grid;place-items:center;width:29px;height:29px;border-radius:9px;margin-right:10px;font-size:10px}.test-section{display:grid;grid-template-columns:1fr 1.03fr;gap:100px;align-items:center;padding-top:94px;padding-bottom:94px}.test-visual{background:#e3f6ed;border:2px solid #d8eee3;border-radius:28px;padding:30px 24px 19px}.test-window{border:2px solid #c4ddcf;border-bottom:6px solid #b2d2c0;border-radius:19px;background:white;padding:24px}.window-bar{display:flex;align-items:center;gap:9px;color:#a18cab;font-size:9px;letter-spacing:1px;font-weight:700}.tiny-symbol{color:#8964a2;font-size:17px}.window-count{margin-left:auto;color:#b29abd}.test-window h3{font-size:21px;line-height:1.4;letter-spacing:-.5px;margin:16px 0 23px}.topic-option{display:flex;align-items:center;gap:11px;font-size:12px;padding:15px 0;border-top:1px solid #eee6f4;font-weight:600}.topic-option small{margin-left:auto;font-weight:400;font-size:9px;color:#9b8aa5}.tick,.unchecked{display:grid;place-items:center;width:24px;height:24px;border-radius:7px;background:#a466d1;border-bottom:3px solid #814ca7;color:#fff;font-size:13px}.unchecked{background:#faf8fc;border:2px solid #e9e1ef}.topic-option.muted{color:#ad9aba}.test-settings{display:flex;align-items:center;justify-content:space-between;border-top:1px solid #eee6f4;margin-top:15px;padding-top:18px;font-size:9px;color:#9c87a9}.test-settings>span:last-child{display:flex;gap:5px;align-items:center}.test-settings svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.5}.visual-caption{display:block;text-align:center;font-size:9px;color:#87aa97;margin-top:14px}.eyebrow{display:block;color:#a77cc6;letter-spacing:1.4px;font-size:10px;font-weight:700;margin-bottom:18px}.test-copy h2{font-size:43px;letter-spacing:-1.7px}.test-copy h2 span{color:var(--purple)}.test-copy>p{font-size:14px;line-height:1.9;margin:25px 0}.test-copy .button{font-size:11px}.test-facts{display:flex;gap:25px;border-top:2px solid #eee6f4;padding-top:23px;margin-top:29px}.test-facts b{display:block;font-size:11px;font-weight:600}.test-facts small{display:block;font-size:9px;color:#a28daf;margin-top:4px}.start-section{padding-bottom:54px}.start-panel{background:var(--purple);border-bottom:7px solid #5b238c;border-radius:24px;padding:43px;display:flex;align-items:center;justify-content:space-between;gap:25px;color:white;position:relative}.start-panel .eyebrow{color:#ddbcf6;font-size:9px;margin-bottom:12px}.start-panel h2{font-size:34px;letter-spacing:-1.2px}.start-panel p{font-size:12px;color:#e0c3f3;margin-top:15px}.start-panel .button{flex-shrink:0}.footer-row{display:flex;align-items:center;justify-content:space-between;border-top:2px solid #eee6f4;padding-top:27px}.footer-row .brand{font-size:17px}.footer-row img{width:36px;height:36px}.footer-row>span{font-size:10px;color:#a18aad}footer{padding-bottom:30px!important}footer details{margin-top:17px;font-size:10px;color:#a18aad}footer summary{cursor:pointer;min-height:34px;display:list-item;padding:7px 0}footer details p{max-width:740px;font-size:11px;line-height:1.8;margin-bottom:12px}.skip{position:absolute;top:-100px;left:20px;background:#fff;padding:10px;z-index:100}.skip:focus{top:10px}.hero-copy{animation:arrive .6s ease-out}.card-stage{animation:arrive .6s .1s both ease-out}@keyframes arrive{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}@keyframes reveal{from{opacity:.3;transform:translateY(7px)}to{opacity:1;transform:none}}.motion-off *{animation:none!important;transition:none!important}.motion-off .study-card{transform:none}
@media(max-width:1050px){.wrap{padding-left:30px;padding-right:30px}.hero{gap:35px}h1{font-size:66px}.card-stage{padding:20px}.study-card{padding:22px}.study-card h2{font-size:26px}.test-section{gap:45px}.test-copy h2{font-size:35px}.test-facts{gap:15px}.hero-copy>p{font-size:15px}.benefits .wrap{font-size:10px;gap:12px}.course{font-size:8px;gap:6px}.stage-bottom{font-size:7px}.hero-actions{gap:16px}.hero-actions .button{font-size:11px;padding:15px 19px}.test-visual{padding:23px 20px 17px}.test-window{padding:20px}.topic-option{font-size:11px}.start-panel h2{font-size:30px}}
@media(max-width:700px){.wrap{padding-left:22px;padding-right:22px}.nav{height:85px;gap:12px}.brand{font-size:18px;gap:3px}.brand img{width:36px;height:36px}.nav nav{display:none}.nav .button{padding:10px 12px;font-size:9px;gap:10px;min-height:44px}.hero{display:flex;flex-direction:column;align-items:stretch;padding-top:22px;padding-bottom:39px;gap:37px;min-height:0}.course{font-size:8px;letter-spacing:.9px;gap:7px}h1{font-size:64px;letter-spacing:-3px;line-height:1.08;margin-top:23px}.hero-copy>p{font-size:15px;margin-top:25px;line-height:1.8}.hero-actions{margin-top:25px;gap:19px}.hero-actions .button{font-size:11px;padding:14px 19px;min-height:54px}.micro{font-size:9px}.card-stage{border-radius:26px;padding:17px 21px 20px}.study-card{padding:22px;min-height:410px;transform:rotate(-2deg)}.stage-header{margin-bottom:18px}.stage-label{font-size:9px}.card-content{min-height:252px}.study-card h2{font-size:27px}.stage-bottom{font-size:8px;gap:7px;margin-top:25px}.stage-bottom>span{max-width:160px;text-align:right}.sample-foot{font-size:8px}.sample-top{font-size:8px}.benefits .wrap{display:grid;gap:13px;font-size:11px;padding-top:21px;padding-bottom:21px}.test-section{display:flex;flex-direction:column;padding-top:47px;padding-bottom:45px;gap:31px;align-items:stretch}.test-copy{order:-1}.test-copy h2{font-size:35px}.test-copy>p{font-size:13px;line-height:1.85;margin:20px 0}.test-copy .button{font-size:11px;min-height:51px}.test-facts{margin-top:25px;padding-top:20px;gap:20px}.test-facts b{font-size:10px}.test-facts small{font-size:9px}.test-visual{padding:22px 18px 16px;border-radius:24px}.test-window{padding:21px}.topic-option{font-size:11px;gap:10px}.topic-option small{font-size:8px}.test-window h3{font-size:20px}.eyebrow{font-size:9px;margin-bottom:15px}.start-section{padding-bottom:35px}.start-panel{padding:29px 25px;display:block;border-radius:22px}.start-panel h2{font-size:29px;line-height:1.25}.start-panel p{font-size:11px}.start-panel .button{width:100%;margin-top:25px;font-size:11px}.footer-row .brand{font-size:15px}.footer-row>span{font-size:9px}.footer-row img{width:30px;height:30px}footer details{font-size:10px}footer details p{font-size:10px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{animation:none!important;transition:none!important}.study-card,.study-card:hover,.study-card:focus-within{transform:none}.button:active{transform:none}}
/* Keep small labels legible on the pale product surfaces. */
.nav nav{color:#765684}.sample-top>span:last-child,.card-label,.sample-foot,.stage-label,.stage-bottom,.micro{color:#755683}.sample-top,.card-label{font-size:10px}.sample-foot{font-size:11px}.stage-bottom{font-size:10px}.micro{font-size:11px}.visual-caption{color:#466c58;font-size:10px}.test-settings,.window-bar,.window-count,.topic-option small{color:#786383}.topic-option.muted{color:#80698e}.test-facts small{color:#7b6688;font-size:10px}.footer-row>span,footer details{color:#755b84}.sample-foot svg{stroke:#886599}.eyebrow{color:#825197}.test-settings{font-size:10px}.topic-option small{font-size:10px}.stage-header .motion{color:#765087}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(max-width:700px){.sample-foot{font-size:10px}.stage-bottom{font-size:9px}.micro{font-size:10px}.sample-top{font-size:9px}.topic-option small{font-size:9px}.test-settings{font-size:9px}}
#sample-visual{border-top:2px solid #eee3f5;padding-top:17px;margin:18px 0 22px}.visual-heading{font-size:10px;font-weight:700;letter-spacing:.7px;color:#745284;margin-bottom:12px}#sample-visual iframe{display:block;width:100%;height:455px;border:0;background:#fff;border-radius:8px}.study-card.answered{transform:none}.study-card.answered .card-content{min-height:0}.study-card.answered #sample-answer{margin-bottom:12px}.diagram-open{display:block;width:100%;padding:10px 8px;border:1px solid #e7deed;border-radius:11px;background:white;color:#77438f}.diagram-open img{display:block;width:100%;height:auto}.diagram-open span{display:block;padding:9px 0 0;font:600 11px Poppins,sans-serif}.visual-caption-text{font-size:11px;margin-top:12px;line-height:1.75;color:#755b84}#diagram-dialog{max-width:1050px;width:calc(100% - 30px);padding:24px;border:2px solid #d8c1e8;border-radius:20px;color:#39234c;max-height:90dvh;overflow:auto}#diagram-dialog::backdrop{background:#28143788}.diagram-dialog-head{display:flex;align-items:center;justify-content:space-between;gap:20px;background:white;position:sticky;top:-24px;padding:10px 0;z-index:1}.diagram-dialog-head h2{font-size:20px;letter-spacing:-.5px}.diagram-dialog-head .button{font-size:10px;min-height:44px;padding:9px 14px;flex-shrink:0}.diagram-scroll{overflow:auto;padding:15px 0}.diagram-scroll img{display:block;width:100%;min-width:740px;background:#fff}#diagram-dialog>p{font-size:11px;margin-top:13px}@media(max-width:700px){#sample-visual iframe{height:435px}.diagram-dialog-head h2{font-size:16px}#diagram-dialog{padding:17px}.diagram-dialog-head{top:-17px}.diagram-dialog-head .button{padding:8px 10px}.study-card.answered h2{font-size:20px}}
.brand img{object-fit:contain}
/* Keep demo actions in place when an answer includes a diagram. */
.study-card{height:min(425px,calc(100dvh - 80px));min-height:0;display:flex;flex-direction:column;transform:none;overflow:hidden;padding:20px}
.study-card .sample-top{flex-shrink:0}.study-card .card-content,.study-card.answered .card-content{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:16px 4px 12px;margin:8px -4px 12px;scrollbar-gutter:stable}
.study-card>.button,.study-card>.sample-controls,.study-card>.sample-foot{flex-shrink:0}.study-card .sample-foot{margin-top:10px;font-size:10px}.study-card.answered h2{font-size:17px;line-height:1.4;margin-top:5px}.study-card.answered h2 br{display:none}.study-card.answered #sample-answer{font-size:14px;line-height:1.7;margin:10px 0}.study-card #sample-visual{margin:12px 0 0;padding-top:10px}.study-card .visual-heading{margin-bottom:6px;font-size:9px}.study-card .diagram-open img{max-height:190px;object-fit:contain}.study-card .visual-caption-text{margin-top:6px}.card-content:focus-visible{outline:2px solid #ac72d6;outline-offset:0}
@media(max-width:700px){.study-card{height:min(410px,calc(100dvh - 40px));padding:16px}.card-stage{padding:14px}.stage-bottom{margin-top:14px}}