/* Build360 — Blueprint clair : landing, authentification et pages publiques. */

/* Landing ------------------------------------------------------------------- */
.ld{
  color:var(--bp-ink);
  background-color:var(--bp-paper);
  background-image:
    linear-gradient(var(--bp-grid) .6px,transparent .6px),
    linear-gradient(90deg,var(--bp-grid) .6px,transparent .6px);
  background-size:36px 36px;
  font-family:var(--bp-font);
}
.ld-bg{
  background:
    linear-gradient(180deg,rgba(250,252,254,.1),rgba(250,252,254,.94)),
    linear-gradient(var(--bp-grid) .6px,transparent .6px),
    linear-gradient(90deg,var(--bp-grid) .6px,transparent .6px);
  background-color:var(--bp-paper);
  background-size:auto,36px 36px,36px 36px;
}
.ld-bg::after{display:none}
.ld-nav{
  position:sticky;
  top:0;
  z-index:20;
  max-width:none;
  min-height:78px;
  padding:10px max(24px,calc((100vw - 1180px)/2));
  background:rgba(250,252,254,.94);
  border-bottom:2px solid var(--bp-line);
  box-shadow:none;
  backdrop-filter:blur(12px);
}
.ld-brand{min-width:0}
.ld-logo-full{
  width:auto;
  height:72px!important;
  max-width:220px;
  object-fit:contain;
  background:transparent;
  border:0;
  border-radius:0;
  box-shadow:none;
}
.ld-navlinks{gap:8px}
.ld-navlinks a{
  min-height:44px;
  display:inline-flex;
  align-items:center;
  padding:0 10px;
  color:var(--bp-muted);
  border-radius:4px;
  font:600 11.5px var(--bp-data);
  text-transform:uppercase;
  letter-spacing:.035em;
}
.ld-navlinks a:hover{color:var(--bp-blue);background:var(--bp-blue-soft)}
.ld-btn{
  min-height:44px;
  padding:10px 18px;
  color:var(--bp-ink);
  background:#fff;
  border:1.5px solid var(--bp-line);
  border-radius:5px;
  box-shadow:none;
  font:700 13px var(--bp-font);
}
.ld-btn:hover{color:var(--bp-blue);border-color:var(--bp-blue);box-shadow:3px 3px 0 var(--bp-grid)}
.ld-btn.primary,.ld-btn.solid{
  color:#fff;
  background:var(--bp-blue);
  border-color:var(--bp-blue);
}
.ld-btn.primary:hover,.ld-btn.solid:hover{color:#fff;background:var(--bp-blue-hover)}
.ld-btn.ghost{color:var(--bp-blue);background:#fff;border-color:var(--bp-line)}
.ld-btn.ghost:hover{color:var(--bp-blue-hover);background:var(--bp-blue-soft);border-color:var(--bp-blue)}
.ld-btn[data-action="demo"],.ld-plan--featured .ld-btn.primary,.ld-final .ld-btn.primary{
  color:var(--bp-orange-ink);
  background:var(--bp-orange);
  border-color:var(--bp-orange);
}
.ld-btn[data-action="demo"]:hover,.ld-plan--featured .ld-btn.primary:hover,.ld-final .ld-btn.primary:hover{
  color:var(--bp-orange-ink);
  background:var(--bp-orange-hover);
  border-color:var(--bp-orange-hover);
  box-shadow:4px 4px 0 rgba(255,106,0,.22);
}

.ld-main{background:transparent}
.ld-hero{
  display:grid;
  max-width:1180px;
  min-height:auto;
  padding:70px 24px 76px;
  grid-template-columns:minmax(0,1.04fr) minmax(390px,.96fr);
  gap:48px;
}
.ld-hero__copy{min-width:0;padding:0}
.ld-kicker,.ld-badge{
  display:inline-flex;
  align-items:center;
  width:max-content;
  margin-bottom:18px;
  padding:7px 12px;
  color:var(--bp-blue);
  background:#fff;
  border:1.5px solid var(--bp-line);
  border-radius:4px;
  font:600 11px var(--bp-data);
  letter-spacing:.08em;
  text-transform:uppercase;
}
.ld-kicker::before,.ld-badge::before{
  content:"";
  width:7px;
  height:7px;
  margin-right:8px;
  background:var(--bp-orange);
}
.ld-hero h1{
  max-width:760px;
  margin:0 0 18px;
  color:var(--bp-ink);
  font-size:clamp(38px,5vw,62px);
  line-height:1.03;
  font-weight:800;
  letter-spacing:-.045em;
}
.ld-hero h1 span{
  color:var(--bp-orange);
  background:none;
  -webkit-text-fill-color:currentColor;
}
.ld-lead,.ld-hero__claim{max-width:58ch;color:var(--bp-muted);font-size:17px;line-height:1.65}
.ld-trust,.ld-hero__proof{color:var(--bp-muted);font:500 11px/1.6 var(--bp-data)}
.ld-cta{gap:10px}
.ld-hero__visual{
  min-width:0;
  width:100%;
  max-width:680px;
  padding:12px;
  background:#fff;
  border:2px solid var(--bp-line);
  border-radius:7px;
  box-shadow:8px 8px 0 var(--bp-grid);
  overflow:hidden;
}
.ld-hero__visual::before{
  content:"PLAN DE PILOTAGE · RÉV. 2026";
  display:block;
  padding:0 2px 9px;
  color:var(--bp-muted);
  font:600 10px var(--bp-data);
  letter-spacing:.08em;
}
.ld-hero__visual img{border-radius:3px;filter:saturate(.86) contrast(1.02)}
.ld-visual-panel,.ld-card{
  color:var(--bp-ink);
  background:#fff;
  border:1.5px solid var(--bp-line);
  border-radius:5px;
  box-shadow:4px 4px 0 var(--bp-grid);
  transform:none;
  backdrop-filter:none;
}
.ld-visual-panel{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:5px 12px;
  margin-top:10px;
  padding:12px 14px;
  box-shadow:none;
}
.ld-visual-panel>span{color:var(--bp-muted);font:600 10px var(--bp-data);letter-spacing:.06em;text-transform:uppercase}
.ld-visual-panel>b{color:var(--bp-blue);font-family:var(--bp-data)}
.ld-visual-panel>p{grid-column:1/-1;margin:0;color:var(--bp-muted);font-size:12px}
.ld-card__icon{
  color:var(--bp-blue);
  background:var(--bp-blue-soft);
  border:1px solid var(--bp-grid);
  border-radius:4px;
}

.ld-section,.ld-features,.ld-pricing,.ld-final,.ld-why,.ld-faqs{
  position:relative;
  max-width:1180px;
  margin:0 auto;
  padding:70px 24px;
  color:var(--bp-ink);
  background:transparent;
}
.ld-section::before,.ld-features::before,.ld-pricing::before,.ld-final::before{
  content:"";
  position:absolute;
  top:0;
  left:24px;
  right:24px;
  height:2px;
  background:linear-gradient(90deg,var(--bp-blue) 0 72%,var(--bp-orange) 72% 100%);
}
.ld-section__head{max-width:760px;margin:0 0 38px;text-align:left}
.ld-section__head>span{
  color:var(--bp-blue);
  font:600 11px var(--bp-data);
  letter-spacing:.08em;
  text-transform:uppercase;
}
.ld-section__head>span::before{content:"§ ";color:var(--bp-orange)}
.ld-section__head h2,.ld-h2,.ld-final h2{
  margin:8px 0 10px;
  color:var(--bp-ink);
  font-size:clamp(28px,3.4vw,40px);
  line-height:1.12;
  font-weight:800;
  letter-spacing:-.035em;
}
.ld-section__head p,.ld-h2sub,.ld-final p{color:var(--bp-muted);font-size:15.5px}
.ld-grid,.ld-grid--3,.ld-operational-grid,.ld-audiences,.ld-benefits,.ld-diffgrid{
  gap:0;
  overflow:hidden;
  background:var(--bp-line);
  border:2px solid var(--bp-line);
  border-radius:6px;
}
.ld-card,.ld-benefit,.ld-audience,.ld-diff{
  min-width:0;
  padding:24px;
  color:var(--bp-ink);
  background:#fff;
  border:0;
  border-radius:0;
  outline:1px solid var(--bp-line);
  box-shadow:none;
}
.ld-card:hover,.ld-benefit:hover,.ld-audience:hover,.ld-diff:hover{background:#f2f7fc;transform:none}
.ld-card h3,.ld-benefit h3,.ld-audience h3,.ld-diff b{color:var(--bp-ink)}
.ld-card p,.ld-benefit p,.ld-audience p,.ld-diff p{color:var(--bp-muted)}
.ld-trustbar{
  background:#fff;
  border-block:2px solid var(--bp-line);
  box-shadow:none;
}
.ld-stat b{color:var(--bp-blue);font-family:var(--bp-data)}
.ld-stat span{color:var(--bp-muted)}

.ld-plans{gap:16px;background:transparent;border:0;overflow:visible}
.ld-plan{
  padding:26px 22px 22px;
  color:var(--bp-ink);
  background:#fff;
  border:2px solid var(--bp-line);
  border-radius:6px;
  box-shadow:none;
}
.ld-plan:hover{border-color:var(--bp-blue);box-shadow:6px 6px 0 var(--bp-grid);transform:translate(-2px,-2px)}
.ld-plan--featured{border-color:var(--bp-orange);box-shadow:6px 6px 0 var(--bp-grid)}
.ld-plan__badge{
  color:var(--bp-orange-ink);
  background:var(--bp-orange);
  border-radius:3px;
  font:600 10px var(--bp-data);
  letter-spacing:.05em;
}
.ld-plan__name{color:var(--bp-ink);font-weight:800}
.ld-plan__price b{color:var(--bp-ink);font-family:var(--bp-data);font-weight:600}
.ld-plan__price span,.ld-plan__annual,.ld-plan>p,.ld-plan li{color:var(--bp-muted)}
.ld-plan__limit,.ld-option-card{
  color:var(--bp-ink);
  background:var(--bp-paper-soft);
  border:1px solid var(--bp-grid);
  border-radius:4px;
}
.ld-plan li .ui-svg,.ld-plan li .ld-svg{color:var(--bp-success)}
.ld-pricing__switch .ld-btn{font-family:var(--bp-data)}
.ld-option-grid{gap:14px}
.ld-compare{
  overflow-x:auto;
  background:#fff;
  border:1.5px solid var(--bp-line);
  border-radius:5px;
}
.ld-compare__row{border-color:var(--bp-grid)}
.ld-compare__head{color:var(--bp-muted);background:var(--bp-paper-soft);font-family:var(--bp-data)}
.ld-faq{
  background:#fff;
  border:1.5px solid var(--bp-line);
  border-radius:5px;
}
.ld-faq summary{color:var(--bp-ink)}
.ld-faq p{color:var(--bp-muted)}
.ld-final{
  margin-bottom:64px;
  padding:48px 32px;
  text-align:center;
  background:#fff;
  border:2px solid var(--bp-line);
  border-radius:7px;
  box-shadow:8px 8px 0 var(--bp-grid);
}
.ld-footer,.ld-foot{
  color:var(--bp-muted);
  background:#fff;
  border-top:2px solid var(--bp-line);
  font-family:var(--bp-data);
}

@keyframes blueprint-rise{
  from{opacity:0;transform:translateY(14px)}
  to{opacity:1;transform:none}
}
.ld.show .ld-kicker,.ld.show .ld-badge{animation:blueprint-rise .45s ease both}
.ld.show .ld-hero h1{animation:blueprint-rise .55s .08s ease both}
.ld.show .ld-lead,.ld.show .ld-hero__claim{animation:blueprint-rise .55s .16s ease both}
.ld.show .ld-cta{animation:blueprint-rise .55s .24s ease both}
.ld.show .ld-hero__visual{animation:blueprint-rise .6s .15s ease both}

/* Authentification ---------------------------------------------------------- */
.auth-ov{background:rgba(21,58,107,.42);backdrop-filter:blur(4px)}
.auth-card{
  color:var(--bp-ink);
  background:#fff;
  border:2px solid var(--bp-line);
  border-radius:7px;
  box-shadow:8px 8px 0 rgba(192,212,234,.84);
  min-width:0;
  min-height:0;
  height:min(760px,calc(100vh - 32px));
  grid-template-rows:minmax(0,1fr);
}
.auth-aside{
  color:var(--bp-ink);
  background-color:var(--bp-paper-soft);
  background-image:
    linear-gradient(var(--bp-grid) .6px,transparent .6px),
    linear-gradient(90deg,var(--bp-grid) .6px,transparent .6px);
  background-size:28px 28px;
  border-right:2px solid var(--bp-line);
}
.auth-aside::before,.auth-aside::after{display:none}
.auth-aside h2,.auth-feat b{color:var(--bp-ink)}
.auth-aside p{color:var(--bp-muted)}
.auth-aside__logo img,.auth-brand-logo,.auth-brand-icon img{
  object-fit:contain;
  background:#fff;
  border:1.5px solid var(--bp-line);
  border-radius:5px;
}
.auth-feat .fi{color:var(--bp-blue);background:var(--bp-blue-soft);border:1px solid var(--bp-grid);border-radius:4px}
.auth-panel{
  background:#fff;
  min-height:0;
  min-width:0;
  overflow-y:auto;
  overflow-x:hidden;
  overscroll-behavior:contain;
  scrollbar-gutter:stable;
  scrollbar-width:thin;
  padding-bottom:28px;
}
.auth-provision{
  min-height:100%;
  min-width:0;
  display:flex;
  flex-direction:column;
}
.auth-card--provision{
  height:min(780px,calc(100vh - 32px));
  max-height:calc(100vh - 32px);
}
.auth-card--provision .auth-panel{padding:24px 28px 16px}
.auth-card--provision .auth-provision{gap:8px}
.auth-card--provision .auth-provision .auth-h{max-width:calc(100% - 64px);font-size:clamp(23px,2.1vw,30px);line-height:1.14;margin-bottom:0;overflow-wrap:anywhere;word-break:normal;text-wrap:balance}
.auth-card--provision .auth-provision .auth-sub{margin-bottom:2px;line-height:1.35}
.auth-provision__fields{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px 12px;
  align-content:start;
}
.auth-provision__fields .auth-fld{min-width:0;margin-bottom:0}
.auth-provision__fields .auth-fld label{margin-bottom:4px}
.auth-provision__fields .auth-inp{width:100%;min-width:0;box-sizing:border-box;min-height:40px;padding:9px 11px;text-overflow:ellipsis}
.auth-provision__fields select{display:block;width:100%;min-width:0;max-width:100%;box-sizing:border-box;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.auth-provision__field--wide{grid-column:1/-1}
.auth-provision__fields .mini{margin-top:4px;line-height:1.3}
.auth-card--provision .auth-msg{overflow-wrap:anywhere;word-break:break-word;margin-bottom:2px}
.auth-provision__actions{
  position:static;
  z-index:auto;
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(190px,auto);
  align-items:center;
  gap:12px;
  flex-shrink:0;
  margin:8px -4px 0;
  padding:12px 4px 2px;
  background:#fff;
  border-top:1px solid var(--bp-grid);
}
.auth-provision__hint{
  color:var(--bp-muted);
  font:600 11px var(--bp-data);
  letter-spacing:.02em;
}
.auth-provision__cta{
  margin-top:0;
  width:auto;
  min-width:220px;
  box-shadow:0 -4px 12px rgba(255,255,255,.92),0 8px 18px rgba(21,58,107,.16);
}
.auth-provision__verify{
  grid-column:2;
  justify-self:end;
  align-self:center;
  justify-content:center;
  white-space:nowrap;
  margin-top:-6px;
}
.auth-provision__switch{
  grid-column:2;
  justify-self:end;
  align-self:center;
  justify-content:center;
  white-space:nowrap;
  margin-top:-4px;
  color:var(--bp-muted);
  font-size:11px;
}
.auth-toggle{background:var(--bp-paper-soft);border:1px solid var(--bp-grid);border-radius:5px}
.auth-toggle button{min-height:44px;border-radius:4px}
.auth-toggle button.on{color:var(--bp-blue);background:#fff;border-bottom:2px solid var(--bp-orange);box-shadow:none}
.auth-h{color:var(--bp-ink)}
.auth-sub{color:var(--bp-muted)}
.auth-fld label{color:var(--bp-muted);font:600 11px var(--bp-data);letter-spacing:.035em}
.auth-cta{color:var(--bp-orange-ink);background:var(--bp-orange);border-color:var(--bp-orange)}
.auth-cta:hover{color:var(--bp-orange-ink);background:var(--bp-orange-hover);border-color:var(--bp-orange-hover)}
.auth-x{color:var(--bp-ink);background:var(--bp-paper-soft);border:1px solid var(--bp-grid);border-radius:4px}
.auth-msg{border-radius:4px}

/* Portail client et signature ---------------------------------------------- */
body>.wrap{
  max-width:1120px;
  padding:24px 18px 64px;
}
body>.wrap>.paper,body>.wrap>#app.paper{
  color:var(--bp-ink);
  background:#fff;
  border:2px solid var(--bp-line);
  border-radius:7px;
  box-shadow:8px 8px 0 var(--bp-grid);
}
body>.wrap header.doc{border-bottom-color:var(--bp-ink)}
body>.wrap .brand img{object-fit:contain;background:#fff}
body>.wrap .mini{color:var(--bp-muted)}
body>.wrap table{background:#fff;border:1.5px solid var(--bp-line)}
body>.wrap th{color:var(--bp-muted);background:var(--bp-paper-soft);border-color:var(--bp-line);font-family:var(--bp-data)}
body>.wrap td{border-color:var(--bp-grid)}
body>.wrap .kpi{box-shadow:3px 3px 0 var(--bp-grid)}
body>.wrap .btn,body>.wrap button{
  min-height:44px;
  border-radius:5px;
}
body>.wrap .btn,body>.wrap .accept{color:#fff;background:var(--bp-blue);border-color:var(--bp-blue)}
body>.wrap .refuse{color:var(--bp-danger);background:#fff;border-color:var(--bp-danger)}
body>.wrap .sign{background:var(--bp-paper-soft);border-color:var(--bp-line);border-radius:5px}
body>.wrap .tag,body>.wrap .badge{border-radius:4px;font-family:var(--bp-data)}
body>.wrap footer.pied{color:var(--bp-muted);font-family:var(--bp-data)}

@media(max-width:900px){
  .ld-nav{padding:9px 18px}
  .ld-logo-full{height:68px!important;max-width:200px}
  .ld-navlinks a{display:none}
  .ld-hero{grid-template-columns:minmax(0,1fr);padding:46px 20px 60px}
  .ld-hero__visual{max-width:none}
  .ld-section,.ld-features,.ld-pricing,.ld-why,.ld-faqs{padding:58px 20px}
  .ld-final{margin-inline:20px}
  .auth-card{grid-template-columns:1fr;max-width:620px}
  .auth-aside{display:none}
}
@media(max-width:600px){
  .ld,.ld-bg{background-size:28px 28px}
  .ld-nav{min-height:82px;padding:6px 12px}
  .ld-logo-full{height:68px!important;max-width:190px}
  .ld-navlinks{gap:6px}
  .ld-navlinks .ld-btn{padding-inline:12px}
  .ld-hero{width:100%;max-width:100%;grid-template-columns:minmax(0,1fr);padding:36px 16px 48px;overflow:hidden}
  .ld-kicker,.ld-badge{width:auto;max-width:100%;white-space:normal}
  .ld-cta{display:flex;flex-wrap:wrap}
  .ld-hero h1{font-size:36px}
  .ld-hero__visual{padding:8px;box-shadow:5px 5px 0 var(--bp-grid)}
  .ld-section,.ld-features,.ld-pricing,.ld-why,.ld-faqs{padding:48px 16px}
  .ld-section::before,.ld-features::before,.ld-pricing::before,.ld-final::before{left:16px;right:16px}
  .ld-grid,.ld-grid--3,.ld-operational-grid,.ld-audiences,.ld-benefits,.ld-diffgrid{grid-template-columns:1fr!important}
  .ld-final{margin:0 16px 50px;padding:38px 20px;box-shadow:5px 5px 0 var(--bp-grid)}
  .auth-ov{padding:10px}
  .auth-card{height:min(760px,calc(100vh - 20px));max-height:96vh;box-shadow:5px 5px 0 rgba(192,212,234,.84)}
  .auth-card--provision{height:min(760px,calc(100vh - 20px));max-height:calc(100vh - 20px)}
  .auth-panel{padding:28px 20px 22px}
  .auth-card--provision .auth-panel{padding:20px 18px 14px}
  .auth-provision__fields{grid-template-columns:1fr;gap:8px}
  .auth-provision__field--wide{grid-column:auto}
  .auth-provision__actions{grid-template-columns:1fr;margin-inline:-2px;padding-inline:2px}
  .auth-provision__hint{font-size:10px}
  .auth-provision__cta{width:100%;min-width:0}
  .auth-provision__verify{grid-column:1;justify-self:center;margin-top:0}
  .auth-provision__switch{grid-column:1;justify-self:center;margin-top:0}
  body>.wrap{padding:12px 10px 46px}
  body>.wrap>.paper,body>.wrap>#app.paper{padding:18px 14px;box-shadow:4px 4px 0 var(--bp-grid)}
}

@media(prefers-reduced-motion:reduce){
  .ld.show .ld-kicker,.ld.show .ld-badge,.ld.show .ld-hero h1,.ld.show .ld-lead,
  .ld.show .ld-hero__claim,.ld.show .ld-cta,.ld.show .ld-hero__visual{animation:none!important}
}

/* Responsive audit corrections — keep the critical actions reachable. */
.ld-compare-shell{min-width:0}
.ld-compare-hint{display:none}

@media(max-width:760px){
  /* The login entry must remain available on small screens. */
  .ld-nav{gap:8px}
  .ld-brand{flex:1 1 auto;min-width:0}
  .ld-logo-full{max-width:130px!important;height:58px!important}
  .ld-navlinks{flex:0 0 auto;gap:5px}
  .ld-navlinks .ld-btn{display:inline-flex!important;align-items:center;justify-content:center;min-height:44px;padding:8px 10px;font-size:11px;white-space:nowrap}
  .ld-navlinks .ld-btn.ghost{display:inline-flex!important}
  .ld-compare-hint{display:block;margin:14px 0 7px;color:var(--bp-muted);font:600 11px/1.35 var(--bp-data)}
  .ld-compare{scroll-snap-type:x proximity}
  .ld-compare__head{position:sticky;top:0;z-index:2}

  /* The signup card remains scrollable, but the primary action never leaves
     the viewport while the user completes the long form. */
  .auth-panel>.auth-cta:not(.auth-provision__cta){position:sticky;bottom:0;z-index:3;width:100%;margin-top:12px;padding-block:12px;box-shadow:0 -8px 16px rgba(255,255,255,.96),0 8px 18px rgba(21,58,107,.14)}
  .auth-signup-progress{position:sticky;top:0;z-index:4;padding-block:7px;background:#fff;box-shadow:0 4px 8px rgba(21,58,107,.07)}
  .auth-card--provision .auth-provision__actions{position:sticky;bottom:0;z-index:4;box-shadow:0 -8px 16px rgba(255,255,255,.96)}
}
