
:root{--bg:#f2f3f5;--panel:#fff;--ink:#0b0c0e;--muted:#777b84;--line:#e7e8ea;--red:#e63131;--dark:#111214;--green:#1d9d64;--amber:#d68a18;--shadow:0 18px 60px rgba(10,12,16,.08);--radius:24px;--font:Gotham,"Avenir Next",Avenir,Inter,Arial,sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:var(--font);background:var(--bg);color:var(--ink);-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button,input{font:inherit}button{cursor:pointer}img{max-width:100%;display:block}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
/* Login */
.login-shell{min-height:100svh;display:grid;grid-template-columns:minmax(420px,1.08fr) minmax(430px,.92fr);background:#fff}.login-visual{position:relative;min-height:720px;overflow:hidden;background:#101012;color:#fff}.login-visual:before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.08),rgba(0,0,0,.64)),url('../img/reel-immobilier-cap-antibes.jpg') center/cover;transform:scale(1.02)}.login-visual:after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 70% 15%,rgba(230,49,49,.30),transparent 34%)}.login-brand{position:absolute;z-index:2;left:44px;top:38px;display:flex;align-items:center;gap:13px;font-size:.75rem;font-weight:750;letter-spacing:.08em;text-transform:uppercase}.login-brand img{width:37px;height:37px;border-radius:11px}.login-message{position:absolute;z-index:2;left:44px;right:50px;bottom:48px;max-width:720px}.login-kicker{font-size:.68rem;letter-spacing:.18em;text-transform:uppercase;color:rgba(255,255,255,.68);font-weight:750;margin-bottom:16px}.login-message h1{font-size:clamp(2.8rem,5vw,5.8rem);line-height:.94;letter-spacing:-.055em;margin:0 0 22px}.login-message h1 span{color:#ff4a4a}.login-message p{max-width:580px;margin:0;color:rgba(255,255,255,.72);line-height:1.7;font-size:.98rem}.login-side{display:flex;align-items:center;justify-content:center;padding:50px;background:#fff}.login-card{width:min(440px,100%)}.back-site{display:inline-flex;align-items:center;gap:8px;color:#777b84;font-size:.78rem;font-weight:650;margin-bottom:50px}.back-site:hover{color:#111}.login-card h2{font-size:2.45rem;line-height:1;letter-spacing:-.045em;margin:0 0 12px}.login-card>.sub{color:var(--muted);margin:0 0 34px;line-height:1.65}.demo-badge{display:inline-flex;align-items:center;gap:7px;padding:7px 10px;border-radius:999px;background:#fff2f2;color:#b82222;font-size:.65rem;font-weight:760;letter-spacing:.08em;text-transform:uppercase;margin-bottom:16px;border:1px solid #ffdede}.demo-dot{width:7px;height:7px;border-radius:50%;background:#e63131}.auth-field{margin-bottom:18px}.auth-field label{display:block;font-size:.7rem;font-weight:720;margin-bottom:8px;color:#4d5058}.auth-input-wrap{position:relative}.auth-field input{width:100%;height:56px;border:1px solid #dfe1e4;border-radius:15px;padding:0 16px;background:#fafafa;outline:0;transition:.2s}.auth-field input:focus{background:#fff;border-color:#999;box-shadow:0 0 0 4px rgba(0,0,0,.04)}.password-toggle{position:absolute;right:10px;top:50%;transform:translateY(-50%);border:0;background:transparent;padding:8px;color:#777}.login-row{display:flex;justify-content:space-between;align-items:center;margin:6px 0 24px;font-size:.74rem}.remember{display:flex;align-items:center;gap:8px;color:#656871}.remember input{accent-color:#111}.forgot{font-weight:700}.primary-action{width:100%;height:56px;border:0;border-radius:16px;background:#111;color:#fff;font-weight:760;letter-spacing:.02em;transition:.2s}.primary-action:hover{transform:translateY(-1px);background:#202124}.login-help{text-align:center;margin-top:24px;color:#858891;font-size:.72rem}.login-help a{font-weight:750;color:#111}.login-security{display:flex;gap:12px;margin-top:36px;padding-top:24px;border-top:1px solid var(--line);color:#93969e;font-size:.68rem;line-height:1.55}.security-icon{width:32px;height:32px;border-radius:10px;background:#f3f4f5;display:grid;place-items:center;flex:0 0 auto}.security-icon svg{width:16px}
/* App shell */
.portal{min-height:100svh;display:grid;grid-template-columns:248px minmax(0,1fr);background:var(--bg)}.sidebar{position:sticky;top:0;height:100svh;background:#101113;color:#fff;padding:28px 18px 22px;display:flex;flex-direction:column;z-index:20}.side-brand{display:flex;align-items:center;gap:11px;padding:0 10px 28px;border-bottom:1px solid rgba(255,255,255,.09)}.side-brand img{width:36px;height:36px;border-radius:10px}.side-brand div{font-size:.69rem;line-height:1.25;font-weight:760;letter-spacing:.05em;text-transform:uppercase}.side-brand small{display:block;font-size:.56rem;color:rgba(255,255,255,.45);font-weight:600;margin-top:4px;letter-spacing:.08em}.side-nav{display:grid;gap:7px;margin-top:26px}.side-link{border:0;width:100%;background:transparent;color:rgba(255,255,255,.63);display:flex;align-items:center;gap:12px;height:48px;border-radius:14px;padding:0 14px;text-align:left;font-size:.79rem;font-weight:690;transition:.2s}.side-link svg{width:19px;height:19px}.side-link:hover{color:#fff;background:rgba(255,255,255,.06)}.side-link.active{background:#fff;color:#111}.side-spacer{flex:1}.side-help{display:flex;align-items:center;gap:11px;margin:12px 4px 18px;padding:13px;border:1px solid rgba(255,255,255,.09);border-radius:16px;color:rgba(255,255,255,.7);font-size:.7rem}.side-help strong{display:block;color:#fff;font-size:.72rem;margin-bottom:2px}.side-user{display:flex;align-items:center;gap:10px;padding:15px 8px 0;border-top:1px solid rgba(255,255,255,.09)}.avatar{width:38px;height:38px;border-radius:13px;background:linear-gradient(135deg,#f05252,#9f1313);display:grid;place-items:center;color:#fff;font-weight:800;font-size:.72rem;flex:0 0 auto}.side-user-meta{min-width:0}.side-user-meta strong{display:block;font-size:.72rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.side-user-meta span{font-size:.61rem;color:rgba(255,255,255,.45)}.app-main{min-width:0}.topbar{height:82px;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(24px,4vw,54px);border-bottom:1px solid var(--line);background:rgba(242,243,245,.86);backdrop-filter:blur(18px);position:sticky;top:0;z-index:10}.topbar-title strong{display:block;font-size:.88rem}.topbar-title span{font-size:.67rem;color:var(--muted)}.top-actions{display:flex;gap:10px;align-items:center}.icon-btn{width:42px;height:42px;border-radius:13px;border:1px solid #e0e2e4;background:#fff;display:grid;place-items:center;position:relative}.icon-btn svg{width:18px;height:18px}.notification-dot{position:absolute;top:7px;right:7px;width:7px;height:7px;background:#e63131;border:2px solid #fff;border-radius:50%}.user-chip{border:0;background:#fff;border:1px solid #e0e2e4;border-radius:15px;height:44px;padding:0 10px 0 8px;display:flex;align-items:center;gap:8px}.user-chip .avatar{width:30px;height:30px;border-radius:10px;font-size:.62rem}.user-chip span{font-size:.7rem;font-weight:720}.app-content{padding:36px clamp(24px,4vw,54px) 110px;max-width:1520px;margin:0 auto}.screen{display:none}.screen.active{display:block;animation:screenIn .25s ease}@keyframes screenIn{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}.screen-head{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:26px}.screen-head h1{font-size:clamp(2.2rem,4vw,4.5rem);letter-spacing:-.055em;line-height:.96;margin:0}.screen-head p{margin:10px 0 0;color:var(--muted);font-size:.86rem}.prototype-pill{display:inline-flex;align-items:center;gap:7px;padding:8px 11px;background:#fff;border:1px solid var(--line);border-radius:999px;font-size:.62rem;color:#777;font-weight:700}.prototype-pill i{display:block;width:7px;height:7px;background:#e63131;border-radius:50%}.hero-project{position:relative;border-radius:28px;overflow:hidden;min-height:390px;background:#111;color:#fff;box-shadow:var(--shadow);isolation:isolate}.hero-project:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.78),rgba(0,0,0,.15)),url('../img/reel-immobilier-cap-antibes.jpg') center/cover;z-index:-1}.hero-project-copy{padding:38px;max-width:640px;display:flex;min-height:390px;flex-direction:column;justify-content:flex-end}.mini-label{font-size:.61rem;text-transform:uppercase;letter-spacing:.14em;font-weight:760;color:rgba(255,255,255,.65);margin-bottom:11px}.hero-project h2{font-size:clamp(2rem,3.6vw,3.8rem);letter-spacing:-.05em;line-height:.98;margin:0 0 15px}.hero-project p{font-size:.82rem;line-height:1.65;color:rgba(255,255,255,.72);max-width:520px;margin:0 0 22px}.hero-buttons{display:flex;gap:10px;flex-wrap:wrap}.app-btn{height:44px;border-radius:13px;border:1px solid transparent;padding:0 16px;font-size:.68rem;font-weight:740;display:inline-flex;align-items:center;gap:8px;justify-content:center}.app-btn.primary{background:#fff;color:#111}.app-btn.dark{background:#111;color:#fff}.app-btn.ghost{border-color:rgba(255,255,255,.30);color:#fff;background:rgba(255,255,255,.08);backdrop-filter:blur(8px)}.app-btn.outline{border-color:#dfe1e4;background:#fff;color:#111}.overview-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:18px 0 28px}.metric-card{border:1px solid var(--line);background:#fff;border-radius:20px;padding:22px;min-width:0}.metric-top{display:flex;align-items:center;justify-content:space-between}.metric-icon{width:38px;height:38px;border-radius:12px;background:#f3f4f5;display:grid;place-items:center}.metric-icon svg{width:18px}.metric-card strong{display:block;font-size:2rem;letter-spacing:-.04em;margin:20px 0 4px}.metric-card p{margin:0;font-size:.69rem;color:var(--muted)}.content-grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(290px,.75fr);gap:18px}.panel{background:#fff;border:1px solid var(--line);border-radius:22px;padding:24px}.panel-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:18px}.panel-head h3{font-size:1rem;margin:0;letter-spacing:-.02em}.text-link{border:0;background:transparent;font-size:.66rem;font-weight:740;color:#6c7078;padding:0}.text-link:hover{color:#111}.activity-list{display:grid}.activity{display:grid;grid-template-columns:42px minmax(0,1fr) auto;gap:12px;align-items:center;padding:15px 0;border-top:1px solid #f0f1f2}.activity:first-child{border-top:0}.activity-icon{width:40px;height:40px;border-radius:12px;background:#f3f4f5;display:grid;place-items:center}.activity-icon svg{width:18px}.activity strong{display:block;font-size:.75rem}.activity p{margin:4px 0 0;color:var(--muted);font-size:.65rem}.activity time{font-size:.61rem;color:#a1a4aa}.status-card{background:#101113;color:#fff;border-radius:20px;padding:22px}.status-line{display:flex;justify-content:space-between;gap:12px;align-items:center}.status-line strong{font-size:.79rem}.status-line span{font-size:.62rem;color:rgba(255,255,255,.5)}.progress{height:6px;background:rgba(255,255,255,.12);border-radius:999px;overflow:hidden;margin:18px 0 10px}.progress i{display:block;height:100%;width:72%;background:#e63131;border-radius:inherit}.status-card p{font-size:.66rem;color:rgba(255,255,255,.58);margin:0}.quick-link{margin-top:14px;width:100%;border:0;border-radius:14px;background:#f4f5f6;padding:15px;text-align:left;display:flex;align-items:center;justify-content:space-between;font-size:.7rem;font-weight:720}.quick-link:hover{background:#eceef0}
/* Generic table/cards */
.filters{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:20px}.filter-btn{height:36px;padding:0 14px;border-radius:999px;border:1px solid #dfe1e4;background:#fff;font-size:.66rem;font-weight:720;color:#6e7178}.filter-btn.active{background:#111;color:#fff;border-color:#111}.download-list,.invoice-list,.project-list{display:grid;gap:12px}.download-item,.invoice-item,.project-item{background:#fff;border:1px solid var(--line);border-radius:19px;padding:18px;display:grid;align-items:center;gap:16px}.download-item{grid-template-columns:48px minmax(0,1fr) auto}.invoice-item{grid-template-columns:minmax(0,1.4fr) .7fr .6fr auto}.file-icon{width:46px;height:46px;border-radius:14px;background:#f1f2f3;display:grid;place-items:center;font-size:.63rem;font-weight:820}.item-main strong{display:block;font-size:.77rem}.item-main p{margin:4px 0 0;color:var(--muted);font-size:.65rem}.item-action{height:38px;border-radius:12px;padding:0 13px;border:1px solid #dddfe2;background:#fff;font-size:.63rem;font-weight:750;display:inline-flex;align-items:center;justify-content:center}.item-action:hover{background:#111;color:#fff;border-color:#111}.invoice-amount{font-weight:760;font-size:.75rem}.badge{display:inline-flex;align-items:center;gap:6px;border-radius:999px;padding:6px 9px;font-size:.59rem;font-weight:750;white-space:nowrap}.badge.paid{background:#eaf8f1;color:#14794d}.badge.pending{background:#fff3e2;color:#a4610c}.year-block-title{font-size:.72rem;font-weight:780;letter-spacing:.1em;text-transform:uppercase;color:#8a8d93;margin:26px 0 10px}.project-item{grid-template-columns:110px minmax(0,1fr) auto}.project-thumb{height:78px;border-radius:14px;object-fit:cover;width:110px}.project-meta{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}.project-meta span{font-size:.58rem;color:#71747b;background:#f4f5f6;border-radius:999px;padding:5px 8px}.section-note{background:#fff;border:1px solid var(--line);border-radius:18px;padding:18px;color:var(--muted);font-size:.69rem;line-height:1.6;margin-bottom:18px}.section-note strong{color:#111}.empty-state{text-align:center;padding:70px 20px;background:#fff;border:1px solid var(--line);border-radius:22px}.empty-state h3{margin:15px 0 8px}.empty-state p{color:var(--muted);font-size:.76rem;margin:0}.mobile-nav{display:none}.toast{position:fixed;right:24px;bottom:24px;z-index:100;background:#111;color:#fff;padding:13px 16px;border-radius:14px;font-size:.7rem;box-shadow:0 14px 40px rgba(0,0,0,.25);opacity:0;transform:translateY(10px);pointer-events:none;transition:.2s}.toast.show{opacity:1;transform:none}.notifications{position:fixed;right:24px;top:72px;width:min(380px,calc(100vw - 32px));z-index:50;background:#fff;border:1px solid var(--line);border-radius:20px;box-shadow:0 24px 70px rgba(0,0,0,.16);padding:18px;display:none}.notifications.open{display:block}.notifications h3{font-size:.82rem;margin:0 0 12px}.note-item{padding:12px 0;border-top:1px solid #eee}.note-item:first-of-type{border-top:0}.note-item strong{display:block;font-size:.7rem}.note-item p{font-size:.64rem;color:var(--muted);margin:4px 0 0}
@media(max-width:1050px){.portal{grid-template-columns:88px minmax(0,1fr)}.side-brand div,.side-link span,.side-help,.side-user-meta{display:none}.sidebar{padding-inline:14px}.side-brand{justify-content:center;padding-inline:0}.side-nav{align-items:center}.side-link{width:56px;padding:0;justify-content:center}.side-user{justify-content:center;padding-inline:0}.content-grid{grid-template-columns:1fr}.overview-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:760px){.login-shell{display:block}.login-visual{min-height:42svh}.login-brand{left:22px;top:22px}.login-message{left:22px;right:22px;bottom:28px}.login-message h1{font-size:2.7rem;margin-bottom:12px}.login-message p{display:none}.login-side{padding:30px 22px 44px}.login-card{width:100%}.back-site{margin-bottom:28px}.login-card h2{font-size:2rem}.portal{display:block}.sidebar{display:none}.topbar{height:68px;padding:0 16px}.topbar-title span{display:none}.user-chip span{display:none}.app-content{padding:22px 16px 98px}.screen-head{align-items:flex-start;flex-direction:column;gap:14px;margin-bottom:20px}.screen-head h1{font-size:2.55rem}.prototype-pill{font-size:.58rem}.hero-project{min-height:330px;border-radius:22px}.hero-project-copy{padding:24px;min-height:330px}.hero-project h2{font-size:2.15rem}.hero-project p{font-size:.75rem}.overview-grid{grid-template-columns:1fr 1fr;gap:10px}.metric-card{padding:17px}.metric-card:last-child{grid-column:1/-1}.metric-card strong{font-size:1.65rem;margin-top:14px}.content-grid{gap:12px}.panel{padding:18px}.download-item{grid-template-columns:44px minmax(0,1fr);gap:12px}.download-item .item-action{grid-column:1/-1;width:100%}.invoice-item{grid-template-columns:minmax(0,1fr) auto;gap:10px}.invoice-item .invoice-amount{grid-row:2;grid-column:1}.invoice-item .badge{grid-row:1;grid-column:2}.invoice-item .item-action{grid-row:2;grid-column:2}.project-item{grid-template-columns:82px minmax(0,1fr)}.project-thumb{width:82px;height:72px}.project-item .item-action{grid-column:1/-1;width:100%}.mobile-nav{position:fixed;z-index:40;display:grid;grid-template-columns:repeat(4,1fr);bottom:10px;left:10px;right:10px;height:68px;background:rgba(17,18,20,.94);backdrop-filter:blur(18px);border-radius:20px;padding:7px;box-shadow:0 16px 45px rgba(0,0,0,.22)}.mobile-link{border:0;background:transparent;color:rgba(255,255,255,.52);border-radius:14px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;font-size:.52rem;font-weight:650}.mobile-link svg{width:19px;height:19px}.mobile-link.active{background:#fff;color:#111}.toast{left:16px;right:16px;bottom:92px;text-align:center}.notifications{top:62px;right:12px}.filters{overflow:auto;flex-wrap:nowrap;padding-bottom:3px}.filter-btn{flex:0 0 auto}}


/* V44 — Espace client connecté */
.live-badge,.connected-pill{display:inline-flex;align-items:center;gap:7px;padding:7px 10px;border-radius:999px;background:#eef9f3;color:#14794d;font-size:.65rem;font-weight:760;letter-spacing:.06em;text-transform:uppercase;margin-bottom:16px;border:1px solid #d9f1e4}.connected-pill{margin:0;background:#fff;color:#5e626a;border-color:var(--line);text-transform:none;letter-spacing:0}.live-dot,.connected-pill i{display:block;width:7px;height:7px;border-radius:50%;background:#1d9d64}.reset-panel[hidden],.portal[hidden],.mobile-nav[hidden],.loading-screen[hidden]{display:none!important}.primary-action:disabled{opacity:.6;cursor:wait;transform:none}.logout-link{margin:10px 4px 0;border:0;background:transparent;color:rgba(255,255,255,.48);font-size:.63rem;font-weight:700;text-align:left;padding:7px 8px}.logout-link:hover{color:#fff}.hero-project{background-image:linear-gradient(90deg,rgba(0,0,0,.78),rgba(0,0,0,.18)),url('../img/brand-cover.webp');background-position:center;background-size:cover}.hero-project:before{display:none!important}.status-card{min-height:128px;display:flex;flex-direction:column;justify-content:center}.project-description{font-size:.62rem;color:#777b84;line-height:1.55;margin-top:7px;max-width:700px}.item-action.disabled{opacity:.5;pointer-events:none}.empty-state{grid-column:1/-1}.empty-icon{width:48px;height:48px;border-radius:15px;background:#111;color:#fff;display:grid;place-items:center;margin:0 auto;font-size:.6rem;font-weight:800;letter-spacing:.08em}.activity-list .empty-state{border:0;padding:38px 12px}.loading-screen{position:fixed;inset:0;background:#f2f3f5;display:grid;place-items:center;z-index:200}.loading-mark{display:flex;align-items:center;gap:12px;color:#777b84;font-size:.72rem;font-weight:700}.loading-mark img{width:38px;height:38px;border-radius:11px}.loading-mark a{text-decoration:underline;color:#111}
@media(max-width:760px){.logout-link{display:none}.live-badge{margin-bottom:14px}.connected-pill{font-size:.56rem}.project-description{display:none}}


/* V45 — portail client plus sobre, sans imagerie de marque */
.login-visual{
  background:#111214;
  color:#fff;
}
.login-visual:before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 78% 18%,rgba(255,255,255,.08),transparent 30%),
    linear-gradient(145deg,#111214 0%,#17181b 58%,#0b0c0e 100%);
  transform:none;
}
.login-visual:after{
  content:"";
  position:absolute;
  inset:0;
  opacity:.28;
  background-image:
    linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);
  background-size:72px 72px;
  mask-image:linear-gradient(to bottom,rgba(0,0,0,.7),transparent 82%);
}
.login-brand{gap:11px;text-transform:none;letter-spacing:0;font-size:.72rem}
.portal-mark{
  width:36px;
  height:36px;
  border-radius:11px;
  display:grid;
  place-items:center;
  background:#fff;
  color:#111214;
  font-size:.64rem;
  font-weight:850;
  letter-spacing:.08em;
  flex:0 0 auto;
}
.portal-name{font-weight:700;letter-spacing:.02em;color:rgba(255,255,255,.82)}
.login-message{max-width:650px}
.login-message h1{max-width:620px}
.login-message h1 span{color:#fff}
.login-message p{max-width:500px;color:rgba(255,255,255,.58)}
.login-kicker{color:rgba(255,255,255,.45)}

.side-brand{gap:11px}
.side-brand .portal-mark{width:36px;height:36px;border-radius:10px}
.side-brand div{font-size:.69rem;line-height:1.25;font-weight:760;letter-spacing:.02em;text-transform:none}
.side-brand small{letter-spacing:.06em;text-transform:uppercase}

.hero-project{
  background:#111214!important;
  box-shadow:none;
  border:1px solid rgba(255,255,255,.05);
}
.hero-project:after{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  background:
    radial-gradient(circle at 84% 18%,rgba(255,255,255,.11),transparent 25%),
    linear-gradient(135deg,#111214 0%,#1a1b1f 62%,#101113 100%);
}
.hero-project-copy{position:relative;z-index:1}
.hero-project .mini-label{color:rgba(255,255,255,.48)}
.hero-project p{color:rgba(255,255,255,.62)}

.loading-mark .portal-mark{background:#111214;color:#fff;width:38px;height:38px}
.loading-mark img{display:none!important}

@media(max-width:1050px){
  .side-brand .portal-mark{margin:auto}
}
@media(max-width:760px){
  .login-visual{min-height:34svh}
  .login-message{bottom:24px}
  .login-message h1{font-size:2.35rem}
  .login-kicker{margin-bottom:10px}
}
