@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;450;500;550;600;650;700&family=Manrope:wght@400;500;600;650;700;750;800&display=swap');
:root{--blue:#2548f4;--ink:#17213c;--muted:#5b6479;--line:#dde2ed;--paper:#f7f8fc;--lime:#eaff85;--radius:24px;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:100px}body{margin:0}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}a{color:inherit}button:focus-visible,a:focus-visible{outline:3px solid #f88f35;outline-offset:5px}button{border:0}p{line-height:1.65}h1,h2,h3,p{margin-top:0}h1,h2,h3{font-family:'Manrope',Arial,sans-serif}h1{font-size:clamp(3rem,6.5vw,6rem);line-height:1.03;letter-spacing:-.065em;font-weight:800;margin-bottom:28px}h2{font-size:clamp(2rem,4vw,3.6rem);letter-spacing:-.045em;line-height:1.13}h3{font-size:1.35rem;letter-spacing:-.025em;line-height:1.3}.nav{max-width:1280px;margin:auto;display:flex;align-items:center;justify-content:space-between;padding:25px 48px;gap:24px}.brand{font-family:'Manrope',Arial,sans-serif;font-size:1.75rem;font-weight:800;letter-spacing:-.055em;text-decoration:none;white-space:nowrap}.brand-dot{color:var(--blue)}.nav-right{display:flex;align-items:center;gap:32px}.nav-right>a{font-size:.9rem;text-decoration:none;font-weight:600}.languages{display:flex;background:#e9edf6;padding:4px;border-radius:99px}.languages button{padding:9px 14px;font-size:.875rem;font-weight:700;border-radius:99px;color:var(--muted);background:none}.languages button[aria-pressed=true]{background:var(--ink);color:white;box-shadow:0 2px 5px #18203b15}.wrap{max-width:1280px;margin:auto;padding:0 48px}.hero{padding:62px 0 74px;display:grid;grid-template-columns:1.15fr 1fr;gap:64px;align-items:center}.eyebrow{font-size:.8rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;display:block;margin-bottom:24px;color:var(--blue)}h1 .blue{color:var(--blue)}.intro{font-size:1.15rem;color:var(--muted);max-width:505px;margin-bottom:28px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;padding:16px 24px;border-radius:99px;font-weight:650;text-decoration:none;background:var(--blue);color:white;font-size:1rem;transition:transform .2s,background .2s}.btn:hover{background:#1736d7;transform:translateY(-2px)}.hero-actions{display:flex;align-items:center;gap:20px;flex-wrap:wrap}.quiet{font-size:.875rem;color:var(--muted)}.hero-story{background:var(--blue);color:white;border-radius:32px;padding:34px 30px;position:relative;box-shadow:0 24px 60px #2548f41b;transform:rotate(2deg)}.story-header{display:flex;align-items:center;gap:12px;margin-bottom:26px}.story-header span{font-size:.85rem;font-weight:600;color:#d4ddff}.avatar{width:40px;height:40px;border-radius:50%;background:var(--lime);display:grid;place-items:center;color:var(--ink);font-weight:800}.bubble{padding:20px 23px;border-radius:20px;line-height:1.55;font-size:1.02rem}.bubble.old{background:#1833bd;margin:0 35px 16px 0;color:#dee5ff;border-bottom-left-radius:5px}.bubble.new{background:white;color:var(--ink);margin-left:28px;border-bottom-right-radius:5px}.bubble small{display:block;font-size:.75rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;margin-bottom:9px;color:#57627e}.bubble.old small{color:#afbeff}.story-note{color:var(--lime);font-size:.875rem;margin:23px 0 0;line-height:1.5}.flow{border-top:1px solid var(--line);border-bottom:1px solid var(--line);display:grid;grid-template-columns:repeat(3,1fr);padding:26px 0;gap:25px}.flow-item{display:flex;align-items:center;gap:18px}.flow-no{font-size:.75rem;display:grid;place-items:center;border:1px solid #c5cfef;border-radius:50%;min-width:30px;height:30px;color:var(--blue);font-weight:700}.flow-item strong{font-size:.95rem;display:block;margin-bottom:4px}.flow-item span:not(.flow-no){color:var(--muted);font-size:.875rem}.section{padding:92px 0}.section-top{display:flex;justify-content:space-between;gap:44px;align-items:flex-end;margin-bottom:34px}.section-top h2{max-width:620px;margin-bottom:0}.section-top p{max-width:310px;color:var(--muted);margin-bottom:0}.tabs{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:25px}.tabs button{background:white;color:var(--muted);padding:14px 21px;border-radius:99px;border:1px solid var(--line);font-size:.95rem;font-weight:600}.tabs button[aria-selected=true]{background:var(--ink);color:white;border-color:var(--ink)}.tabs button span{opacity:.6;margin-right:9px}.example-card{border:1px solid var(--line);border-radius:28px;overflow:hidden;background:white}.example-heading{padding:30px 34px;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:16px}.example-heading h3{margin:0;font-size:1.4rem}.example-number{color:var(--blue);font-size:.85rem;letter-spacing:.08em}.comparison{display:grid;grid-template-columns:.75fr 1.25fr}.before,.after{padding:32px 34px}.before{background:#f0f2f7}.after{background:#f2f7e8}.label{font-size:.75rem;text-transform:uppercase;letter-spacing:.08em;font-weight:700;display:block;margin-bottom:17px;color:#687286}.after .label{color:#3d6423}.before blockquote{font-size:1.35rem;line-height:1.45;letter-spacing:-.02em;margin:0 0 22px;font-weight:500}.before p{color:var(--muted);font-size:.95rem;margin:0}.after blockquote{font-size:1rem;line-height:1.7;margin:0 0 22px}.copy{display:inline-flex;align-items:center;gap:8px;background:white;border:1px solid #c7d8b4;color:#2e4d1b;border-radius:99px;padding:11px 17px;font-size:.875rem;font-weight:600}.copy:hover{background:#e9f0df}.copy svg{width:16px;height:16px;flex:none}.result{padding:27px 34px;display:grid;grid-template-columns:120px 1fr;gap:20px}.result .label{color:var(--blue);padding-top:5px}.result p{margin:0;font-size:1.05rem}.takeaway{margin-top:27px;text-align:center;color:var(--blue);font-size:1.05rem;font-weight:600}.five{display:grid;grid-template-columns:1fr 1.12fr;gap:100px;align-items:start}.five-intro{position:sticky;top:40px}.five h2{margin-bottom:22px}.five p{color:var(--muted);font-size:1.05rem}.recipe{list-style:none;padding:0;margin:0}.recipe li{padding:21px 0;display:flex;gap:20px;border-bottom:1px solid var(--line)}.recipe li:first-child{padding-top:0}.recipe .num{font-size:.8rem;color:var(--blue);font-weight:700;padding-top:5px}.recipe h3{margin:0 0 8px;font-size:1.1rem}.recipe p{margin:0;font-size:.98rem}.mistake{border-left:3px solid var(--blue);padding-left:20px;margin-top:30px}.mistake .label{margin-bottom:12px}.mistake p{font-size:.95rem;color:var(--ink);margin-bottom:9px}.start{background:var(--ink);color:white;border-radius:32px;padding:54px;display:grid;grid-template-columns:1fr 1.15fr;gap:60px;margin:10px 0 76px}.start .eyebrow{color:var(--lime)}.start h2{font-size:2.8rem;margin-bottom:20px}.start p{color:#c2c8d9}.start ol{list-style:none;counter-reset:steps;margin:0;padding:0}.start li{counter-increment:steps;position:relative;padding:0 0 24px 40px;line-height:1.65;color:#d4d9e5}.start li:before{content:counter(steps);position:absolute;left:0;color:var(--lime);font-weight:700}.start .btn{background:var(--lime);color:var(--ink);margin-top:8px}.start .btn:hover{background:#daf16e}.footer{display:flex;justify-content:space-between;gap:40px;padding:0 0 40px;font-size:.8rem;color:var(--muted);line-height:1.6}.footer p{max-width:650px;margin:0}.footer a{text-underline-offset:4px}.footer-links{display:flex;gap:20px;white-space:nowrap;align-items:flex-start}.skip{position:absolute;left:12px;top:-80px;background:var(--ink);color:white;padding:14px;z-index:20}.skip:focus{top:12px}#toast{position:fixed;bottom:24px;left:50%;transform:translate(-50%,20px);background:var(--ink);color:white;padding:14px 24px;border-radius:12px;max-width:calc(100% - 32px);opacity:0;pointer-events:none;transition:.2s;z-index:30;box-shadow:0 6px 24px #17213c30}#toast.show{opacity:1;transform:translate(-50%,0)}.mascot{display:block;position:absolute;width:142px;height:142px;object-fit:contain;right:-30px;top:-88px;transform:rotate(-8deg);filter:drop-shadow(0 8px 10px #17213c1a)}
@media(min-width:1400px){.hero{padding-top:85px;padding-bottom:95px}}
@media(max-width:1000px){.nav{padding:22px 28px}.wrap{padding:0 28px}.hero{gap:35px}.hero-story{padding:24px;transform:none}.bubble.new{margin-left:12px}.five{gap:45px}.start{gap:30px;padding:38px}.start h2{font-size:2.3rem}}
@media(max-width:720px){html{scroll-padding-top:24px}.nav{padding:20px}.nav-right{gap:16px}.nav-right>a{display:none}.wrap{padding:0 20px}.hero{grid-template-columns:1fr;padding:35px 0 40px;gap:40px}h1{font-size:clamp(3rem,12.5vw,5rem)}.hero-story{margin:0 3px}.eyebrow{font-size:.75rem;margin-bottom:18px}.intro{font-size:1.05rem}.flow{grid-template-columns:1fr;gap:20px;padding:24px 0}.flow-item{gap:14px}.section{padding:56px 0}.section-top{display:block}.section-top p{margin-top:20px;max-width:none}.tabs{gap:7px}.tabs button{font-size:.875rem;padding:12px 14px}.tabs button span{margin-right:5px}.comparison{grid-template-columns:1fr}.example-heading{padding:23px}.example-heading h3{font-size:1.2rem}.before,.after{padding:26px 23px}.before blockquote{font-size:1.2rem}.result{grid-template-columns:1fr;gap:0;padding:26px 23px}.result .label{margin-bottom:9px}.five{grid-template-columns:1fr;gap:32px}.five-intro{position:static}.start{grid-template-columns:1fr;padding:30px 24px;gap:16px;margin-bottom:40px;border-radius:25px}.start h2{font-size:2.1rem}.footer{display:block}.footer-links{margin-top:22px;flex-wrap:wrap}.mascot{width:106px;height:106px;right:5px;top:-54px}.takeaway{text-align:left}.hero:has(.mascot){gap:60px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}.btn:hover{transform:none}}

.share{display:block;color:#d9e1f3;background:none;padding:14px 0 0;font-size:.875rem;text-decoration:underline;text-underline-offset:5px}.share:hover{color:var(--lime)}.tabs button{min-height:44px}.example-card[role=tabpanel]:focus-visible{outline:3px solid #f88f35;outline-offset:5px}
