:root{--ink:#11284b;--muted:#65758e;--brand:#0964d9;--brand-dark:#0649a6;--accent:#d7eeff;--line:#dfe7f2;--paper:#f5f8fd;--shadow:0 14px 45px #123c7808}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:100px}body{margin:0;font-family:Manrope,'Segoe UI',sans-serif;background:var(--paper);color:var(--ink);font-size:14px;line-height:1.65}a{text-decoration:none;color:inherit}button,input,textarea,select{font:inherit}button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}button{cursor:pointer}a,button{transition:background .2s,transform .2s,box-shadow .2s,color .2s}a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #159df5;outline-offset:3px}button:disabled{opacity:.6;cursor:wait}::selection{background:var(--accent);color:var(--ink)}.wrap{width:min(1280px,90%);margin:auto}.top{position:sticky;top:0;z-index:40;background:#ffffffed;backdrop-filter:blur(20px);border-bottom:1px solid var(--line)}.nav{height:84px;display:flex;align-items:center;justify-content:space-between;gap:20px}.brand{display:flex;gap:12px;align-items:center;font-size:17px;font-weight:800;letter-spacing:-.6px}.brand img{width:44px;height:44px;object-fit:cover;border-radius:12px}.brand em{font-style:normal;color:var(--brand)}.links{display:flex;align-items:center;gap:28px;font-size:13px;font-weight:700}.links a:hover{color:var(--brand)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:46px;padding:12px 21px;border:1px solid transparent;border-radius:10px;font-weight:700;font-size:13px;line-height:1.4}.btn:hover{transform:translateY(-2px)}.primary{background:var(--brand);color:white;box-shadow:0 4px 10px #0964d912}.primary:hover{background:var(--brand-dark);color:white!important;box-shadow:0 8px 20px #0964d925}.secondary{background:white;border-color:var(--line);color:var(--ink)}.secondary:hover{background:#edf5ff}.tag{display:flex;align-items:center;gap:9px;color:var(--brand);font-weight:800;font-size:10px;letter-spacing:2px;text-transform:uppercase}.tag:before{content:'';width:6px;height:6px;flex-shrink:0;border-radius:50%;background:currentColor}.hero{padding:90px 0 80px;background:radial-gradient(ellipse at 88% 25%,#d5edff,transparent 45%),#f5f9ff;overflow:hidden}.grid2{display:grid;grid-template-columns:1.05fr .95fr;gap:70px;align-items:center}.hero h1{font-size:clamp(42px,5.4vw,72px);font-weight:800;letter-spacing:-3.7px;line-height:1.09;margin:24px 0}.hero h1 span{color:var(--brand)}.lead{font-size:16px;color:var(--muted);max-width:530px;line-height:1.9}.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:30px}.hero-note{display:flex;align-items:center;gap:10px;margin-top:28px;color:#61758e;font-size:11px}.hero-note:before{content:'✓';background:#e1f0ff;border-radius:50%;padding:2px 6px;color:var(--brand)}.visual{position:relative;padding:30px 24px;min-height:400px;border-radius:24px;background:#07357e;transform:rotate(-2deg);box-shadow:0 28px 70px #083d8620}.preview-top{display:flex;align-items:center;justify-content:space-between;color:#b5d5f6;font-size:10px;padding-bottom:24px;border-bottom:1px solid #ffffff18}.preview-top b{color:#fff;font-size:13px}.preview-dot{color:#8dd8ff}.preview-title{color:#fff;font-size:23px;font-weight:700;letter-spacing:-.7px;margin:25px 0 18px}.preview-cards{display:grid;grid-template-columns:1fr 1fr;gap:12px}.preview-card{border:1px solid #ffffff20;border-radius:12px;padding:17px;color:#c5dcf7;font-size:10px;background:#ffffff06}.preview-card strong{display:block;font-size:25px;color:#fff;margin:7px 0}.preview-card.accent{background:var(--accent);color:#28558b;border:0}.preview-card.accent strong{color:#073778}.preview-project{background:#fff;border-radius:12px;padding:17px;margin-top:16px;display:flex;align-items:center;gap:12px}.preview-icon{background:#e9f3ff;color:var(--brand);padding:10px;border-radius:10px;font-size:18px}.preview-project b{font-size:12px}.preview-project small{display:block;font-size:10px;color:var(--muted)}.preview-project .progress{margin-top:9px;min-width:200px;height:5px}.preview-caption{display:block;color:#a8cef4;font-size:9px;text-align:right;margin-top:17px}.float{position:absolute;right:-20px;bottom:-22px;border:1px solid var(--line);border-radius:12px;background:#fff;padding:15px 20px;box-shadow:var(--shadow);font-size:12px;transform:rotate(2deg)}.float small{color:var(--muted)}.trust-strip{background:#fff;border-block:1px solid var(--line);padding:24px 0}.trust-strip .wrap{display:flex;justify-content:space-between;gap:20px;align-items:center;color:#61758d;font-size:12px;font-weight:600}.trust-strip b{color:#12376b}.section{padding:85px 0}.head{max-width:700px;margin-bottom:35px}.head h2,.copy h2{font-size:clamp(30px,3vw,43px);letter-spacing:-1.8px;line-height:1.2;margin:14px 0}.muted{color:var(--muted)}.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.card{background:#fff;border:1px solid var(--line);border-radius:16px;padding:26px;transition:transform .25s,box-shadow .25s,border-color .25s}.card:hover{transform:translateY(-5px);border-color:#accdf6;box-shadow:var(--shadow)}.card h3{font-size:17px;letter-spacing:-.5px;line-height:1.4}.card p{font-size:12px;line-height:1.9}.ico{display:grid;place-items:center;width:43px;height:43px;border-radius:11px;background:#e9f3ff;color:var(--brand);font-size:20px}.price{font-size:11px;font-weight:800;color:var(--brand);border-top:1px solid var(--line);padding-top:16px;margin-top:22px}.card-link{display:flex;justify-content:space-between;align-items:center;margin-top:17px;font-size:11px;font-weight:800}.card-link span{font-size:20px;color:var(--brand)}#serviceCards{grid-template-columns:repeat(3,1fr)}#serviceCards .card:last-child{grid-column:span 2;background:#edf5ff}.dark{background:#07357e;color:#fff}.dark .muted{color:#c0d9f7}.dark .tag{color:var(--accent)}.features{display:flex;flex-wrap:wrap;gap:9px;margin:25px 0}.features span{padding:7px 12px;font-size:11px;border:1px solid #ffffff22;border-radius:6px;color:#deebff}.dashboard{background:#fff;border-radius:17px;padding:28px;color:var(--ink);box-shadow:0 25px 70px #0002}.dashboard>b{font-size:13px}.metrics{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:20px}.metric{padding:17px;border:1px solid var(--line);border-radius:10px;background:#f7faff}.metric small{display:block;color:var(--muted);font-size:10px}.metric strong{font-size:21px;letter-spacing:-.8px}.bars{height:125px;display:flex;align-items:end;gap:14px;margin-top:22px;border-bottom:1px solid var(--line)}.bars i{flex:1;background:#4d9cec;border-radius:5px 5px 0 0;height:44%;transform-origin:bottom;animation:grow .9s ease both}.bars i:nth-child(2){height:69%}.bars i:nth-child(3){height:54%;background:#8ccaff}.bars i:nth-child(4){height:86%}.bars i:nth-child(5){height:64%;background:#8ccaff}.bars i:nth-child(6){height:95%;background:var(--brand)}.cta{padding:48px;border-radius:22px;background:var(--accent);color:#0b3775;display:grid;grid-template-columns:1fr auto;gap:35px;align-items:center}.cta .tag{color:#255b98!important}.cta h2{font-size:35px;letter-spacing:-1.4px;line-height:1.2;margin:14px 0}.cta p{max-width:640px;font-size:13px}.cta .btn{background:#07357e!important;color:white!important}.contact-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:75px}.form{display:grid;gap:16px;padding:28px;border:1px solid var(--line);border-radius:15px;background:white}.form input,.form select,.form textarea,input,select{width:100%;min-height:44px;border:1px solid #dce5f2;border-radius:8px;background:#fbfcff;color:var(--ink);padding:11px 13px;font-size:12px;transition:border-color .2s,box-shadow .2s}.form input:focus,.form select:focus,.form textarea:focus{border-color:var(--brand);box-shadow:0 0 0 3px #0964d910;outline:none}.form textarea{resize:vertical;min-height:100px}.field-label{display:block;font-size:11px;font-weight:700;color:#425b7c;margin-bottom:-9px}.notice{display:none;padding:12px 15px;border-radius:8px;background:#eaf4ff;color:#205c9e;font-size:12px}.notice.error{background:#fff1ed;color:#a03825}.portal{min-height:calc(100vh - 84px);padding:38px 0 70px}.portal:has(.auth:not(.hidden)){display:grid;align-content:center;padding-block:65px;background:radial-gradient(ellipse at 50% 30%,#e0edff,transparent 65%)}.auth{width:min(100%,470px);margin:0 auto;background:#fff;padding:38px;border:1px solid var(--line);border-radius:20px;box-shadow:0 24px 80px #083d860a}.auth h2{font-size:29px;letter-spacing:-1px;line-height:1.2;margin:16px 0 12px}.auth .form{padding:0;border:0;border-radius:0;margin-top:28px}.auth>p{font-size:12px}.auth .tag{font-size:9px}.auth .btn{width:100%}.auth-mark{width:49px;height:49px;border-radius:13px;background:#e7f2ff;display:grid;place-items:center;font-size:23px;color:var(--brand);margin-bottom:25px}.tabs{display:flex;gap:4px;background:#eff4fb;padding:5px;border-radius:10px;margin:24px 0 15px}.tabs .btn{flex:1;min-height:38px;padding:9px;font-size:11px;border:0;box-shadow:none;background:transparent;color:var(--muted)}.tabs .primary,.tabs .active{background:#fff;color:var(--ink);box-shadow:0 2px 5px #00000008}.hidden{display:none!important}.workspace-heading{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:28px}.workspace-heading h1{font-size:29px;letter-spacing:-1.2px;margin:4px 0}.workspace-heading p{color:var(--muted);font-size:12px;margin:0}.workspace-status{padding:7px 11px;border:1px solid var(--line);background:#fff;border-radius:7px;font-size:10px;color:#536e91}.workspace-status:before{content:'●';color:#1489e7;margin-right:6px}.dash-layout{display:grid;grid-template-columns:230px minmax(0,1fr);gap:25px;align-items:start}.sidebar{position:sticky;top:108px;background:#07357e;color:#c6daf4;padding:22px 14px;border-radius:16px}.sidebar h3{font-size:14px;color:#fff;padding:0 12px 18px;border-bottom:1px solid #ffffff18;margin:0 0 17px}.sidebar button,.sidebar a{display:flex;gap:10px;align-items:center;text-align:left;width:100%;border:0;padding:12px;border-radius:8px;background:transparent;color:inherit;font-size:12px;font-weight:600;margin:3px 0}.sidebar button:hover,.sidebar a:hover{background:#ffffff0d;color:white}.sidebar button.active{background:var(--accent);color:#123b78}.panel{background:white;padding:27px;border:1px solid var(--line);border-radius:15px;min-width:0;box-shadow:0 4px 15px #07357e02}.panel h2{font-size:18px;letter-spacing:-.5px}.panel h3{font-size:15px}.panel h2,.panel h3{margin-top:0}.panel .form{border:0;background:#f7faff;border-radius:10px;padding:20px}.table{width:100%;border-collapse:collapse;white-space:normal}.table th,.table td{padding:16px 13px;border-bottom:1px solid #ebf0f8;text-align:left;font-size:12px;vertical-align:middle}.table th{background:#f5f8fd;color:#71839b;font-size:9px;text-transform:uppercase;letter-spacing:1px;font-weight:700}.table td small{color:var(--muted);font-size:10px}.table tr:last-child td{border-bottom:0}.table tbody tr:hover{background:#fafcff}.table select,.table input{font-size:11px;padding:8px;min-height:36px}.table .btn{min-height:32px;font-size:10px;padding:8px 11px}.status{color:var(--brand);font-weight:700}.progress{height:7px;background:#e5eefb;border-radius:10px;overflow:hidden;min-width:90px}.progress i{display:block;height:100%;background:var(--brand);border-radius:inherit;transition:width .5s}.kpis{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:13px}.kpi{position:relative;background:#fff;border:1px solid var(--line);border-radius:13px;padding:20px;transition:transform .2s}.kpi:hover{transform:translateY(-3px)}.kpi small{color:var(--muted);font-size:10px}.kpi strong{display:block;font-size:30px;letter-spacing:-1px;margin-top:10px;line-height:1.2}.kpi:first-child{background:#07357e;color:var(--accent);border-color:#07357e}.kpi:first-child small{color:#c1d9fa}.kpi:last-child{background:#eaf4ff}.kpi:after{content:'↗';position:absolute;right:16px;bottom:19px;font-size:16px;color:#91b5e3}.staff-nav{display:flex;gap:7px;margin:25px 0;border-bottom:1px solid var(--line);padding-bottom:12px}.staff-nav a{padding:8px 15px;font-size:12px;border-radius:7px;color:var(--muted);font-weight:700}.staff-nav a:hover,.staff-nav a.active{background:#e5f0ff;color:#1755a1}.empty-state{display:flex;align-items:center;flex-direction:column;justify-content:center;gap:9px;min-height:140px;border:1px dashed var(--line);border-radius:10px;margin:12px 0;color:var(--muted);font-size:12px;background:#fcfdff}.empty-state:before{content:'▤';font-size:28px;color:#9ab3d4}.panel>div[id]{overflow-x:auto}.foot{background:#06265b;color:#a4c3ec;padding:28px 0;font-size:11px}.foot .wrap{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap}.foot b{color:#fff}.menu-toggle{display:none;border:1px solid var(--line);border-radius:8px;background:#fff;padding:8px 13px;font-size:16px}.toast-stack{position:fixed;bottom:24px;right:24px;z-index:100;display:grid;gap:10px;max-width:min(380px,90vw)}.toast{background:#07357e;color:#fff;border:1px solid #285796;border-radius:12px;padding:16px 22px;box-shadow:0 12px 35px #0002;font-size:12px;animation:enter .25s ease}.toast.error{background:#8b392e}.reveal{animation:enter .65s both}.form.is-loading{opacity:.7}.password-wrap{position:relative}.password-wrap input{padding-right:80px}.password-toggle{position:absolute;right:10px;top:9px;background:none;border:0;padding:5px;color:var(--brand);font-size:10px}.refresh-btn{min-height:36px;font-size:11px}.dashboard-actions{display:flex;gap:10px;align-items:center}.mobile-hint{display:none}@keyframes enter{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@keyframes grow{from{transform:scaleY(.2)}to{transform:scaleY(1)}}@media(min-width:1050px){#invoiceForm{grid-template-columns:1fr 1fr}#invoiceForm label:has(textarea),#invoiceForm>button{grid-column:1/-1}#invoiceForm .field-label{margin:0}#invoiceForm label input,#invoiceForm label textarea{margin-top:6px}}@media(max-width:1050px){.grid2{gap:35px}.hero h1{font-size:52px}.kpis{grid-template-columns:repeat(3,1fr)}.cards{grid-template-columns:repeat(2,1fr)}.links{gap:16px}.contact-grid{gap:35px}}@media(max-width:760px){.nav{height:70px}.menu-toggle{display:block}.links{display:none;position:absolute;top:70px;left:0;right:0;padding:20px 5%;background:#fff;border-bottom:1px solid var(--line);flex-direction:column;align-items:stretch}.links.open{display:flex}.grid2,.contact-grid,.cta,.dash-layout{grid-template-columns:1fr}.hero{padding:55px 0 70px}.hero h1{font-size:48px;letter-spacing:-2.3px}.visual{margin:20px 15px 0 0;min-height:360px}.trust-strip .wrap{flex-wrap:wrap;justify-content:center;font-size:10px}.section{padding:55px 0}.head h2,.copy h2{font-size:32px}.cta{padding:30px;gap:20px}.cta h2{font-size:30px}.sidebar{position:static;display:flex;flex-wrap:wrap;gap:5px;padding:14px}.sidebar h3{width:100%;padding:8px 8px 13px;margin:0}.sidebar button,.sidebar a{width:auto;font-size:10px;padding:8px;margin:0}.workspace-heading{align-items:flex-start}.workspace-heading h1{font-size:24px}.workspace-status{display:none}.portal{padding-top:25px}.panel{padding:20px}.auth{padding:28px}.kpi{padding:15px}.kpi strong{font-size:25px}.kpi:after{display:none}.brand{font-size:15px}.brand img{width:37px;height:37px}.staff-nav{overflow-x:auto;white-space:nowrap}.table{min-width:540px}.panel>div[style]{flex-wrap:wrap;gap:12px}.mobile-hint{display:block;font-size:10px;color:var(--muted)}.preview-project .progress{min-width:150px}}@media(max-width:450px){.cards,#serviceCards{grid-template-columns:1fr}#serviceCards .card:last-child{grid-column:auto}.kpis{grid-template-columns:repeat(2,1fr)}.hero h1{font-size:40px}.hero .actions .btn{width:100%}.workspace-heading{flex-wrap:wrap}.dashboard-actions{width:100%}.metrics{gap:8px}.metric{padding:12px}.metric strong{font-size:18px}.float{right:-10px}.auth{padding:24px}.brand{font-size:13px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.btn:hover,.card:hover,.kpi:hover{transform:none}}

.preview-caption{text-align:left;margin-top:17px;max-width:55%;line-height:1.5}

/* Palette inspirée du logo Charles Tech 221. */
.visual{background:linear-gradient(145deg,#0869d5 0%,#07357e 75%)}.dark{background:linear-gradient(120deg,#062b68,#084ba3)}.primary{background:linear-gradient(135deg,#0879e8,#0956c7)}.primary:hover{background:linear-gradient(135deg,#086bd2,#0649a6)}.cta{background:linear-gradient(120deg,#e8f4ff,#cde9ff)}