:root { --navy:#063560; --navy-deep:#042846; --teal:#0db19e; --mint:#c8eee7; --paper:#f7f8f5; --ink:#08345d; --muted:#668093; --line:#dbe5e4; --sand:#eff3ee; }
* { box-sizing:border-box; } html { scroll-behavior:smooth; } body { margin:0; color:var(--ink); background:var(--paper); font:16px/1.55 "DM Sans",sans-serif; } a { color:inherit; text-decoration:none; } .site-nav { height:88px; max-width:1240px; margin:auto; padding:12px 34px; display:flex; align-items:center; justify-content:space-between; } .brand img { display:block; width:116px; height:64px; object-fit:contain; object-position:left center; } .nav-links { display:flex; align-items:center; gap:28px; font-size:.9rem; font-weight:600; } .nav-links>a:not(.nav-cta) { color:#466477; } .nav-cta { background:var(--navy); color:white; border-radius:999px; padding:11px 17px; } .nav-cta span { color:var(--teal); margin-left:5px; }
.hero { max-width:1240px; min-height:620px; margin:auto; padding:94px 34px 74px; display:grid; grid-template-columns:1.05fr .95fr; align-items:center; gap:54px; overflow:hidden; } .eyebrow { margin:0 0 17px; color:var(--teal); font-size:.73rem; font-weight:700; text-transform:uppercase; letter-spacing:.14em; } .eyebrow i { width:24px; height:2px; display:inline-block; vertical-align:middle; margin:-2px 9px 0 0; background:currentColor; } h1,h2,h3,p { margin-top:0; } h1,h2,h3 { font-family:Manrope,sans-serif; } h1 { font-size:clamp(3.2rem,5.4vw,5.5rem); line-height:1.04; letter-spacing:-.065em; margin-bottom:25px; } em { color:var(--teal); font-style:normal; } .hero-lede { max-width:500px; color:#547187; font-size:1.1rem; } .hero-actions { margin-top:35px; display:flex; align-items:center; gap:27px; } .button { display:inline-flex; align-items:center; justify-content:center; gap:16px; padding:14px 20px; border-radius:7px; font-weight:700; font-size:.93rem; } .button span { font-size:1.25rem; line-height:1; } .button-primary { background:var(--teal); color:#fff; box-shadow:0 10px 26px rgba(13,177,158,.2); } .button-dark { background:var(--navy); color:#fff; } .text-link { font-weight:700; font-size:.93rem; } .text-link span { color:var(--teal); margin-left:8px; font-size:1.1rem; } .small-print { color:#8aa0ae; font-size:.78rem; margin-top:25px; }
.hero-visual { position:relative; height:455px; background:linear-gradient(135deg,#e2f2ef,#eef5f2); border-radius:34px; overflow:hidden; } .halo { position:absolute; border-radius:50%; border:1px solid rgba(13,177,158,.22); } .halo-one { width:480px;height:480px;top:-168px;right:-125px; } .halo-two { width:360px;height:360px;bottom:-230px;left:-150px; } .hero-card { position:absolute; padding:20px; border-radius:15px; background:rgba(255,255,255,.94); box-shadow:0 20px 45px rgba(13,59,84,.12); } .hero-card span { color:#70899a; font-size:.73rem; display:block; margin-bottom:6px; } .hero-card strong { font-family:Manrope; font-size:1.55rem; letter-spacing:-.05em; } .hero-card small { font:600 .7rem "DM Sans"; letter-spacing:0; color:#7c919e; } .hero-card b { display:block; font-size:.67rem; margin-top:4px; color:var(--teal); } .card-balance { left:52px; top:53px; width:205px; } .card-goal { right:42px; top:175px; width:192px; } .goal-line { background:#deedeb; height:7px; border-radius:9px; margin:12px 0 8px; overflow:hidden; } .goal-line i { display:block; width:70%;height:100%; background:var(--teal); border-radius:inherit; } .card-spend { bottom:42px; left:111px; width:220px; } .bars { height:45px; display:flex; align-items:end; gap:6px; margin:8px 0; } .bars i { width:13px; background:var(--teal); border-radius:4px 4px 0 0; opacity:.6; } .bars i:nth-child(1){height:25%}.bars i:nth-child(2){height:55%}.bars i:nth-child(3){height:37%}.bars i:nth-child(4){height:85%}.bars i:nth-child(5){height:60%}.bars i:nth-child(6){height:100%}.bars i:nth-child(7){height:65%} .hero-orbit { position:absolute; right:63px; bottom:55px; width:68px;height:68px;border-radius:50%;background:var(--navy);color:#bceee4;display:grid;place-items:center;font:bold 2rem Manrope;box-shadow:0 10px 25px #08345d44; }
.intro { border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:55px max(34px,calc((100vw - 1172px)/2)); display:grid; grid-template-columns:1fr 1fr; gap:100px; background:#fff; } .intro p:first-child { font:700 clamp(1.55rem,2.5vw,2.3rem)/1.18 Manrope; letter-spacing:-.05em; } .intro strong { color:var(--teal); } .intro p:last-child { max-width:430px; color:#5b7486; font-size:1.05rem; }
.budget-section { padding:116px max(34px,calc((100vw - 1172px)/2)); background:#eff6f3; } .section-heading { max-width:600px; }.section-heading h2,.values h2,.privacy h2,.closing h2 { font-size:clamp(2.4rem,4.1vw,4.2rem); line-height:1.08; letter-spacing:-.06em; margin-bottom:20px; } .section-heading>p:last-child { color:#557385; max-width:520px; font-size:1.05rem; } .budget-layout { display:grid; grid-template-columns:1.4fr .7fr; gap:60px; align-items:start; margin-top:54px; } .budget-window { background:#fff; border:1px solid #d8e6e3; border-radius:13px; overflow:hidden; box-shadow:0 18px 55px rgba(6,53,96,.1); } .window-top { height:47px; padding:0 16px; display:flex;align-items:center;gap:6px;border-bottom:1px solid #e7efed;color:#91a5ae;font-size:.72rem; }.window-top>span { width:8px;height:8px;border-radius:50%;background:#cfdddb;}.window-top b { margin:auto;font:700 .79rem Manrope;color:var(--navy);}.window-top em{font-style:normal}.window-body{padding:32px}.welcome span,.category-list>span {font-size:.75rem;color:#7c939f}.welcome strong{display:block;font:700 1.45rem Manrope;letter-spacing:-.04em}.summary-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:27px 0}.summary-grid>div{border-radius:9px;padding:17px;background:#eff8f6}.summary-grid>div:nth-child(2){background:#f2f6fb}.summary-grid span,.summary-grid b{display:block;font-size:.7rem;color:#75909a}.summary-grid strong{font:700 1.3rem Manrope;letter-spacing:-.045em}.summary-grid .green{color:var(--teal)}.category-list{border-top:1px solid #e6eeec;padding-top:20px}.category-list>div{display:flex;gap:8px;align-items:center;padding:12px 0;border-bottom:1px solid #eef3f2;font-size:.83rem}.category-list i{font-style:normal;font-size:.8rem}.food{color:#ffad6b}.home{color:#1b9bca}.life{color:#ae8dd5}.category-list b{margin-left:auto;font-weight:600}.category-list small{font-weight:400;color:#8ba0a9}.budget-side>div{padding:0 0 20px 45px;position:relative}.number{position:absolute;left:0;top:1px;color:var(--teal);font:700 .75rem Manrope}.budget-side h3{font-size:1.05rem;letter-spacing:-.025em;margin:0 0 5px}.budget-side p{color:#5d7788;font-size:.9rem;margin:0}.budget-side .button{margin:14px 0 0 45px}
.values { padding:116px max(34px,calc((100vw - 1172px)/2)); }.values-heading { margin-bottom:55px; }.value-grid { border-top:1px solid var(--line); display:grid;grid-template-columns:repeat(4,1fr);}.value-grid article{min-height:220px;padding:27px 24px;border-right:1px solid var(--line)}.value-grid article:first-child{padding-left:0}.value-grid article:last-child{border:0}.value-grid span{color:var(--teal);font:700 .75rem Manrope}.value-grid h3{font-size:1.42rem;letter-spacing:-.04em;margin:49px 0 8px}.value-grid p{color:#607b8b;font-size:.9rem;max-width:190px}
.privacy { padding:108px max(34px,calc((100vw - 1172px)/2)); background:var(--navy); color:white;display:grid;grid-template-columns:1fr 1fr;gap:100px; }.privacy .eyebrow{color:#6de0d0}.privacy h2{margin:0}.privacy-copy{max-width:460px;color:#c2d4dc;font-size:1.05rem}.privacy-copy ul{padding:0;margin:29px 0;list-style:none}.privacy-copy li{margin:12px 0;color:white;font-weight:600;font-size:.94rem}.privacy-copy li:before{content:'✓';color:#59dec9;margin-right:10px}.privacy-copy .text-link{color:#fff}.closing{text-align:center;padding:120px 30px}.closing .eyebrow{justify-content:center}.closing h2{margin-bottom:18px}.closing>p:not(.eyebrow){color:#637c8c;max-width:460px;margin:0 auto 30px}.closing .button{margin:auto}footer{border-top:1px solid var(--line);padding:23px max(34px,calc((100vw - 1172px)/2));display:flex;align-items:center;justify-content:space-between;gap:20px;color:#718894;font-size:.78rem}.footer-brand img{width:84px;height:37px;object-fit:contain}.footer-brand{line-height:0}footer div{display:flex;gap:17px;color:var(--navy);font-weight:600}
@media (max-width:800px){.site-nav{padding:10px 22px;height:76px}.brand img{width:95px;height:54px}.nav-links{gap:14px;font-size:.82rem}.nav-links>a:not(.nav-cta){display:none}.hero{grid-template-columns:1fr;padding:64px 24px 58px;gap:45px;min-height:0}.hero-visual{height:360px}.card-balance{left:24px;top:36px}.card-goal{right:22px;top:142px}.card-spend{left:64px;bottom:24px}.hero-orbit{right:25px;bottom:22px}.intro,.privacy{grid-template-columns:1fr;gap:18px;padding:48px 24px}.budget-section,.values{padding:74px 24px}.budget-layout{grid-template-columns:1fr;gap:42px}.window-body{padding:22px}.values-heading{margin-bottom:35px}.value-grid{grid-template-columns:1fr 1fr}.value-grid article,.value-grid article:first-child{padding:22px 15px;border-bottom:1px solid var(--line)}.value-grid article:nth-child(2){border-right:0}.value-grid article:nth-child(3),.value-grid article:nth-child(4){border-bottom:0}.value-grid h3{margin-top:35px}.closing{padding:80px 24px}footer{padding:18px 24px;flex-wrap:wrap}.footer-brand{order:1}footer span{order:3;width:100%}footer div{order:2}}
@media (max-width:420px){h1{font-size:3rem}.hero-actions{align-items:flex-start;flex-direction:column;gap:20px}.summary-grid{grid-template-columns:1fr}.hero-visual{margin:0 -4px}.card-goal{transform:scale(.86);transform-origin:right top}.card-spend{transform:scale(.88);transform-origin:left bottom}.value-grid{grid-template-columns:1fr}.value-grid article,.value-grid article:nth-child(3){border-right:0;border-bottom:1px solid var(--line)}.value-grid article:last-child{border-bottom:0}}

/* Internationalization, theme controls, and dark mode */
:root{--page:var(--paper);--surface:#fff;--surface-soft:#eff6f3;--heading:var(--ink);--body:#547187;--nav-bg:rgba(247,248,245,.88);--card:#fff;--card-soft:#eff8f6;--rule:var(--line)}
[data-theme="dark"]{--page:#071c31;--surface:#0c2942;--surface-soft:#0a3346;--heading:#f3fbfa;--body:#b7cbd4;--nav-bg:rgba(7,28,49,.88);--card:#103851;--card-soft:#123d50;--rule:#1d4961;--navy:#d9f5ef;--ink:#f3fbfa;--teal:#42cfbd;--muted:#a9c5d0;--line:#1d4961;--sand:#0a3346}
body{background:var(--page);color:var(--heading);transition:background .25s ease,color .25s ease}.site-nav{position:relative;z-index:30;background:var(--nav-bg);backdrop-filter:blur(14px) saturate(150%);-webkit-backdrop-filter:blur(14px) saturate(150%);transition:box-shadow .2s ease,background .25s ease}.site-nav.is-scrolled{box-shadow:0 6px 24px rgba(4,40,70,.11)}.nav-cta span{color:inherit;margin:0}.nav-cta b{color:var(--teal);margin-left:5px}.nav-divider{width:1px;height:19px;background:var(--rule);margin-left:-12px}.nav-btn{display:grid;place-items:center;width:34px;height:34px;padding:0;border:1px solid var(--rule);border-radius:50%;background:transparent;color:var(--heading);font:700 .9rem "DM Sans",sans-serif;cursor:pointer;transition:background .15s,border-color .15s}.nav-btn:hover{background:var(--surface-soft);border-color:var(--teal)}.lang-dropdown{position:relative}.lang-menu{display:none;position:absolute;right:0;top:43px;width:158px;padding:6px;background:var(--surface);border:1px solid var(--rule);border-radius:10px;box-shadow:0 16px 34px rgba(0,0,0,.16)}.lang-menu.open{display:block}.lang-menu button{display:block;width:100%;padding:8px 9px;border:0;border-radius:7px;background:transparent;color:var(--heading);font:600 .84rem "DM Sans",sans-serif;text-align:left;cursor:pointer}.lang-menu button:hover{background:var(--surface-soft)}
.hero-visual,.budget-section{background:var(--surface-soft)}.hero-lede,.intro p:last-child,.section-heading>p:last-child,.budget-side p,.value-grid p,.closing>p:not(.eyebrow){color:var(--body)}.intro{background:var(--surface);border-color:var(--rule)}.budget-window,.hero-card{background:var(--card);border-color:var(--rule)}.window-top,.category-list,.category-list>div{border-color:var(--rule)}.summary-grid>div{background:var(--card-soft)}.summary-grid>div:nth-child(2){background:color-mix(in srgb,var(--card) 76%,var(--teal) 8%)}.summary-grid span,.summary-grid b,.welcome span,.category-list>span,.window-top{color:var(--body)}.welcome strong,.window-top b{color:var(--heading)}.privacy{background:#062a48}.privacy-copy{color:#c4d6df}.values,.closing{background:var(--page)}footer{border-color:var(--rule);color:var(--body)}footer div{color:var(--heading)}.hero-card{box-shadow:0 20px 45px rgba(0,0,0,.16)}[data-theme="dark"] .hero-visual{background:linear-gradient(135deg,#09394d,#0b3149)}[data-theme="dark"] .hero-card small,.category-list small{color:#a8c1ca}[data-theme="dark"] .hero-orbit{background:#d9f5ef;color:#063560}[data-theme="dark"] .button-dark{background:#d9f5ef;color:#063560}
@media(max-width:800px){.nav-divider{display:none}.nav-links{gap:9px}.lang-menu{right:-38px}.nav-cta{padding:9px 12px}}

/* High-contrast navigation and a purpose-made logo treatment. */
.site-nav{height:124px;padding-top:8px;padding-bottom:8px}.brand{width:118px;height:108px;display:flex;align-items:center;justify-content:center;flex:0 0 118px}.brand img{width:106px;height:106px;object-fit:contain;object-position:center}.logo-dark{display:none!important}[data-theme="dark"] .logo-light{display:none!important}[data-theme="dark"] .logo-dark{display:block!important}.nav-links>a:not(.nav-cta){color:#244d68}.nav-cta{background:var(--navy);color:#fff;box-shadow:none}.nav-cta b{color:#8ff0df}.nav-links>a:not(.nav-cta):hover{color:var(--navy);text-decoration:underline;text-underline-offset:5px}[data-theme="dark"] .nav-links>a:not(.nav-cta){color:#c6dce4}[data-theme="dark"] .nav-links>a:not(.nav-cta):hover{color:#fff}[data-theme="dark"] .nav-cta{background:var(--teal);color:#062a48}[data-theme="dark"] .nav-cta b{color:#062a48}[data-theme="dark"] .nav-btn{border-color:#326078;color:#fff}[data-theme="dark"] .nav-btn:hover{background:#16455c;border-color:#70e5d5}.hero h1,.section-heading h2,.values h2,.privacy h2,.closing h2{color:var(--heading)}.button-primary{background:var(--teal);color:#062a48}.button-primary b{color:#062a48}.button-dark{color:#fff}.text-link{color:var(--heading)}.text-link b{color:var(--teal)}[data-theme="dark"] .button-primary{background:var(--teal);color:#062a48}.footer-brand{width:64px;height:64px;display:flex;align-items:center;justify-content:center}.footer-brand img{width:54px;height:58px;object-fit:contain}.footer-brand .logo-dark{display:none!important}[data-theme="dark"] .footer-brand .logo-light{display:none!important}[data-theme="dark"] .footer-brand .logo-dark{display:block!important}
@media(max-width:800px){.site-nav{height:94px;padding:5px 18px}.brand{width:82px;height:82px;flex-basis:82px}.brand img{width:78px;height:78px}.nav-links{margin-left:auto}.footer-brand{width:54px;height:54px}.footer-brand img{width:47px;height:50px}}

/* A horizontal, readable brand lockup; only the descriptor changes by language. */
.site-nav{height:104px}.brand{width:218px;height:82px;flex-basis:218px;gap:10px;justify-content:flex-start}.brand img.brand-mark{width:70px;height:58px;object-fit:contain;flex:0 0 70px}.brand-word{display:flex;flex-direction:column;align-items:flex-start;line-height:1}.brand-word strong{font:800 1.72rem/1 "Manrope",sans-serif;letter-spacing:-.075em;color:#063560}.brand-word strong span{color:#0db19e}.brand-word small{margin-top:5px;color:#40677d;font:700 .5rem/1 "DM Sans",sans-serif;letter-spacing:.13em;text-transform:uppercase;white-space:nowrap}.footer-brand{width:150px;height:56px;gap:7px;justify-content:flex-start}.footer-brand img.brand-mark{width:43px;height:38px;object-fit:contain;flex:0 0 43px}.footer-brand .brand-word strong{font-size:1.1rem}.footer-brand .brand-word small{font-size:.34rem;margin-top:3px}[data-theme="dark"] .brand-word strong{color:#f7fffe}[data-theme="dark"] .brand-word strong span{color:#42cfbd}[data-theme="dark"] .brand-word small{color:#b7d6dd}
@media(max-width:800px){.site-nav{height:88px}.brand{width:165px;height:68px;flex-basis:165px;gap:7px}.brand img.brand-mark{width:52px;height:46px;flex-basis:52px}.brand-word strong{font-size:1.33rem}.brand-word small{font-size:.38rem;margin-top:4px}.footer-brand{width:135px}.footer-brand img.brand-mark{width:38px;height:34px;flex-basis:38px}}

/* The app entry point stays compact in every locale and never crowds mobile controls. */
.nav-cta{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-width:74px;white-space:nowrap}.nav-cta b{margin:0}@media(max-width:800px){.nav-cta{min-width:0;height:36px;padding:8px 11px;font-size:.78rem;line-height:1}.nav-links{min-width:0;flex:1;justify-content:flex-end}.nav-links>a:not(.nav-cta){display:none}}@media(max-width:390px){.site-nav{padding-left:12px;padding-right:12px}.brand{width:143px;flex-basis:143px}.brand img.brand-mark{width:44px;flex-basis:44px}.brand-word strong{font-size:1.17rem}.brand-word small{font-size:.33rem}.nav-cta{width:36px;min-width:36px;padding:0}.nav-cta span{display:none}.nav-cta b{font-size:1.1rem}}

.app-name{font-size:clamp(3.5rem,6.1vw,6.2rem)!important;line-height:.9!important;letter-spacing:-.085em!important;margin:0 0 20px!important}.app-headline{max-width:720px;color:var(--body);font:700 clamp(1.85rem,3vw,2.75rem)/1.13 "Manrope",sans-serif;letter-spacing:-.055em;margin:0 0 25px}.app-headline em{color:var(--teal)}.app-availability{display:flex;flex-direction:column;align-items:center;gap:5px;width:fit-content;margin:14px auto 0;padding:15px 20px;min-width:220px;border:1px solid var(--rule);border-radius:9px;background:var(--card);text-align:center}.budget-side>.app-availability{padding:15px 20px;margin-left:auto;margin-right:auto}.app-availability strong{font:700 1.22rem/1.1 "Manrope",sans-serif;letter-spacing:-.03em;color:var(--heading)}.app-availability>span{display:flex;align-items:center;justify-content:center;gap:7px;color:var(--teal);font-size:.78rem;font-weight:700}.app-availability i{width:7px;height:7px;border-radius:50%;background:currentColor}@media(max-width:800px){.app-name{font-size:3rem!important}.app-headline{font-size:2rem}.app-availability{margin:14px auto 0}}

/* The privacy statement must remain readable against the deep navy field. */
.privacy h2{color:#f7fffe!important}.privacy h2 em{color:#42cfbd!important}.privacy-copy{color:#d6e3e8!important}.privacy-copy li{color:#f7fffe!important}.privacy-copy .text-link{color:#63e0d0!important}.privacy .eyebrow{color:#63e0d0!important}