/* Espace Pro : raccourcis du haut de page, sur les mêmes tokens que la page d'accueil (body.page-assistant). */
.pro-shortcuts{margin:0}
.pro-shortcuts-title{margin:0 0 12px;font-size:13px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--hx-muted)}
.pro-shortcuts ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.pro-shortcut{display:flex;gap:12px;align-items:center;height:100%;padding:14px;border-radius:18px;background:var(--hx-card);border:1px solid var(--hx-border);box-shadow:var(--hx-card-shadow);color:var(--hx-text);text-decoration:none;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
.pro-shortcut:hover{transform:translateY(-2px);box-shadow:var(--hx-card-shadow-hover);border-color:var(--hx-border-strong)}
.pro-shortcut:focus-visible{outline:3px solid #f59e0b;outline-offset:3px}
.pro-shortcut .hx-tile{flex:none}
.pro-shortcut strong{display:block;font-size:15px;line-height:1.25;color:var(--hx-text)}
.pro-shortcut small{display:block;margin-top:3px;font-size:12.5px;line-height:1.4;color:var(--hx-muted)}
@media (max-width:560px){.pro-shortcuts ul{grid-template-columns:1fr}}

/* Animations : entrée échelonnée, flèche au survol, halo doux (transform et opacité seulement) */
@keyframes pro-rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes pro-halo{0%,100%{opacity:.55;transform:translate3d(0,0,0) scale(1)}50%{opacity:.8;transform:translate3d(0,-10px,0) scale(1.04)}}
.pro-hero .hx-hero-copy>*{animation:pro-rise .7s cubic-bezier(.2,.7,.2,1) both}
.pro-hero .hx-hero-copy>*:nth-child(2){animation-delay:.08s}
.pro-hero .hx-hero-copy>*:nth-child(3){animation-delay:.16s}
.pro-hero .hx-hero-copy>*:nth-child(4){animation-delay:.24s}
.pro-hero .hx-hero-copy>*:nth-child(5){animation-delay:.32s}
.pro-shortcuts{position:relative;isolation:isolate}
.pro-shortcuts::before{content:"";position:absolute;inset:-28px -24px;z-index:-1;border-radius:36px;background:radial-gradient(closest-side,color-mix(in srgb,#0b5cff 16%,transparent),transparent 70%);animation:pro-halo 9s ease-in-out infinite;pointer-events:none}
.pro-shortcuts li{animation:pro-rise .6s cubic-bezier(.2,.7,.2,1) both;animation-delay:calc(.25s + var(--d,0) * .09s)}
.pro-shortcut{position:relative;overflow:hidden}
.pro-shortcut::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 35%,color-mix(in srgb,#fff 22%,transparent) 50%,transparent 65%);transform:translateX(-120%);pointer-events:none}
.pro-shortcut:hover::after{transform:translateX(120%);transition:transform .8s ease}
.pro-shortcut .hx-tile{transition:transform .35s cubic-bezier(.2,.7,.2,1)}
.pro-shortcut:hover .hx-tile{transform:translateY(-2px) rotate(-6deg) scale(1.06)}
.pro-shortcut-go{margin-left:auto;display:inline-grid;place-items:center;flex:none;width:26px;height:26px;border-radius:999px;color:var(--hx-c-blue,#0b5cff);opacity:0;transform:translateX(-8px);transition:opacity .25s ease,transform .3s cubic-bezier(.2,.7,.2,1)}
.pro-shortcut-go .icon{width:16px;height:16px}
.pro-shortcut:hover .pro-shortcut-go,.pro-shortcut:focus-visible .pro-shortcut-go{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  .pro-hero .hx-hero-copy>*,.pro-shortcuts li,.pro-shortcuts::before{animation:none}
  .pro-shortcut,.pro-shortcut .hx-tile,.pro-shortcut-go{transition:none}
  .pro-shortcut:hover{transform:none}
  .pro-shortcut:hover .hx-tile{transform:none}
  .pro-shortcut::after{display:none}
}

/* Badge de l'espace : icône de l'espace (serviette pour le Pro, maison pour la Location) */
.hub-badge .icon{width:16px;height:16px;flex:none}

/* Identité des espaces : couleur de leur logo (vert pour Pro, orange pour Location), document d'exemple, raccourcis, parcours */
.sp-pro{--sp:#10b981;--sp-ink:#047857;--sp-paper-ink:#047857;--sp-grad:linear-gradient(100deg,#0b5cff 0%,#0a7fc0 45%,#059669 100%);--sp-btn:linear-gradient(100deg,#0b5cff,#047857)}
.sp-location{--sp:#f97316;--sp-ink:#c2410c;--sp-paper-ink:#c2410c;--sp-grad:linear-gradient(100deg,#ea580c,#c2410c);--sp-btn:linear-gradient(100deg,#c2410c,#9a3412)}
.sp-hero{--sp-soft:color-mix(in srgb,var(--sp) 11%,transparent);position:relative;isolation:isolate}
:root[data-theme=dark] .sp-pro{--sp-ink:#6ee7b7;--sp-grad:linear-gradient(100deg,#8cbcff,#34d399)}
:root[data-theme=dark] .sp-location{--sp-ink:#fdba74;--sp-grad:linear-gradient(100deg,#fdba74,#fb923c)}
@media (prefers-color-scheme:dark){
  :root:not([data-theme=light]) .sp-pro{--sp-ink:#6ee7b7;--sp-grad:linear-gradient(100deg,#8cbcff,#34d399)}
  :root:not([data-theme=light]) .sp-location{--sp-ink:#fdba74;--sp-grad:linear-gradient(100deg,#fdba74,#fb923c)}
}
/* Halos du haut recolorés aux couleurs de l'espace (sombre par défaut, clair ensuite) ; le fond lui-même est celui de toute la page */
.sp-pro{--hx-halo-1:rgba(37,99,235,.30);--hx-halo-2:rgba(16,185,129,.24);--hx-halo-3:rgba(52,211,153,.16)}
.sp-location{--hx-halo-1:rgba(37,99,235,.26);--hx-halo-2:rgba(249,115,22,.26);--hx-halo-3:rgba(251,146,60,.16)}
:root[data-theme=light] .sp-pro{--hx-halo-1:rgba(90,140,255,.55);--hx-halo-2:rgba(16,185,129,.42);--hx-halo-3:rgba(52,211,153,.34)}
:root[data-theme=light] .sp-location{--hx-halo-1:rgba(90,140,255,.45);--hx-halo-2:rgba(249,115,22,.36);--hx-halo-3:rgba(251,146,60,.30)}
@media (prefers-color-scheme:light){
  :root:not([data-theme=dark]) .sp-pro{--hx-halo-1:rgba(90,140,255,.55);--hx-halo-2:rgba(16,185,129,.42);--hx-halo-3:rgba(52,211,153,.34)}
  :root:not([data-theme=dark]) .sp-location{--hx-halo-1:rgba(90,140,255,.45);--hx-halo-2:rgba(249,115,22,.36);--hx-halo-3:rgba(251,146,60,.30)}
}
.sp-hero>.b2b-container{position:relative;z-index:1}
.sp-hero .hx-hero-demo::before{background:radial-gradient(60% 60% at 60% 40%,color-mix(in srgb,var(--sp) 30%,transparent),transparent 70%)}

.sp-id{display:inline-flex;align-items:center;gap:12px;margin:0 0 20px;padding:5px 18px 5px 5px;border-radius:999px;background:var(--hx-card);border:1px solid color-mix(in srgb,var(--sp) 38%,transparent);box-shadow:0 12px 30px -20px color-mix(in srgb,var(--sp) 80%,transparent);font-size:14px;line-height:1.35;color:var(--hx-muted)}
.sp-id img{flex:none;width:42px;height:42px;object-fit:contain;border-radius:50%;background:#fff;padding:2px}
.sp-id strong{color:var(--sp-ink);font-weight:800}
.sp-hero .sp-eyebrow{margin:0 0 12px;font-size:13px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--sp-ink)}
.sp-hero .sp-grad{background:var(--sp-grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.sp-for{list-style:none;margin:-6px 0 24px;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.sp-for li{padding:5px 13px;border-radius:999px;font-size:13px;font-weight:700;color:var(--sp-ink);background:var(--sp-soft);border:1px solid color-mix(in srgb,var(--sp) 28%,transparent)}
.sp-hero .hx-perks .hx-i{color:var(--sp-ink)}
.sp-hero .hx-btn-primary,.sp-hero .hx-btn-primary:visited{background:var(--sp-btn);box-shadow:0 12px 28px -12px color-mix(in srgb,var(--sp) 75%,transparent)}
.sp-hero .hx-btn-primary:hover{box-shadow:0 16px 34px -12px color-mix(in srgb,var(--sp) 90%,transparent)}

/* Document d'exemple : une vraie feuille blanche, dans les deux thèmes */
.sp-doc{position:relative;z-index:1;width:min(100%,440px);margin:0;padding:30px 28px 18px;border-radius:18px;background:#fff;color:#10213f;border:1px solid rgba(16,33,63,.08);box-shadow:0 2px 4px rgba(15,40,85,.06),0 44px 80px -36px rgba(15,40,85,.5);font-size:14px;overflow:hidden;animation:pro-rise .8s .2s cubic-bezier(.2,.7,.2,1) both}
.sp-doc::before{content:"";position:absolute;inset:0 0 auto;height:6px;background:var(--sp-btn)}
.sp-doc-head{margin:0 0 12px;padding-right:110px}
.sp-doc-head strong{display:block;font-size:20px;font-weight:800;line-height:1.2;text-transform:uppercase;letter-spacing:.01em;color:var(--sp-paper-ink)}
.sp-hero .sp-doc-head span{font-size:13px;color:#4c5d78}
.sp-hero .sp-doc-parties{margin:0 0 14px;font-size:13px;line-height:1.55;color:#43546f}
.sp-hero .sp-doc-parties b{color:#10213f}
.sp-doc-table{width:100%;border-collapse:collapse;font-size:13.5px}
.sp-doc-table td{padding:7px 0;border-bottom:1px solid #e6ebf3;color:#10213f}
.sp-doc-table td:last-child{padding-left:12px;text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
.sp-doc-table .is-sub td{color:#43546f;border-bottom-style:dashed}
.sp-doc-table .is-total td{padding-top:12px;border:0;font-size:16px;font-weight:800}
.sp-doc-foot{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.sp-chip{display:inline-flex;align-items:center;gap:6px;padding:5px 11px;border-radius:999px;font-size:12px;font-weight:700;color:var(--sp-paper-ink);background:color-mix(in srgb,var(--sp) 12%,#fff)}
.sp-chip .icon{width:14px;height:14px}
.sp-hero .sp-doc-sign{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:10px;font-size:12px;color:#4c5d78}
.sp-doc-sign svg{width:150px;height:44px;fill:none;stroke:#10213f;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:420;stroke-dashoffset:0;animation:sp-sign 1.6s 1s ease both}
.sp-stamp{position:absolute;top:24px;right:22px;padding:5px 13px;border:3px solid #059669;border-radius:10px;color:#047857;font-size:17px;font-weight:900;letter-spacing:.12em;text-transform:uppercase;transform:rotate(-12deg);animation:sp-stamp .5s 1.2s cubic-bezier(.2,.9,.3,1.3) both}
.sp-hero .sp-doc figcaption{margin-top:14px;font-size:11.5px;color:#5b6b85}
@keyframes sp-stamp{from{opacity:0;transform:rotate(-12deg) scale(1.8)}to{opacity:1;transform:rotate(-12deg) scale(1)}}
@keyframes sp-sign{from{stroke-dashoffset:420}to{stroke-dashoffset:0}}

/* Raccourcis sous le premier écran (Location : selon que l'on est propriétaire ou locataire) */
.sp-shortcuts{margin-top:clamp(36px,5vw,60px)}
.sp-shortcuts::before{display:none}
.sp-shortcuts ul{grid-template-columns:repeat(5,minmax(0,1fr))}
.sp-pro .sp-shortcuts ul{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:1100px){.sp-shortcuts ul,.sp-pro .sp-shortcuts ul{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:860px){.sp-shortcuts ul,.sp-pro .sp-shortcuts ul{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.sp-shortcuts ul,.sp-pro .sp-shortcuts ul{grid-template-columns:1fr}}
.b2b.hx-hero.sp-hero .hx-hero-copy h1{font-size:clamp(36px,4.6vw,62px)}
.sp-hero .sp-tile{background:var(--sp-soft);color:var(--sp-ink)}
.sp-hero .pro-shortcut-go{color:var(--sp-ink)}
.sp-hero .pro-shortcut:hover{border-color:color-mix(in srgb,var(--sp) 45%,transparent)}
.sp-persona{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0 0 14px}
.sp-persona .pro-shortcuts-title{margin:0 6px 0 0}
.sp-persona input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
.sp-persona label{display:inline-flex;align-items:center;gap:8px;padding:8px 16px;border-radius:999px;border:1px solid var(--hx-border);background:var(--hx-card);font-size:14px;font-weight:700;color:var(--hx-text);cursor:pointer;transition:background-color .2s,color .2s,border-color .2s}
.sp-persona label .icon{width:16px;height:16px}
.sp-persona input:checked+label{background:var(--sp-btn);border-color:transparent;color:#fff}
.sp-persona input:focus-visible+label{outline:3px solid #f59e0b;outline-offset:3px}
.sp-shortcuts .sp-list-tenant,.sp-shortcuts:has(#sp-tenant:checked) .sp-list-owner{display:none}
.sp-shortcuts:has(#sp-tenant:checked) .sp-list-tenant{display:grid}

/* Parcours en 4 étapes */
.sp-steps{list-style:none;margin:clamp(24px,3.5vw,36px) 0 0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.sp-steps li{animation:pro-rise .6s cubic-bezier(.2,.7,.2,1) both;animation-delay:calc(.4s + var(--d,0) * .1s)}
.sp-steps a{position:relative;display:flex;align-items:center;gap:12px;height:100%;padding:14px 16px;border-radius:16px;background:var(--hx-card);border:1px solid color-mix(in srgb,var(--sp) 26%,transparent);color:var(--hx-text);text-decoration:none;transition:transform .25s,border-color .25s}
.sp-steps a:hover{transform:translateY(-2px);border-color:color-mix(in srgb,var(--sp) 55%,transparent)}
.sp-steps a:focus-visible{outline:3px solid #f59e0b;outline-offset:3px}
.sp-steps li:not(:last-child) a::after{content:"";position:absolute;top:50%;right:-11px;width:8px;height:8px;border-top:2px solid var(--sp-ink);border-right:2px solid var(--sp-ink);transform:translateY(-50%) rotate(45deg)}
.sp-step-n{flex:none;display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:var(--sp-btn);color:#fff;font-size:14px;font-weight:800}
.sp-steps strong{display:block;font-size:15px;line-height:1.25;color:var(--hx-text)}
.sp-steps small{display:block;margin-top:2px;font-size:12.5px;line-height:1.35;color:var(--hx-muted)}
@media (max-width:860px){.sp-steps{grid-template-columns:repeat(2,minmax(0,1fr))}.sp-steps li a::after{display:none}}
@media (max-width:520px){.sp-steps{grid-template-columns:1fr}.sp-id{border-radius:22px}.sp-doc{padding:26px 18px 16px}.sp-doc-head{padding-right:96px}}
@media (prefers-reduced-motion:reduce){
  .sp-doc,.sp-stamp,.sp-doc-sign svg,.sp-steps li{animation:none}
  .sp-steps a,.sp-persona label{transition:none}
  .sp-steps a:hover{transform:none}
}

/* Fond continu sur toute la page : halos aux couleurs de l'espace, en motif de 1800 px répété sans couture
   (chaque halo reste à l'intérieur du motif), premier écran et corps de page transparents */
.sp-hero{--hx-bg-hero:transparent}
.sp-location .sp-stamp{border-color:#c2410c;color:#c2410c}
html body.sp-page-pro section.space-body,html body.sp-page-location section.space-body{background:transparent!important}
body.sp-page-pro .site-main,body.sp-page-location .site-main{background-color:#071731;background-repeat:repeat-y;background-size:100% 1800px}
body.sp-page-pro .site-main{background-image:radial-gradient(620px 420px at 4% 330px,rgba(37,99,235,.30),transparent 70%),radial-gradient(620px 420px at 96% 900px,rgba(16,185,129,.22),transparent 70%),radial-gradient(620px 420px at 10% 1460px,rgba(16,185,129,.16),transparent 70%),radial-gradient(520px 380px at 88% 1500px,rgba(37,99,235,.18),transparent 70%)}
body.sp-page-location .site-main{background-image:radial-gradient(620px 420px at 4% 330px,rgba(37,99,235,.28),transparent 70%),radial-gradient(620px 420px at 96% 900px,rgba(249,115,22,.22),transparent 70%),radial-gradient(620px 420px at 10% 1460px,rgba(249,115,22,.15),transparent 70%),radial-gradient(520px 380px at 88% 1500px,rgba(37,99,235,.16),transparent 70%)}
:root[data-theme=light] body.sp-page-pro .site-main,:root[data-theme=light] body.sp-page-location .site-main{background-color:#eef3fc}
:root[data-theme=light] body.sp-page-pro .site-main{background-image:radial-gradient(620px 420px at 4% 330px,#c9dcff,transparent 70%),radial-gradient(620px 420px at 96% 900px,#c4efdb,transparent 70%),radial-gradient(620px 420px at 10% 1460px,#d5f5e7,transparent 70%),radial-gradient(520px 380px at 88% 1500px,#d6e4ff,transparent 70%)}
:root[data-theme=light] body.sp-page-location .site-main{background-image:radial-gradient(620px 420px at 4% 330px,#cfdfff,transparent 70%),radial-gradient(620px 420px at 96% 900px,#ffdcc6,transparent 70%),radial-gradient(620px 420px at 10% 1460px,#ffe7d8,transparent 70%),radial-gradient(520px 380px at 88% 1500px,#d9e6ff,transparent 70%)}
@media (prefers-color-scheme:light){
  :root:not([data-theme=dark]) body.sp-page-pro .site-main,:root:not([data-theme=dark]) body.sp-page-location .site-main{background-color:#eef3fc}
  :root:not([data-theme=dark]) body.sp-page-pro .site-main{background-image:radial-gradient(620px 420px at 4% 330px,#c9dcff,transparent 70%),radial-gradient(620px 420px at 96% 900px,#c4efdb,transparent 70%),radial-gradient(620px 420px at 10% 1460px,#d5f5e7,transparent 70%),radial-gradient(520px 380px at 88% 1500px,#d6e4ff,transparent 70%)}
  :root:not([data-theme=dark]) body.sp-page-location .site-main{background-image:radial-gradient(620px 420px at 4% 330px,#cfdfff,transparent 70%),radial-gradient(620px 420px at 96% 900px,#ffdcc6,transparent 70%),radial-gradient(620px 420px at 10% 1460px,#ffe7d8,transparent 70%),radial-gradient(520px 380px at 88% 1500px,#d9e6ff,transparent 70%)}
}

/* Mode sombre lisible : le corps de page reprend les couleurs de texte du thème (il héritait d'un bleu nuit prévu pour le clair) */
body.sp-page-pro .space-body,body.sp-page-location .space-body{color:var(--c-text)}
body.sp-page-pro .space-body .muted,body.sp-page-location .space-body .muted{color:var(--c-muted)}
:root[data-theme=dark] body.sp-page-pro .sp-premium-k,:root[data-theme=dark] body.sp-page-location .sp-premium-k{color:#b9a8ff}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]) body.sp-page-pro .sp-premium-k,:root:not([data-theme=light]) body.sp-page-location .sp-premium-k{color:#b9a8ff}}
.sp-pro .sp-chip{color:#065f46}
.sp-location .sp-chip{color:#9a3412}
:root[data-theme=dark] body.sp-page-pro .doc-tag,:root[data-theme=dark] body.sp-page-location .doc-tag{color:#a9c4f0}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]) body.sp-page-pro .doc-tag,:root:not([data-theme=light]) body.sp-page-location .doc-tag{color:#a9c4f0}}