@import url('/assets/fonts.css');
:root{color-scheme:light; font-family:Inter,Segoe UI,Arial,sans-serif; color:#152239; background:#f1f4f4}
*{box-sizing:border-box}
body{margin:0; min-width:320px}
.page{position:relative; isolation:isolate; min-height:100svh; overflow:hidden; display:flex; align-items:center}
.background,.backdrop{position:absolute;inset:0;z-index:-2}
.background{background:#bcc9d0 url('/assets/accueil.jpg') center center/cover no-repeat}
.backdrop{z-index:-1;background:linear-gradient(90deg,rgba(236,242,243,.72) 0%,rgba(240,243,241,.25) 43%,rgba(18,32,47,.04) 100%)}
.login{width:min(100%,620px);padding:52px 40px 80px clamp(28px,7.3vw,140px)}
.login-card{width:min(100%,420px);padding:39px 40px 33px;border:1px solid rgba(255,255,255,.8);border-radius:18px;background:rgba(255,255,255,.95);box-shadow:0 26px 75px rgba(25,40,55,.19),0 3px 12px rgba(25,40,55,.06);backdrop-filter:blur(12px)}
.logo{display:block;width:244px;max-width:100%;height:auto;margin:0 0 30px}
.rule{height:1px;background:#e9edf0;margin:0 0 28px}
.eyebrow{display:flex;align-items:center;gap:8px;font-size:10px;font-weight:800;letter-spacing:.15em;color:#697689}
.eyebrow-dot,.status-dot{height:7px;width:7px;border-radius:50%;background:#e33930;display:inline-block;flex:none}
h1{font-size:clamp(35px,3.1vw,43px);line-height:1.13;letter-spacing:-.045em;margin:17px 0 13px;font-weight:750}
h1 span{color:#e13830}
.intro{margin:0;color:#647185;font-size:14px;line-height:1.7}
.access{margin-top:35px}
.access-title{font-weight:700;font-size:13px;margin:0 0 12px}
.microsoft{width:100%;min-height:54px;display:flex;align-items:center;gap:13px;text-align:left;background:#f5f7f9;color:#647185;border:1px solid #d9e0e8;border-radius:9px;font:600 13px Inter,Segoe UI,Arial,sans-serif;padding:0 15px;cursor:not-allowed}
.microsoft svg{width:19px;height:19px;flex:none;opacity:.75}
.arrow{margin-left:auto;font-size:16px;font-weight:400;color:#9aa8b5}
.login-note{font-size:11px;color:#728094;margin:12px 0 0;display:flex;align-items:center;gap:7px}
.status-dot{background:#e7a53a;width:6px;height:6px}
.card-foot{border-top:1px solid #edf0f2;margin-top:32px;padding-top:20px;color:#8290a0;font-size:11px;display:flex;align-items:center;gap:8px}
.lock{font-size:8px;color:#a4b1bd}
.page-footer{position:absolute;bottom:24px;left:clamp(28px,7.3vw,140px);right:30px;display:flex;gap:20px;align-items:center;color:#fff;text-shadow:0 1px 5px rgba(12,30,38,.7);font-size:10px;letter-spacing:.13em;font-weight:750}
.page-footer span:last-child{margin-left:auto;font-weight:500;letter-spacing:.03em}
@media(max-width:700px){.page{align-items:flex-end;min-height:100svh}.background{background-position:63% center}.backdrop{background:linear-gradient(0deg,rgba(17,31,45,.50),rgba(25,43,55,.05) 65%)}.login{padding:110px 20px 76px;width:100%}.login-card{margin:auto;padding:32px 29px 27px}.logo{width:215px;margin-bottom:25px}h1{font-size:38px}.access{margin-top:27px}.page-footer{left:22px;right:22px;bottom:22px}.page-footer span:last-child{display:none}}
@media(max-height:650px) and (min-width:701px){.login{padding-top:20px;padding-bottom:50px}.login-card{padding:25px 35px}.logo{margin-bottom:18px;width:215px}.rule{margin-bottom:18px}.access{margin-top:20px}.card-foot{margin-top:20px;padding-top:16px}}