@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{--ink:#191c25;--muted:#606575;--paper:#fbfbfa;--line:#dedfdf;--lime:#edff7a;--orange:#ffae50;--violet:#c9b7ff;font-family:'DM Sans',Arial,sans-serif;font-size:16px;color:var(--ink);background:var(--paper)}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:95px}body{margin:0}h1,h2,h3,p,blockquote{margin:0}h1,h2,h3{font-family:'Manrope',Arial,sans-serif}p{line-height:1.65}button,input,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}a{color:inherit}button:focus-visible,a:focus-visible,[tabindex]:focus-visible{outline:3px solid #9270fb;outline-offset:5px}button{border:0}a{text-underline-offset:5px}button:disabled{opacity:.35;cursor:default}.shell{max-width:1296px;margin:0 auto;padding:0 48px}.header{background:var(--ink);color:white;position:sticky;top:0;z-index:20;border-bottom:1px solid #ffffff1c}.nav{height:84px;display:flex;align-items:center;justify-content:space-between;gap:24px}.logo{font:800 1.7rem 'Manrope',Arial,sans-serif;letter-spacing:-.06em;text-decoration:none;white-space:nowrap}.logo span{color:var(--orange)}.nav-right{display:flex;align-items:center;gap:30px}.nav-right>a{font-size:.875rem;text-decoration:none;color:#d6d7de}.nav-right>a:hover{color:var(--lime)}.languages{display:flex;gap:3px;padding:4px;border:1px solid #464950;border-radius:50px}.languages button{background:transparent;color:#b9bdc8;font-size:.875rem;padding:9px 13px;border-radius:50px}.languages [aria-pressed=true]{color:var(--ink);background:var(--lime);font-weight:700}.hero-band{background:var(--ink);color:white;overflow:hidden}.hero{display:grid;grid-template-columns:1.25fr 1fr;gap:80px;padding-top:76px;padding-bottom:74px;align-items:center}.eyebrow{font-size:.8rem;letter-spacing:.13em;text-transform:uppercase;font-weight:700;display:block;margin-bottom:23px}.hero .eyebrow{color:var(--lime)}h1{font-size:clamp(3rem,5.2vw,4.8rem);letter-spacing:-.055em;line-height:1.07;font-weight:700}h1 em,h2 em{font-family:Georgia,serif;font-weight:400;letter-spacing:-.06em}h1 em{color:var(--orange)}.hero-copy>p{color:#c9cbd4;font-size:1.12rem;max-width:560px;margin:26px 0 30px}.btn{display:inline-flex;gap:10px;align-items:center;justify-content:center;padding:16px 23px;border-radius:9px;font-weight:700;font-size:.96rem;text-decoration:none;min-height:48px;background:var(--ink);color:white;transition:transform .18s,background .18s}.btn:hover{transform:translateY(-2px)}.btn.lime{background:var(--lime);color:var(--ink)}.btn.outline{background:transparent;border:1px solid var(--line);color:var(--ink)}.hero-cta{display:flex;flex-wrap:wrap;align-items:center;gap:20px}.hero-cta small{font-size:.875rem;color:#b1b6c4}.hero-scene{position:relative;padding-top:120px}.mascot{position:absolute;right:12px;top:-72px;width:260px;height:260px;object-fit:contain;transform:rotate(9deg);z-index:2;animation:float 6s ease-in-out infinite}.scene-caption{position:absolute;top:24px;left:5px;max-width:150px;font:italic 1.3rem Georgia,serif;color:var(--orange);transform:rotate(-9deg)}.hero-message{border:1px solid #53565e;padding:22px 24px;border-radius:15px 15px 15px 3px;max-width:345px;background:#272b37;position:relative;transform:rotate(-3deg)}.speaker{font-size:.75rem;letter-spacing:.08em;text-transform:uppercase;font-weight:700;display:block;margin-bottom:12px}.hero-message p{font-size:1.1rem;line-height:1.55}.hero-reply{padding:22px 24px;background:var(--lime);color:var(--ink);border-radius:15px 15px 3px 15px;margin:22px 0 0 46px;transform:rotate(2deg)}.hero-reply p{font-size:1.08rem;line-height:1.55}.hero-mini{display:flex;justify-content:space-between;gap:20px;border-top:1px solid #ffffff26;padding:24px 0 28px}.hero-mini span{color:#bfc4d0;font-size:.875rem}.hero-mini strong{color:white;font-size:1rem}.section{padding:86px 0}.section-title{font-size:clamp(2.1rem,3.6vw,3.25rem);line-height:1.16;letter-spacing:-.05em;font-weight:700}.intro-grid{display:grid;grid-template-columns:1fr 1fr;gap:90px;align-items:center}.intro-grid>p{font-size:1.15rem;color:var(--muted)}.contrast{display:grid;grid-template-columns:1fr 1.4fr;gap:20px;margin-top:38px}.contrast>div{padding:26px 30px;border-radius:15px;border:1px solid var(--line)}.contrast .old{background:#f0f0ef}.contrast .new{background:#fff;border-color:#b9be94}.contrast .label{font-size:.75rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;display:block;margin-bottom:13px;color:var(--muted)}.contrast p{font-size:1.15rem;line-height:1.5}.contrast .new .label{color:#596815}.process{list-style:none;display:flex;padding:0;margin:28px 0 0;gap:0;align-items:center}.process li{display:flex;align-items:center;gap:10px;flex:1;font-size:.875rem;font-weight:600}.process li:not(:last-child):after{content:'→';color:#858998;flex:1;text-align:center}.process b{font-size:.75rem;border:1px solid #b8bcad;border-radius:50%;width:26px;height:26px;display:grid;place-items:center;flex:none}.tutorial-section{background:#eeeef4;padding:80px 0 88px}.section-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:45px;margin-bottom:40px}.section-heading p{color:var(--muted);max-width:360px;font-size:1.03rem}.demo-tag{font-size:.75rem;display:inline-flex;align-items:center;border:1px solid #cacbd3;border-radius:50px;padding:8px 12px;color:var(--muted);margin-bottom:20px}.tutorial{display:grid;grid-template-columns:290px 1fr;gap:24px;align-items:start}.step-nav{display:flex;flex-direction:column;gap:7px}.step-nav button{display:grid;grid-template-columns:34px 1fr;gap:12px;padding:19px 17px;border:1px solid transparent;border-radius:12px;text-align:left;color:#646979;background:transparent;min-height:72px}.step-nav button:hover{background:#e1e2ec}.step-nav [aria-selected=true]{background:var(--ink);color:white}.step-nav .number{font-family:'Manrope',sans-serif;font-size:1.25rem;font-weight:700;opacity:.55}.step-nav strong{font-size:1rem;display:block}.step-nav small{display:block;margin-top:5px;font-size:.8rem;line-height:1.35;opacity:.75}.step-nav [aria-selected=true] .number{opacity:1;color:var(--lime)}.conversation{background:white;border:1px solid #dcdde7;border-radius:20px;overflow:hidden;box-shadow:0 12px 35px #25274505}.conversation-top{padding:24px 28px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:20px}.conversation-top strong{font-size:.9rem}.conversation-top span{font-size:.8rem;color:var(--muted)}.chat-body{padding:27px 28px}.chat-turn{position:relative;margin-bottom:21px;max-width:94%;font-size:1rem;line-height:1.65}.chat-turn.you{background:#f2f2f5;border-radius:14px 14px 3px 14px;padding:20px 22px;margin-left:auto}.chat-turn.dot{background:#f0f6df;border-radius:14px 14px 14px 3px;padding:20px 22px;margin-right:auto}.chat-turn .speaker{color:#626976;font-size:.72rem;margin-bottom:10px;display:flex;justify-content:space-between;align-items:center;gap:12px}.chat-turn.dot .speaker{color:#52642d}.mini-copy{background:transparent;color:inherit;display:flex;gap:6px;align-items:center;font-size:.75rem;text-transform:none;letter-spacing:0;font-weight:600;padding:5px;border-radius:4px}.mini-copy:hover{background:#ffffff}.mini-copy svg,.copy svg{width:15px;height:15px}.lesson{display:grid;grid-template-columns:40px 1fr;gap:14px;border-top:1px solid var(--line);padding-top:19px}.lesson-icon{background:var(--orange);border-radius:50%;width:36px;height:36px;display:grid;place-items:center;font-weight:800}.lesson strong{display:block;font-size:.9rem;margin-bottom:5px}.lesson p{font-size:.92rem;color:var(--muted);line-height:1.55}.step-bottom{display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--line);padding:17px 28px;gap:20px}.progress{display:flex;gap:5px;align-items:center}.progress i{display:block;width:20px;height:4px;background:#dfdfe5;border-radius:8px}.progress i.done{background:var(--ink)}.step-buttons{display:flex;gap:8px}.step-buttons button{font-size:.85rem;padding:11px 16px;min-height:42px}.prev{background:#f2f2f5;border-radius:8px}.next{background:var(--ink);color:var(--lime);border-radius:8px}.handoff-note{font-size:.875rem;line-height:1.6;color:var(--muted);margin-top:20px;max-width:810px;margin-left:auto}.case-tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:24px}.case-tabs button{font-size:.95rem;padding:13px 21px;border:1px solid var(--line);border-radius:50px;background:white}.case-tabs [aria-selected=true]{background:var(--ink);border-color:var(--ink);color:white}.case-tabs span{opacity:.55;margin-right:7px}.case-panel{border:1px solid var(--line);border-radius:18px;overflow:hidden}.case-top{padding:25px 30px;background:white}.case-top h3{font-size:1.35rem;letter-spacing:-.035em}.case-grid{display:grid;grid-template-columns:.75fr 1.25fr}.case-before,.case-after{padding:28px 30px}.case-before{background:#ededed}.case-after{background:#f0f4e1}.case-grid .label,.case-result .label{display:block;font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;margin-bottom:17px;color:var(--muted)}.case-before blockquote{font-size:1.35rem;line-height:1.4;margin-bottom:22px}.case-before p{color:var(--muted);font-size:.95rem}.case-after blockquote{font-size:1rem;line-height:1.7}.copy{display:inline-flex;align-items:center;gap:8px;font-weight:600;font-size:.85rem;padding:11px 16px;border:1px solid #c4c9b1;background:white;border-radius:7px;margin-top:20px;min-height:44px}.case-result{padding:24px 30px;display:grid;grid-template-columns:155px 1fr;gap:20px}.case-result p{line-height:1.6}.case-result .label{color:#667924;margin:3px 0 0}.starter-band{background:var(--ink);color:white;position:relative}.starter{display:grid;grid-template-columns:1fr 1.05fr;gap:75px;align-items:start}.starter .eyebrow{color:var(--orange)}.starter .section-title em{color:var(--lime)}.starter-intro>p{color:#b8bdcb;margin-top:24px;font-size:1.06rem}.start-list{list-style:none;padding:0;margin:28px 0 0}.start-list li{display:flex;gap:14px;margin-bottom:15px;color:#d0d4dd;font-size:.95rem;line-height:1.6}.start-list b{color:var(--lime)}.template{background:#272b36;border:1px solid #4b4f5b;border-radius:18px;padding:29px}.template .label{font-size:.75rem;text-transform:uppercase;letter-spacing:.1em;color:var(--lime);font-weight:700}.template blockquote{font-size:1.08rem;line-height:1.85;margin-top:20px;white-space:pre-line}.template .copy{background:var(--lime);border-color:var(--lime);color:var(--ink)}.template-note{font-size:.8rem;color:#b7bece;margin-top:16px;line-height:1.5}.bottom-line{padding:55px 0;display:flex;justify-content:space-between;align-items:center;gap:40px;border-bottom:1px solid var(--line)}.bottom-line p{font-family:Georgia,serif;font-size:1.8rem;max-width:780px;line-height:1.3;letter-spacing:-.025em}.share{flex:none}.footer{padding:30px 0 40px;display:flex;justify-content:space-between;gap:40px;color:var(--muted);font-size:.78rem;line-height:1.65}.footer p{max-width:760px}.footer-links{display:flex;gap:18px;white-space:nowrap}.skip{position:fixed;top:-90px;left:16px;z-index:50;padding:15px;background:var(--lime);color:var(--ink)}.skip:focus{top:12px}#toast{position:fixed;left:50%;bottom:22px;transform:translate(-50%,20px);background:var(--ink);border:1px solid #626878;color:white;border-radius:12px;padding:14px 23px;opacity:0;pointer-events:none;max-width:calc(100% - 32px);transition:.2s;z-index:40;font-size:.95rem}#toast.show{transform:translate(-50%,0);opacity:1}@keyframes float{50%{transform:translateY(-10px) rotate(6deg)}}
@media(max-width:1050px){.shell{padding-left:30px;padding-right:30px}.hero{gap:42px}.hero-scene{padding-top:105px}.mascot{width:230px;height:230px;right:-12px;top:-60px}.scene-caption{font-size:1.1rem;max-width:100px}.tutorial{grid-template-columns:245px 1fr;gap:20px}.step-nav button{padding:16px 10px}.intro-grid,.starter{gap:40px}.process li{font-size:.8rem;gap:6px}.hero-mini{gap:20px;flex-wrap:wrap}.case-grid{grid-template-columns:.8fr 1.2fr}}
@media(max-width:760px){html{scroll-padding-top:90px}.shell{padding-left:22px;padding-right:22px}.nav{height:72px}.nav-right>a{display:none}.nav-right{gap:10px}.logo{font-size:1.55rem}.hero{grid-template-columns:1fr;padding-top:48px;padding-bottom:38px;gap:30px}h1{font-size:clamp(2.8rem,10vw,4.5rem)}.hero-copy>p{font-size:1.04rem;margin:23px 0}.hero .eyebrow{font-size:.75rem;line-height:1.6}.hero-scene{max-width:510px;width:100%;margin:0 auto;padding-top:105px}.mascot{width:195px;height:195px;top:-36px;right:0}.scene-caption{left:10px;top:21px;max-width:150px;font-size:1.2rem}.hero-message{max-width:84%;padding:19px;transform:rotate(-2deg)}.hero-reply{padding:19px;margin-left:25px}.hero-mini{display:grid;grid-template-columns:1fr;padding:24px 0;gap:16px}.hero-mini span{display:flex;gap:14px;align-items:center}.hero-mini strong{min-width:90px}.section,.tutorial-section{padding:54px 0}.intro-grid{grid-template-columns:1fr;gap:23px}.intro-grid>p{font-size:1.05rem}.contrast{grid-template-columns:1fr;gap:12px;margin-top:25px}.contrast>div{padding:22px}.process{flex-wrap:wrap;gap:14px}.process li{flex:1 0 42%;font-size:.9rem}.process li:not(:last-child):after{content:none}.section-heading{display:block;margin-bottom:28px}.section-heading>p{margin-top:18px;max-width:none}.section-title{font-size:2.25rem}.tutorial{grid-template-columns:1fr;gap:18px}.step-nav{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:5px}.step-nav button{display:flex;flex-direction:column;gap:8px;align-items:center;padding:13px 4px;text-align:center;min-height:90px;border:1px solid #d8d9e2;background:#ffffff60}.step-nav .number{font-size:1rem}.step-nav strong{font-size:.875rem;line-height:1.3;overflow-wrap:anywhere}.step-nav small{display:none}.conversation-top{padding:19px}.conversation-top strong{font-size:.85rem}.conversation-top span{font-size:.75rem}.chat-body{padding:20px 17px}.chat-turn{max-width:96%;font-size:.98rem}.chat-turn.you,.chat-turn.dot{padding:18px 16px}.lesson{grid-template-columns:30px 1fr;gap:12px}.lesson-icon{width:28px;height:28px;font-size:.9rem}.step-bottom{padding:15px 17px;gap:12px}.progress{gap:4px}.progress i{width:13px}.step-buttons button{padding:10px 13px;font-size:.8rem}.handoff-note{font-size:.85rem}.case-grid{grid-template-columns:1fr}.case-top,.case-before,.case-after,.case-result{padding:23px}.case-result{grid-template-columns:1fr;gap:12px}.case-tabs{gap:7px}.case-tabs button{padding:12px 15px;font-size:.88rem}.starter{grid-template-columns:1fr;gap:30px}.template{padding:23px}.template blockquote{font-size:1rem}.bottom-line{display:block;padding:38px 0}.bottom-line p{font-size:1.6rem;margin-bottom:25px}.footer{display:block}.footer-links{margin-top:20px}.hero-cta{gap:15px}.eyebrow{font-size:.75rem;line-height:1.6;margin-bottom:18px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.btn:hover{transform:none}}

.step-nav button[aria-selected=true],.step-nav button[aria-selected=true]:hover{background:var(--ink);color:white}