:root{font-family:Segoe UI,Arial,sans-serif;color:#0b2f5c;background:#f5f7fb}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0}.topbar{background:#08376c;color:white;display:flex;align-items:center;justify-content:space-between;padding:20px max(4vw,24px);gap:20px}.brand{font-size:29px;font-weight:750;display:flex;align-items:center;gap:16px}.brand-icon{font-size:38px;color:#e4efff}.topbar nav{display:flex;gap:35px}.topbar a{color:white;text-decoration:none;font-weight:600}.topbar a:hover{text-decoration:underline}.hero{position:relative;min-height:470px;background:#437da8 url('banque.svg') center center/cover no-repeat;display:flex;align-items:center;justify-content:space-between;gap:40px;padding:52px max(4vw,24px)}.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(4,44,88,.78),rgba(10,61,103,.28) 65%,rgba(6,39,76,.18));pointer-events:none}.hero-copy,.login-card{position:relative;z-index:1}.hero-copy{max-width:630px;color:white;text-shadow:0 1px 4px #244966}.eyebrow{display:inline-block;padding:10px 16px;background:#2c72b6;color:white;border-radius:30px;font-size:13px;font-weight:700;letter-spacing:.06em}.hero h1{font-size:clamp(36px,4.7vw,66px);line-height:1.1;margin:23px 0}.hero-copy p{font-size:21px;line-height:1.6}.login-card{width:min(355px,100%);background:white;border-radius:12px;padding:28px;box-shadow:0 12px 38px #0c305c45;color:#123a68}.login-card h2{margin:0 0 20px;font-size:24px}.login-card label,.transaction label{font-size:13px;display:block;margin:12px 0 6px;font-weight:700}.login-card input,.transaction input,.transaction select{width:100%;padding:12px;border:1px solid #cbd6e4;border-radius:6px;font:inherit}.login-card button,.transaction button,button.secondary{width:100%;padding:13px;border:0;border-radius:6px;background:#1165ba;color:white;font-size:15px;font-weight:700;cursor:pointer;margin-top:18px}.hint{font-size:12px;color:#5b6d83;line-height:1.5}.services{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;padding:28px max(4vw,24px)}.services article{background:white;border-radius:10px;padding:26px;box-shadow:0 5px 18px #173b6014}.services h3{font-size:19px;margin:16px 0 8px}.services p{color:#5b6d83;line-height:1.5;margin:0}.symbol{display:grid;place-items:center;width:65px;height:65px;border-radius:50%;font-size:32px;color:white;font-weight:700}.blue{background:#1977ee}.green{background:#17a35c}.orange{background:#fa8b23}.purple{background:#7b4be3}.dashboard,.about{margin:25px max(4vw,24px);padding:28px;background:white;border-radius:12px;box-shadow:0 5px 18px #173b6014}.hidden{display:none}.dashboard-head{display:flex;justify-content:space-between;align-items:center;gap:25px}.dark{background:#dce9f7;color:#0c457b}.dashboard-head .secondary{width:auto;margin:0}.balance{display:flex;flex-direction:column;gap:8px;background:#08376c;color:white;border-radius:10px;padding:24px;margin:22px 0}.balance strong{font-size:38px}.transaction{display:grid;grid-template-columns:1fr 1fr;gap:10px 20px;align-items:end}.transaction label{grid-row:1}.transaction input,.transaction select{grid-row:2}.transaction button{grid-column:1/-1}.about p{color:#5b6d83;line-height:1.6}#history li{padding:8px 0;border-bottom:1px solid #e3e9f0}footer{background:#08376c;color:#dbe9fb;display:flex;justify-content:space-between;gap:20px;padding:22px max(4vw,24px);font-size:13px}@media(max-width:950px){.services{grid-template-columns:repeat(2,1fr)}.hero{flex-direction:column;align-items:stretch}.login-card{width:100%;max-width:440px}.hero-copy{max-width:100%}}@media(max-width:600px){.topbar{flex-direction:column;align-items:flex-start}.brand{font-size:23px}.topbar nav{gap:18px}.services{grid-template-columns:1fr}.transaction{display:block}.transaction input,.transaction select{margin-bottom:12px}.dashboard-head,footer{flex-direction:column}.hero-copy p{font-size:17px}}