/* Cibly · thème « pastel chaleureux » : crème et pêche, sarcelle pour l'action, corail pour les accents,
   bleu ardoise du logo pour le texte. Chargé en dernier : redéfinit les jetons de styles.css et app-shell.css. */
:root {
  --cream: #FFF8EF;
  --peach: #FDE7BC;
  --peach-2: #FBD9A0;
  --teal: #2E6E69;
  --teal-dark: #23574F;
  --coral: #E07B5F;
  --coral-dark: #C8603F;
  --ink: #1F3A4D;

  --white: #ffffff;
  --pearl: #FFF8EF;
  --mist: #F7ECDD;
  --line: #F0E1CC;
  --line-strong: #E3CFB2;
  --navy: #1F3A4D;
  --navy-2: #2C4A5C;
  --slate: #55606A;
  --muted: #868B8F;
  --royal: #2E6E69;
  --royal-dark: #23574F;
  --royal-soft: #E4F1EE;
  --royal-mid: #B9DCD5;
  --gold: #C8603F;
  --gold-bright: #F2B544;
  --gold-soft: #FDF0D8;
  --amber: #B45309;
  --amber-soft: #FEF3E2;
  --red: #C2413A;
  --red-soft: #FDECEA;
  --green: #2F7D5B;
  --green-soft: #E7F4EC;
  --violet: #7A5AB8;
  --violet-soft: #F1ECFA;

  --sb-bg: #22504C;
  --sb-bg-2: #2B5F5A;
  --sb-line: rgba(255, 248, 239, .12);
  --sb-text: #E3EFEC;
  --sb-dim: #A8C9C3;

  --f-friendly: "Fredoka", "Nunito", var(--f-display);
  --shadow-sm: 0 1px 2px rgba(80, 52, 20, .05), 0 1px 1px rgba(80, 52, 20, .03);
  --shadow-md: 0 1px 2px rgba(80, 52, 20, .04), 0 10px 30px -14px rgba(80, 52, 20, .16);
  --shadow-lg: 0 2px 4px rgba(80, 52, 20, .04), 0 28px 64px -24px rgba(80, 52, 20, .24);
}
body, body.pro { background: var(--cream); }

/* Boutons : sarcelle pour l'action principale */
.btn-navy { background: var(--teal); color: #fff; box-shadow: 0 8px 20px -10px rgba(46, 110, 105, .6); }
.btn-navy:hover { background: var(--teal-dark); box-shadow: 0 12px 26px -10px rgba(46, 110, 105, .65); }
.btn-royal { background: var(--teal); box-shadow: 0 8px 20px -10px rgba(46, 110, 105, .6); }
.btn-royal:hover { background: var(--teal-dark); }
.btn-gold { background: var(--gold-bright); color: var(--ink); box-shadow: 0 8px 22px -10px rgba(242, 181, 68, .8); }
.btn-gold:hover { background: #EBA52C; }
.btn-gold .btn-icon { color: var(--ink); --gold-bright: var(--ink); }
.btn-ghost:hover { border-color: var(--teal); color: var(--teal-dark); }
.link-btn, a { color: var(--teal); }
.chip-btn.active { background: var(--teal); border-color: var(--teal); }
.chip-btn:hover { border-color: var(--teal); color: var(--teal-dark); }
:focus-visible { outline-color: var(--teal); }
input:focus, textarea:focus, select:focus, .badge-input:focus, .unit-input input:focus, .search:focus { border-color: var(--teal); box-shadow: 0 0 0 3px rgba(46, 110, 105, .14); }
input:checked + .switch { background: var(--teal); }

/* Titres d'esprit amical */
.view-head h2, .gate-head h2, .block-head h3, .hd-head h3, .top10-head h3, .ob-head h3 { font-family: var(--f-friendly); font-weight: 600; letter-spacing: 0; }
.eyebrow-gold { color: var(--coral); }
.logo-word { font-family: var(--f-friendly); font-weight: 700; letter-spacing: -.01em; }

/* Barre latérale */
.sidebar { background: linear-gradient(180deg, #22504C 0%, #1D4542 100%); border-right-color: #1A3E3B; }
.sb-tenant { background: rgba(255, 248, 239, .08); }
.sb-tenant:hover { border-color: rgba(242, 181, 68, .6); background: rgba(255, 248, 239, .12); }
.sb-tenant .tenant-mono { background: var(--peach); color: var(--ink); }
.sb-nav a[aria-current="page"] { background: rgba(255, 248, 239, .14); }
.sb-nav a[aria-current="page"]::before { background: var(--gold-bright); }
.sb-nav a[aria-current="page"] svg { color: var(--gold-bright); }
.logo-light .logo-mark { color: #fff; }
.topbar { background: rgba(255, 248, 239, .94); }

/* Accueil */
#v-accueil .hero { background: linear-gradient(180deg, #FFF3E0 0%, var(--cream) 100%); }
.hero h1 { font-family: var(--f-friendly); font-weight: 600; letter-spacing: -.01em; }
.hero-arcs { background: repeating-radial-gradient(circle at center, transparent 0 58px, rgba(224, 123, 95, .08) 58px 59px); }
.hd-head .tenant-mono, .tenant-mono { background: var(--teal); color: #fff; }
.j-n, .bf-ico, .pillar-icon { background: var(--teal); color: var(--peach); }
.bf-ico svg { stroke: var(--peach); }
.hd-stats button:hover { background: var(--royal-soft); }
.sector-band span:not(.muted) { background: #fff; }

/* Cartes indicateurs sombres : bleu ardoise du logo */
.ov-stat.hi, .crm-kpis .kpi.due, .hd-stats button.hot, .sp-code { background: var(--ink); border-color: var(--ink); }
.ov-stat.hi b, .crm-kpis .kpi.due b, .hd-stats button.hot b { color: var(--gold-bright); }

/* Carte de France */
.map-wrap { background: radial-gradient(circle at 50% 45%, #fff 0%, var(--cream) 75%); }
#france .dep { fill: #F3E7D6; stroke: #fff; }
#france .dep.zone { fill: #E4F1EE; stroke: #B9DCD5; }
#france .dep.scanned { fill: #D7EBE6; }
#france .dep.hit { fill: #8CC3B9; }
#france .dep.hit.h2 { fill: #4F9C90; }
#france .dep.hit.h3 { fill: var(--teal); }
#france .dep.hit:hover, #france .dep.selected { fill: var(--ink); }
#france .dep:not(.hit):hover { fill: #EBDcc6; }
#france .dep.reg { fill: #D7EBE6; }
#france .dep.att { fill: #FBE3CF; }
#france .bubble circle.core { fill: var(--ink); stroke: var(--gold-bright); }
#france .bubble circle.halo { fill: rgba(46, 110, 105, .16); }
#france .bubble.region circle.core { fill: #fff; stroke: var(--coral); }
#france .bubble.attrib circle.core { fill: var(--coral); stroke: #fff; }
#france .bubble.attrib circle.halo { fill: rgba(224, 123, 95, .18); }
.sweep { background: conic-gradient(from 0deg, rgba(46, 110, 105, 0) 0deg, rgba(46, 110, 105, 0) 290deg, rgba(46, 110, 105, .12) 340deg, rgba(242, 181, 68, .32) 359deg, rgba(242, 181, 68, 0) 360deg); }
.lg-hit { background: var(--teal); }
.dep-counts .bar i, .crit-track i, .pct i::after, .crit-mini i::after { background: linear-gradient(90deg, var(--teal), #5FA89D); }
.crit-track.mid i { background: linear-gradient(90deg, var(--gold-bright), #F6CB75); }

/* Scores et jauges */
.score-badge.fort, .oc-verdict.fort b { background: var(--teal); color: #fff; }
.ring.fort .val { stroke: var(--teal); }
.ring.moyen .val { stroke: var(--gold-bright); }
.hb-val.fort { color: var(--teal-dark); }
.hb-val.moyen { color: var(--coral-dark); }
.opp-card.fort { border-left-color: var(--teal); }
.opp-card.moyen { border-left-color: var(--gold-bright); }
.mk-why { background: linear-gradient(180deg, #EAF4F1, #fff); border-color: var(--royal-mid); }
.tile.futur { background: linear-gradient(180deg, var(--gold-soft), #fff 70%); }

/* Pipeline */
.col { background: #F8EEE1; }
.col.drop { background: var(--royal-soft); }
.kpi.value { background: linear-gradient(135deg, #EAF4F1, #fff); }
.quick-mail { background: var(--royal-soft); border-color: var(--royal-mid); color: var(--teal-dark); }
.quick-mail:hover { background: var(--teal); border-color: var(--teal); color: #fff; }
.tabs button[aria-selected="true"] { border-bottom-color: var(--coral); }
.segmented { background: #F4E7D5; }

/* ------------------------------------------------------------------ */
/* Écran de connexion                                                  */
/* ------------------------------------------------------------------ */
.gate { background: #fff; }
.gate-pastel {
  background: linear-gradient(180deg, #FEEBC6 0%, var(--peach) 55%, #FCDFA8 100%);
  color: var(--ink); display: flex; flex-direction: column; gap: 14px; padding: 36px clamp(24px, 4vw, 56px) 40px;
}
.gate-pastel .tag-tous { align-self: center; margin: 0; font: 500 15px/1.3 var(--f-body); letter-spacing: .12em; text-transform: uppercase; color: var(--coral); background: none; padding: 0; box-shadow: none; }
.gate-pastel .hello { align-self: center; width: min(540px, 100%); margin-top: -4px; }
.hello-illu { width: 100%; height: auto; display: block; overflow: visible; }
.hello-illu .perso .bras { animation: coucou 2.6s ease-in-out infinite; animation-delay: var(--d); }
.hello-illu .perso .main { transform-box: fill-box; transform-origin: 50% 100%; animation: salut 1.3s ease-in-out infinite; animation-delay: var(--d); }
@keyframes coucou { 0%, 55%, 100% { transform: rotate(0); } 12%, 34% { transform: rotate(-7deg); } 23%, 45% { transform: rotate(6deg); } }
@keyframes salut { 0%, 100% { transform: rotate(0); } 50% { transform: rotate(12deg); } }
.hello-illu .bulle { animation: flotte 4s ease-in-out infinite; }
.hello-illu .bulle + .bulle { animation-delay: -2s; }
@keyframes flotte { 50% { transform: translateY(-5px); } }
.hello-illu .logo-txt { filter: drop-shadow(0 6px 10px rgba(31, 58, 77, .15)); }
.gate-pastel .gate-pitch { align-self: stretch; display: grid; gap: 12px; max-width: 40rem; text-align: left; }
.gate-pastel .gate-pitch h1 { margin: 0; color: var(--coral); font: 500 clamp(24px, 2.4vw, 33px)/1.18 var(--f-body); letter-spacing: .005em; text-transform: uppercase; }
.gate-pastel .gate-pitch p { color: #4D4A47; font-size: 16.5px; line-height: 1.6; }
.pastel-proof { list-style: none; margin: 6px 0 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px 28px; max-width: 40rem; }
.pastel-proof li { border: 0; padding: 0; background: none; box-shadow: none; display: grid; gap: 4px; }
.pastel-proof b { font: 500 17px var(--f-body); color: var(--ink); display: flex; gap: 8px; align-items: center; }
.pastel-proof li > span { font-size: 13.5px; color: #4D4A47; line-height: 1.5; }

.gate-panel { background: #fff; }
.gate-head h2 { color: var(--ink); font-family: var(--f-display); font-weight: 800; letter-spacing: -.015em; }
.gate-tabs { background: #F1F3F4; }
#gate-list input[type="email"], #gate-list input[type="password"], #gate-activate input, #wizard input[type="text"], #wizard input[type="email"], #wizard input[type="password"] {
  background: #EEF2F6; border-color: #DCE3EA; border-radius: 12px; padding: 13px 14px;
}
#gate-list input.invalid { background: #FCE9E6; border-color: #F2B9AE; }
#lg-error, #ac-error, #wz-error { color: var(--coral-dark); }
#lg-btn { background: var(--teal); color: #fff; border-color: var(--teal); border-radius: 12px; font-weight: 600; box-shadow: 0 10px 22px -12px rgba(46, 110, 105, .8); }
#lg-btn:hover { background: var(--teal-dark); }
.gate-alt .link-btn { color: var(--teal); }
.gate-how { border-top-color: #E8EAEC; }
.gate-how b { color: var(--ink); }
.tenant-new:hover, .sector-opt:hover { border-color: var(--teal); }
.sector-opt[aria-checked="true"] { border-color: var(--teal); background: var(--royal-soft); color: var(--teal-dark); }
.wz-steps li.current { background: var(--teal); }
.wz-steps li.current span { background: var(--peach); color: var(--ink); }

/* Portail Cibly Pro */
.pro-top { background: var(--sb-bg); }
.pro-gate { background: linear-gradient(180deg, #FEEBC6 0%, var(--peach) 100%); }
.pro-badge { background: var(--coral); color: #fff; }
.b-scan { background: var(--teal); }
.b-opp { background: var(--gold-bright); }
.lg-scan { background: var(--teal); }
.lg-opp { background: var(--gold-bright); }

@media (max-width: 1180px) { .gate-pastel { padding-block: 26px 32px; } }
@media (max-width: 720px) { .pastel-proof { grid-template-columns: minmax(0, 1fr); } .gate-pastel .gate-pitch h1 { font-size: 23px; } }
@media (prefers-reduced-motion: reduce) { .hello-illu .perso .bras, .hello-illu .perso .main, .hello-illu .bulle { animation: none; } }

/* Écran de connexion : proportions affinées, bouton jaune, piliers en grille 2 × 2 */
.gate-pastel { background: #FDF3E7; align-items: center; gap: 16px; padding-top: 30px; }
.gate-pastel .tag-tous { color: #C25E38; font-weight: 600; font-size: 13px; letter-spacing: .16em; }
.gate-pastel .hello { width: min(405px, 100%); margin-top: 0; }
.gate-pastel .gate-pitch { max-width: 34rem; text-align: center; justify-items: center; gap: 10px; }
.gate-pastel .gate-pitch h1 { color: #C25E38; font: 600 clamp(22px, 2.1vw, 29px)/1.2 var(--f-friendly); letter-spacing: .01em; }
.gate-pastel .gate-pitch p { font-size: 15.5px; color: #4D4A47; }
.pastel-proof { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; max-width: 36rem; width: 100%; margin-top: 6px; }
.pastel-proof li { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 12px; align-items: start; align-content: start; padding: 14px 15px; background: rgba(255, 255, 255, .72); border-radius: 16px; box-shadow: 0 6px 18px -14px rgba(120, 72, 30, .45); }
.pastel-proof .pp-ico { width: 38px; height: 38px; border-radius: 12px; display: grid; place-items: center; font-size: 19px; }
.pastel-proof .i1 { background: #FDE2CF; } .pastel-proof .i2 { background: #D9EFEA; } .pastel-proof .i3 { background: #FBE3E0; } .pastel-proof .i4 { background: #FEF0C3; }
.pastel-proof li div { display: grid; gap: 3px; min-width: 0; }
.pastel-proof b { font: 600 14.5px/1.3 var(--f-friendly); color: var(--ink); }
.pastel-proof li div span { font-size: 13px; line-height: 1.5; color: #4D4A47; }
#lg-btn { background: #FBBF24; border-color: #F59E0B; color: #1E293B; border-radius: 12px; font-weight: 700; box-shadow: 0 10px 22px -12px rgba(245, 158, 11, .85); }
#lg-btn:hover { background: #F59E0B; color: #1E293B; }
#lg-btn:focus-visible { outline: 3px solid #1E293B; outline-offset: 3px; }
@media (max-width: 720px) { .pastel-proof { grid-template-columns: minmax(0, 1fr); } }

/* Écran de connexion : illustration « corporate flat », logo géométrique, finitions nettes */
.gate-pastel .hello { width: min(440px, 100%); }
.pro-illu .salue { animation: salue 2.8s ease-in-out infinite; animation-delay: var(--d); }
@keyframes salue { 0%, 50%, 100% { transform: rotate(0); } 12%, 32% { transform: rotate(-8deg); } 22%, 42% { transform: rotate(6deg); } }
.pro-illu .pro-card { animation: flotte 5s ease-in-out infinite; filter: drop-shadow(0 12px 18px rgba(31, 58, 77, .12)); }
.gate-logo { display: inline-flex; align-items: center; gap: 10px; color: var(--ink); margin-top: 2px; }
.gate-logo .logo-mark { width: 34px; height: 34px; color: var(--ink); --gold-bright: #E07B5F; }
.gate-logo span { font: 800 30px/1 "Plus Jakarta Sans", Inter, "Helvetica Neue", Arial, sans-serif; letter-spacing: -.03em; }
.gate-pastel .gate-pitch h1 { font-family: "Plus Jakarta Sans", Inter, sans-serif; font-weight: 800; letter-spacing: -.005em; }
.pastel-proof b { font-family: "Plus Jakarta Sans", Inter, sans-serif; font-weight: 700; }
#lg-btn { border-radius: 8px; }
@media (prefers-reduced-motion: reduce) { .pro-illu .salue, .pro-illu .pro-card { animation: none; } }

/* ------------------------------------------------------------------ */
/* Écran d'accès en une colonne : présentation pleine largeur, formulaire dessous */
/* ------------------------------------------------------------------ */
.gate { display: block; min-height: 0; background: #fff; }
.gate-hero.gate-pastel {
  display: flex; flex-direction: column; align-items: center; gap: 18px; min-height: 0;
  padding: 36px clamp(16px, 4vw, 56px) 48px; background: #FDF3E7; border-bottom: 1px solid #F3E2CB;
}
.gate-hero .tag-tous { margin: 0; color: #C25E38; font: 700 13px/1 var(--f-body); letter-spacing: .18em; text-transform: uppercase; }
.gate-hero .hello { width: min(980px, 100%); margin: 0; }
.wide-illu .salue { animation: salue 2.8s ease-in-out infinite; animation-delay: var(--d); }
.wide-illu .bulle { animation: flotte 4.5s ease-in-out infinite; }
.wide-illu .bulle:last-of-type { animation-delay: -2.2s; }
.wide-illu .logo-card { filter: drop-shadow(0 12px 20px rgba(31, 58, 77, .12)); }
.gate-hero .gate-pitch { max-width: 46rem; text-align: center; justify-items: center; gap: 12px; }
.gate-hero .gate-pitch h1 { color: #C25E38; font: 800 clamp(26px, 3vw, 40px)/1.12 "Plus Jakarta Sans", Inter, sans-serif; letter-spacing: -.01em; text-transform: uppercase; }
.gate-hero .gate-pitch p { font-size: 16.5px; line-height: 1.6; color: #4D4A47; max-width: 40rem; }
.hero-cta { display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; margin-top: 6px; }
.btn-sun, #lg-btn { background: #FBBF24; border-color: #F59E0B; color: #1E293B; border-radius: 10px; font-weight: 700; box-shadow: 0 10px 22px -12px rgba(245, 158, 11, .85); }
.btn-sun:hover, #lg-btn:hover { background: #F59E0B; color: #1E293B; }
.btn-sun:focus-visible, #lg-btn:focus-visible { outline: 3px solid #1E293B; outline-offset: 3px; }
.gate-hero .pastel-proof { grid-template-columns: repeat(4, minmax(0, 1fr)); max-width: 1180px; width: 100%; gap: 16px; margin-top: 10px; }
.gate-hero .pastel-proof li { grid-template-columns: minmax(0, 1fr); gap: 10px; padding: 20px; background: #fff; border-radius: 16px; box-shadow: 0 10px 26px -18px rgba(120, 72, 30, .45); }
.gate-hero .pastel-proof .pp-ico { width: 44px; height: 44px; font-size: 21px; }
.gate-hero .pastel-proof b { font-size: 15.5px; }
.gate-hero .pastel-proof li div span { font-size: 13px; line-height: 1.5; }

.gate-panel#acces { display: flex; flex-direction: column; align-items: center; max-height: none; overflow: visible; padding: 48px 16px 72px; scroll-margin-top: 0; }
.gate-panel#acces > .gate-step { margin-block: 0; width: 100%; max-width: 520px; }
.gate-panel#acces > .wizard { max-width: 680px; }
.gate-panel#acces .gate-head { text-align: center; justify-items: center; }
.gate-panel#acces .gate-tabs { justify-self: center; }
.gate-panel#acces .gate-head .link-btn { justify-self: center; }
.gate-panel#acces .gate-alt { text-align: center; }
.gate-panel#acces .gate-how { text-align: left; }
.gate-panel#acces .wz-steps { justify-content: center; }
@media (max-width: 1080px) { .gate-hero .pastel-proof { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) { .gate-hero .pastel-proof { grid-template-columns: minmax(0, 1fr); } .gate-panel#acces .gate-how { grid-template-columns: minmax(0, 1fr); } }
@media (prefers-reduced-motion: reduce) { .wide-illu .salue, .wide-illu .bulle { animation: none; } }
.gate-hero .gate-pitch { align-self: center; width: 100%; margin-inline: auto; }

/* ------------------------------------------------------------------ */
/* Vue d'ensemble (connecté) : espace de travail, métriques, top 3, flux */
/* ------------------------------------------------------------------ */
#v-accueil { padding-inline: clamp(16px, 3.2vw, 44px); padding-block: 34px 56px; }
#v-accueil .view-head h2 { font-size: clamp(26px, 2.6vw, 34px); }
#home-date { text-transform: none; letter-spacing: .02em; font-size: 13px; }
#home-date::first-letter { text-transform: uppercase; }
.ws { padding: 20px 22px; display: grid; gap: 16px; background: linear-gradient(135deg, #fff 0%, #FFF8EF 100%); border-color: #F0E1CC; }
.ws-head h3 { font: 600 19px var(--f-friendly); color: var(--ink); }
.ws-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1.35fr); gap: 14px; }
.ws-tile { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 14px; align-items: start; padding: 16px; border-radius: 14px; background: #fff; border: 1px solid #F0E1CC; }
.ws-ico { width: 42px; height: 42px; border-radius: 12px; display: grid; place-items: center; }
.ws-ico svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.ws-ico.mail { background: #FCE6DF; color: var(--coral-dark); }
.ws-ico.agenda { background: #E4F1EE; color: var(--teal); }
.ws-ico.day { background: #FEF0C3; color: #9A6A00; }
.ws-body { display: grid; gap: 6px; justify-items: start; min-width: 0; }
.ws-body > b { font: 600 15px var(--f-friendly); color: var(--ink); }
.ws-body > small { font-size: 12.5px; color: var(--slate); line-height: 1.45; }
.ws-etat { font: 700 11.5px var(--f-body); padding: 3px 9px; border-radius: 999px; display: inline-flex; align-items: center; gap: 6px; }
.ws-etat::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
.ws-etat.on { background: var(--green-soft); color: var(--green); }
.ws-etat.off { background: #FDEFD6; color: #A1580E; }
.ws-counts { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; width: 100%; }
.ws-counts span { display: grid; gap: 1px; padding: 8px 9px; border-radius: 10px; background: var(--cream); font-size: 11.5px; color: var(--slate); line-height: 1.25; }
.ws-counts em { font: 800 20px var(--f-display); font-style: normal; color: var(--ink); font-variant-numeric: tabular-nums; }
.ws-counts span.hl { background: var(--ink); color: #D7E1E8; }
.ws-counts span.hl em { color: var(--gold-bright); }
.ws-next { list-style: none; margin: 2px 0 0; padding: 0; display: grid; gap: 4px; width: 100%; }
.ws-next button { width: 100%; text-align: left; display: grid; padding: 6px 9px 6px 11px; border: 0; border-left: 3px solid var(--line-strong); border-radius: 6px; background: none; }
.ws-next button:hover { background: var(--cream); }
.ws-next li.retard button { border-left-color: var(--red); }
.ws-next li.aujourdhui button { border-left-color: var(--gold-bright); }
.ws-next b { font-size: 13px; font-weight: 600; color: var(--ink); }
.ws-next small { font-size: 12px; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.home-metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.hm { text-align: left; display: grid; gap: 4px; padding: 18px; border-radius: 14px; border: 1px solid var(--line); background: #fff; box-shadow: var(--shadow-sm); transition: transform .2s, box-shadow .2s, border-color .2s; }
.hm:hover { transform: translateY(-2px); box-shadow: var(--shadow-md); border-color: var(--royal-mid); }
.hm > span { font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: .07em; color: var(--muted); }
.hm b { font: 800 30px/1.1 var(--f-display); color: var(--ink); font-variant-numeric: tabular-nums; }
.hm small { font-size: 12.5px; color: var(--slate); }
.hm.hot { background: var(--ink); border-color: var(--ink); }
.hm.hot > span, .hm.hot small { color: #C9D6DE; }
.hm.hot b { color: var(--gold-bright); }
.home-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr); gap: 16px; align-items: start; }
.home-top, .home-feed { padding: 18px 20px; display: grid; gap: 12px; }
.hs-head { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.hs-head h3 { font: 600 17px var(--f-friendly); color: var(--ink); }
.home-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; }
.home-list button { width: 100%; text-align: left; display: grid; grid-template-columns: auto auto minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 9px 10px; border-radius: 10px; border: 1px solid transparent; background: none; }
.home-list.feed button { grid-template-columns: auto minmax(0, 1fr) auto; }
.home-list button:hover { background: var(--cream); border-color: var(--line); }
.home-list .rang { font: 800 14px var(--f-display); color: var(--coral); width: 16px; text-align: center; }
.hf-txt { display: grid; min-width: 0; }
.hf-txt b { font-size: 13.5px; font-weight: 600; color: var(--ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hf-txt small { font-size: 12px; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hf-meta { display: grid; justify-items: end; gap: 3px; }
.hf-meta small { font-size: 11.5px; color: var(--muted); white-space: nowrap; }
@media (max-width: 1180px) { .ws-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } .ws-day { grid-column: 1 / -1; } .home-grid { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 720px) { .ws-grid, .home-metrics { grid-template-columns: minmax(0, 1fr); } .ws-counts { grid-template-columns: repeat(2, minmax(0, 1fr)); } .home-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); } .hf-meta { display: none; } .home-list.feed button { grid-template-columns: auto minmax(0, 1fr); } }
#v-accueil .view-body { padding: 0; }
.hf-meta { display: flex; align-items: center; gap: 4px; }
.hf-meta .src-tag + .src-tag { display: none; }
.ws-counts { grid-template-columns: repeat(3, minmax(0, 1fr)) minmax(0, 1.3fr); }

/* ================================================================== */
/* Portail client « Light Corporate Pastel » : blanc, beige, bleu, jaune */
/* ================================================================== */
:root {
  --cream: #FAF6F0;
  --teal: #2B6CB0;
  --teal-dark: #245A93;
  --ink: #1E293B;
  --navy: #1E293B;
  --navy-2: #334155;
  --slate: #475569;
  --muted: #64748B;
  --pearl: #FAF6F0;
  --mist: #F3EEE6;
  --line: #EDE6DA;
  --line-strong: #DCD2C3;
  --royal: #2B6CB0;
  --royal-dark: #245A93;
  --royal-soft: #EBF4FF;
  --royal-mid: #BEE3F8;
  --gold: #B7791F;
  --gold-bright: #FBBF24;
  --gold-soft: #FEF6DE;
  --sun: #FBBF24;
  --sun-dark: #F59E0B;
  --sun-soft: #FEF3C7;
  --sb-bg: #FFFFFF;
  --sb-bg-2: #FAF6F0;
  --sb-line: #EDE6DA;
  --sb-text: #334155;
  --sb-dim: #8A94A3;
}
.shell, .shell .main { background: #FAF6F0; }
.eyebrow-gold { color: #B7791F; }
.view-head h2, .gate-head h2, .block-head h3, .hs-head h3, .ws-head h3 { color: var(--ink); }

/* Boutons : bleu pour l'action principale, jaune pour les actions rapides */
.btn-navy, .btn-royal { background: #2B6CB0; color: #fff; box-shadow: 0 8px 20px -12px rgba(43, 108, 176, .7); }
.btn-navy:hover, .btn-royal:hover { background: #245A93; }
.btn-gold, .btn-sun { background: #FBBF24; border-color: #F59E0B; color: #1E293B; box-shadow: 0 8px 20px -12px rgba(245, 158, 11, .8); }
.btn-gold:hover, .btn-sun:hover { background: #F59E0B; color: #1E293B; }
.btn-gold .btn-icon { color: #1E293B; --gold-bright: #1E293B; }
.btn-ghost { background: #fff; border-color: #DCD2C3; color: #1E293B; }
.btn-ghost:hover { border-color: #2B6CB0; color: #245A93; }
.chip-btn.active { background: #2B6CB0; border-color: #2B6CB0; color: #fff; }
input:checked + .switch { background: #2B6CB0; }
.link-btn, .shell a { color: #2B6CB0; }

/* Barre latérale claire */
.sidebar { background: #FFFFFF; border-right: 1px solid #EDE6DA; color: #334155; box-shadow: 6px 0 24px -20px rgba(30, 41, 59, .25); }
.sidebar .logo-light, .sidebar .logo-light .logo-word { color: #1E293B; }
.sidebar .logo-light .logo-mark { color: #1E293B; }
.sb-tag { color: #8A94A3; }
.sb-tenant { background: #FAF6F0; border-color: #EDE6DA; color: #1E293B; }
.sb-tenant:hover { background: #F5EFE6; border-color: #FBBF24; }
.sb-tenant-txt b { color: #1E293B; }
.sb-tenant-txt small { color: #64748B; }
.sb-tenant .tenant-mono { background: #FBBF24; color: #1E293B; }
.sb-sep { color: #A0A8B5; }
.sb-nav a { color: #334155; }
.sb-nav a svg { opacity: .9; }
.sb-nav a:hover { background: #FAF6F0; color: #1E293B; }
.sb-nav a[aria-current="page"] { background: #FEF3C7; color: #1E293B; font-weight: 600; }
.sb-nav a[aria-current="page"]::before { background: #FBBF24; }
.sb-nav a[aria-current="page"] svg { color: #2B6CB0; }
.sb-nav .nav-count { background: #EBF4FF; color: #245A93; }
.sb-nav .nav-count.due { background: #FBBF24; color: #1E293B; }
.sb-foot { border-top-color: #EDE6DA; }
.sb-user-txt b { color: #1E293B; }
.sb-user-txt small, .sb-foot .status { color: #64748B; }
.sb-logout { border-color: #EDE6DA; color: #475569; }
.sb-logout:hover { background: #FAF6F0; color: #1E293B; }
.topbar { background: rgba(255, 255, 255, .95); }

/* Barre supérieure : état messagerie / agenda / tâches */
.app-top { position: sticky; top: 0; z-index: 20; display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap;
  padding: 10px clamp(16px, 3.2vw, 44px); background: rgba(255, 255, 255, .92); backdrop-filter: blur(10px); border-bottom: 1px solid #EDE6DA; }
.app-top:empty { display: none; }
.at-ent { font: 700 14px var(--f-display); color: #1E293B; }
.at-chips { display: flex; gap: 8px; flex-wrap: wrap; }
.at-chip { display: inline-flex; align-items: center; gap: 7px; font-size: 12.5px; font-weight: 600; padding: 6px 12px; border-radius: 999px; border: 1px solid transparent; background: none; }
.at-chip svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.at-chip.on { background: #EAF7EF; color: #23784B; border-color: #CDEBD8; }
.at-chip.off { background: #FEF3C7; color: #8A5A00; border-color: #FBD786; cursor: pointer; }
.at-chip.off:hover { background: #FBBF24; color: #1E293B; }
.at-chip.tasks { background: #EBF4FF; color: #245A93; border-color: #BEE3F8; cursor: pointer; }
.at-chip.tasks:hover { background: #2B6CB0; color: #fff; }
@media (max-width: 960px) { .app-top { top: 58px; } .at-ent { display: none; } }

/* Cartes et tableau de bord */
.card, .hm, .ws-tile, .home-top, .home-feed, .kpi, .ov-stat { background: #FFFFFF; border-color: #EDE6DA; }
.ws { background: linear-gradient(135deg, #FFFFFF 0%, #FAF6F0 100%); border-color: #EDE6DA; }
.ws-ico.mail { background: #EBF4FF; color: #2B6CB0; }
.ws-ico.agenda { background: #FEF3C7; color: #B7791F; }
.ws-ico.day { background: #F3EEE6; color: #475569; }
.ws-etat.on { background: #EAF7EF; color: #23784B; }
.ws-etat.off { background: #FEF3C7; color: #8A5A00; }
.ws-actions { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; margin-top: 2px; }
.ws-counts span { background: #FAF6F0; }
.ws-counts span.hl { background: #FEF3C7; color: #8A5A00; }
.ws-counts span.hl em { color: #1E293B; }
.hm.hot, .ov-stat.hi, .crm-kpis .kpi.due, .hd-stats button.hot { background: #FEF3C7; border-color: #FBD786; }
.hm.hot > span, .hm.hot small, .ov-stat.hi span, .crm-kpis .kpi.due > span, .crm-kpis .kpi.due small { color: #8A5A00; }
.hm.hot b, .ov-stat.hi b, .crm-kpis .kpi.due b, .hd-stats button.hot b { color: #1E293B; }
.hm:hover { border-color: #BEE3F8; }
.home-list .rang { color: #B7791F; }
.home-list button:hover { background: #FAF6F0; }
.tenant-mono, .hd-head .tenant-mono { background: #2B6CB0; color: #fff; }
.j-n, .bf-ico, .pillar-icon { background: #2B6CB0; color: #fff; }

/* Scores, jauges, carte */
.score-badge.fort, .oc-verdict.fort b { background: #2B6CB0; color: #fff; }
.score-badge.moyen { background: #FEF3C7; color: #8A5A00; box-shadow: inset 0 0 0 1px #FBD786; }
.ring.fort .val { stroke: #2B6CB0; }
.ring.moyen .val { stroke: #FBBF24; }
.hb-val.fort { color: #245A93; }
.hb-val.moyen { color: #B7791F; }
.opp-card.fort { border-left-color: #2B6CB0; }
.opp-card.moyen { border-left-color: #FBBF24; }
.mk-why { background: linear-gradient(180deg, #EBF4FF, #fff); border-color: #BEE3F8; }
.dep-counts .bar i, .crit-track i, .pct i::after, .crit-mini i::after { background: linear-gradient(90deg, #2B6CB0, #63A4E0); }
.crit-track.mid i { background: linear-gradient(90deg, #FBBF24, #FCD579); }
#france .dep { fill: #F1EBE1; }
#france .dep.zone { fill: #EBF4FF; stroke: #BEE3F8; }
#france .dep.scanned { fill: #DCEBFA; }
#france .dep.hit { fill: #A3CBF0; }
#france .dep.hit.h2 { fill: #5F9BD8; }
#france .dep.hit.h3 { fill: #2B6CB0; }
#france .dep.hit:hover, #france .dep.selected { fill: #1E293B; }
#france .dep.reg { fill: #DCEBFA; }
#france .bubble circle.core { fill: #1E293B; stroke: #FBBF24; }
#france .bubble circle.halo { fill: rgba(43, 108, 176, .16); }
#france .bubble.region circle.core { fill: #fff; stroke: #2B6CB0; }
#france .bubble.attrib circle.core { fill: #FBBF24; stroke: #fff; }
#france .bubble.attrib text { fill: #1E293B; }
.sweep { background: conic-gradient(from 0deg, rgba(43, 108, 176, 0) 0deg, rgba(43, 108, 176, 0) 290deg, rgba(43, 108, 176, .12) 340deg, rgba(251, 191, 36, .35) 359deg, rgba(251, 191, 36, 0) 360deg); }
.lg-hit { background: #2B6CB0; }
.map-wrap { background: radial-gradient(circle at 50% 45%, #fff 0%, #FAF6F0 75%); }

/* Pipeline */
.col { background: #F5EFE6; }
.col.drop { background: #EBF4FF; }
.kpi.value { background: linear-gradient(135deg, #EBF4FF, #fff); }
.quick-mail { background: #EBF4FF; border-color: #BEE3F8; color: #245A93; }
.quick-mail:hover { background: #2B6CB0; border-color: #2B6CB0; color: #fff; }
.tabs button[aria-selected="true"] { border-bottom-color: #FBBF24; }
.segmented { background: #F3EEE6; }
.sp-code { background: #1E293B; }
.pro-top { background: #1E293B; }
.b-scan, .lg-scan { background: #2B6CB0; }

/* ================================================================== */
/* Confort visuel : contrastes adoucis, bordures fines, ombres douces   */
/* ================================================================== */
:root {
  --ink: #2D3748; --navy: #2D3748; --navy-2: #4A5568; --slate: #4A5568; --muted: #718096;
  --line: #E2E8F0; --line-strong: #CBD5E0; --cream: #F8F6F0; --pearl: #F8F6F0;
  --royal: #2B6CB0; --royal-dark: #2C5282; --royal-soft: #EBF4FF; --royal-mid: #BEE3F8;
  --shadow-sm: 0 1px 2px rgba(45, 55, 72, .04);
  --shadow-md: 0 1px 2px rgba(45, 55, 72, .03), 0 8px 24px -16px rgba(45, 55, 72, .14);
  --shadow-lg: 0 2px 4px rgba(45, 55, 72, .03), 0 22px 48px -26px rgba(45, 55, 72, .2);
}
body .shell, .shell .main { background: #F8F6F0; color: #2D3748; }
.shell h1, .shell h2, .shell h3, .shell h4 { color: #2D3748; }
.card, .hm, .home-top, .home-feed, .kpi, .ov-stat, .tk, .opp-card, .integ, .dossier { background: #fff; border: 1px solid #E2E8F0; box-shadow: var(--shadow-md); }
.sidebar { border-right-color: #E2E8F0; }
.app-top { border-bottom-color: #E2E8F0; }

/* Haut de la vue d'ensemble : emploi du temps + synchronisation */
.home-top-grid { display: grid; grid-template-columns: minmax(0, 2.3fr) minmax(280px, 1fr); gap: 16px; align-items: start; }
.cal { padding: 18px 20px 20px; display: grid; gap: 12px; }
.cal-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; flex-wrap: wrap; }
.cal-head h3, .sync h3 { font: 600 18px var(--f-friendly); color: #2D3748; }
.cal-nav { display: flex; gap: 6px; align-items: center; }
.cal-nav .icon-btn { font-size: 18px; line-height: 1; display: grid; place-items: center; color: #4A5568; border-color: #E2E8F0; }
.cal-nav .btn:disabled { opacity: .5; cursor: default; }
.cal-legend { display: flex; gap: 6px 14px; flex-wrap: wrap; font-size: 11.5px; color: #718096; }
.cal-legend span { display: inline-flex; align-items: center; gap: 6px; }
.cal-legend i { width: 10px; height: 10px; border-radius: 3px; }
.cal-grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); border: 1px solid #E2E8F0; border-radius: 12px; overflow: hidden; background: #fff; }
.cal-day { min-height: 220px; display: grid; grid-template-rows: auto 1fr; border-left: 1px solid #EDF2F7; min-width: 0; }
.cal-day:first-child { border-left: 0; }
.cal-day.we { background: #FBFAF7; }
.cal-day.past .cal-items { opacity: .62; }
.cal-dh { display: flex; align-items: baseline; justify-content: center; gap: 6px; padding: 9px 4px; border-bottom: 1px solid #EDF2F7; font-size: 12px; color: #718096; text-transform: capitalize; }
.cal-dh b { font: 700 15px var(--f-display); color: #2D3748; font-variant-numeric: tabular-nums; }
.cal-day.today .cal-dh { background: #EBF4FF; color: #2B6CB0; }
.cal-day.today .cal-dh b { width: 26px; height: 26px; border-radius: 50%; display: inline-grid; place-items: center; background: #2B6CB0; color: #fff; font-size: 13px; }
.cal-items { display: flex; flex-direction: column; gap: 5px; padding: 7px 6px 9px; min-width: 0; }
.cal-ev { width: 100%; text-align: left; display: grid; gap: 1px; padding: 6px 7px; border-radius: 8px; border: 0; border-left: 3px solid; font-size: 11.5px; line-height: 1.3; min-width: 0; transition: transform .15s, box-shadow .15s; }
.cal-ev:not(:disabled):hover { transform: translateY(-1px); box-shadow: 0 4px 10px -6px rgba(45, 55, 72, .35); }
.cal-ev:disabled { cursor: default; }
.cal-ev .ce-top { display: flex; justify-content: space-between; gap: 4px; }
.cal-ev em { font-style: normal; font-weight: 700; font-size: 9.5px; text-transform: uppercase; letter-spacing: .06em; opacity: .85; }
.cal-ev time { font-weight: 700; font-size: 10.5px; font-variant-numeric: tabular-nums; }
.cal-ev b { font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cal-ev small { font-size: 10.5px; opacity: .75; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cal-ev.relance, .lg-relance i { background: #EBF4FF; border-color: #3182CE; color: #2C5282; }
.cal-ev.approche, .lg-approche i { background: #FEF6DD; border-color: #FBBF24; color: #7A5300; }
.cal-ev.rdv, .lg-rdv i { background: #EAF7EF; border-color: #48A774; color: #22643F; }
.cal-ev.remise, .lg-remise i { background: #FDEEEC; border-color: #E07B5F; color: #9B3B26; }
.cal-ev.action, .lg-action i { background: #F3EFF9; border-color: #9F7AEA; color: #553C9A; }
.cal-ev.ext, .lg-ext i { background: #F1F4F8; border-color: #A0AEC0; color: #4A5568; }
.cal-legend i { border-left: 3px solid; }
.cal-more { border: 0; background: none; color: #2B6CB0; font-size: 11.5px; font-weight: 700; text-align: left; padding: 2px 4px; }
.cal-empty { color: #CBD5E0; font-size: 12px; text-align: center; padding-top: 6px; }
.cal-err { color: #9B3B26; }
.sync { padding: 18px 20px; display: grid; gap: 12px; align-content: start; }
.sync header p { margin-top: 2px; }
.sync-row { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 12px; align-items: start; padding-top: 12px; border-top: 1px solid #EDF2F7; }
.sync header + .sync-row { border-top: 0; padding-top: 2px; }
.sync-body { display: grid; gap: 5px; justify-items: start; }
.sync-body b { font: 600 14.5px var(--f-friendly); color: #2D3748; }
.sync-body small { font-size: 12.5px; color: #718096; line-height: 1.45; }
.sync .ws-etat.on { background: #EBF4FF; color: #2C5282; }
.sync .ws-etat.off { background: #FEF6DD; color: #7A5300; }
.sync-btns .btn { white-space: normal; }
.sync-choice { padding: 12px; border-radius: 12px; background: #F8F6F0; border: 1px solid #E2E8F0; display: grid; gap: 8px; }
.sync-choice .btn:disabled { opacity: .5; cursor: not-allowed; }
.sync-note { color: #718096; }
.sync-today { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; padding: 10px 12px; border-radius: 10px; background: #F8F6F0; font-size: 12.5px; color: #4A5568; }
.sync-today b { font: 800 16px var(--f-display); color: #2D3748; }
.sync-today .link-btn { margin-left: auto; }
@media (max-width: 1280px) { .home-top-grid { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 860px) {
  .cal-grid { grid-template-columns: minmax(0, 1fr); }
  .cal-day { min-height: 0; grid-template-columns: 74px minmax(0, 1fr); grid-template-rows: none; border-left: 0; border-top: 1px solid #EDF2F7; }
  .cal-day:first-child { border-top: 0; }
  .cal-dh { border-bottom: 0; border-right: 1px solid #EDF2F7; flex-direction: column; align-items: center; justify-content: center; }
}
.cal-ev b { white-space: normal; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.cal-ev small { white-space: normal; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.cal-legend i { width: 10px; height: 10px; border: 0 !important; }
.cal-legend .lg-relance i { background: #3182CE; } .cal-legend .lg-approche i { background: #FBBF24; } .cal-legend .lg-rdv i { background: #48A774; }
.cal-legend .lg-remise i { background: #E07B5F; } .cal-legend .lg-action i { background: #9F7AEA; } .cal-legend .lg-ext i { background: #A0AEC0; }
.cal-items { padding: 7px 5px 9px; }

/* ================================================================== */
/* Portail client : typographie éditoriale, bleu profond, blanc cassé   */
/* ================================================================== */
:root {
  --f-friendly: "Plus Jakarta Sans", Inter, "Helvetica Neue", Arial, sans-serif;
  --ink: #0F172A; --navy: #0F172A; --navy-2: #1E293B; --slate: #475569; --muted: #64748B;
  --line: #E2E8F0; --line-strong: #CBD5E1; --cream: #FAF8F5; --pearl: #FAF8F5; --mist: #F1F5F9;
  --royal: #1E3A8A; --royal-dark: #172E6E; --royal-soft: #EEF2FF; --royal-mid: #C7D2FE;
  --deep: #1E3A8A; --deep-2: #2563EB;
}
body .shell, .shell .main { background: #FAF8F5; color: #0F172A; }
.shell h1, .shell h2, .shell h3, .shell h4 { color: #0F172A; }

/* Titres : ultra-gras, crénage resserré */
.shell .view-head h2, #home-hello { font: 800 clamp(30px, 3.4vw, 46px)/1.02 var(--f-friendly); letter-spacing: -.04em; }
.shell .cal-head h3, .shell .sync h3, .shell .hs-head h3, .shell .block-head h3, .shell .top10-head h3, .shell .ob-head h3, .shell .ws-head h3 { font: 800 21px/1.15 var(--f-friendly); letter-spacing: -.04em; }
.shell .logo-word { font: 800 22px/1 var(--f-friendly); letter-spacing: -.04em; }
.shell .hm b, .shell .kpi b, .shell .ov-stat b, .shell .fn-step b { font-weight: 800; letter-spacing: -.04em; }
.shell .eyebrow, .shell .eyebrow-gold, #home-date { color: #1E3A8A; letter-spacing: .08em; }
#home-date { text-transform: uppercase; font-size: 12px; font-weight: 700; }

/* En-tête épuré */
.app-top { justify-content: flex-start; background: rgba(250, 248, 245, .9); }
.at-ent { font: 800 15px var(--f-friendly); letter-spacing: -.03em; color: #0F172A; }

/* Bleu profond pour les actions et les éléments actifs */
.shell .btn-navy, .shell .btn-royal, .shell .btn-gold, .shell .btn-sun { background: #1E3A8A; border-color: #1E3A8A; color: #fff; box-shadow: 0 10px 22px -14px rgba(30, 58, 138, .8); }
.shell .btn-navy:hover, .shell .btn-royal:hover, .shell .btn-gold:hover, .shell .btn-sun:hover { background: #2563EB; border-color: #2563EB; color: #fff; }
.shell .btn-gold .btn-icon { color: #fff; --gold-bright: #fff; }
.shell .btn-ghost { background: #fff; border-color: #E2E8F0; color: #0F172A; }
.shell .btn-ghost:hover { border-color: #1E3A8A; color: #1E3A8A; }
.shell .link-btn, .shell a { color: #1E3A8A; }
.shell .chip-btn.active { background: #1E3A8A; border-color: #1E3A8A; }
.shell input:checked + .switch { background: #1E3A8A; }
.shell input:focus, .shell textarea:focus, .shell select:focus { border-color: #2563EB; box-shadow: 0 0 0 3px rgba(37, 99, 235, .15); }

/* Barre latérale */
.sidebar { background: #fff; border-right-color: #E2E8F0; }
.sb-tenant { background: #FAF8F5; border-color: #E2E8F0; }
.sb-tenant:hover { border-color: #1E3A8A; background: #F5F3EF; }
.sb-tenant .tenant-mono, .tenant-mono, .hd-head .tenant-mono { background: #1E3A8A; color: #fff; }
.sb-nav a { color: #334155; }
.sb-nav a[aria-current="page"] { background: #EEF2FF; color: #1E3A8A; font-weight: 700; }
.sb-nav a[aria-current="page"]::before { background: #1E3A8A; }
.sb-nav a[aria-current="page"] svg { color: #1E3A8A; }
.sb-nav .nav-count { background: #EEF2FF; color: #1E3A8A; }
.sb-nav .nav-count.due { background: #1E3A8A; color: #fff; }

/* Cartes */
.card, .hm, .home-top, .home-feed, .kpi, .ov-stat, .tk, .opp-card, .integ, .dossier, .ws-tile { background: #fff; border: 1px solid #E2E8F0; border-radius: 16px; }
.hm.hot, .ov-stat.hi, .crm-kpis .kpi.due, .hd-stats button.hot { background: #1E3A8A; border-color: #1E3A8A; }
.hm.hot > span, .hm.hot small, .ov-stat.hi span, .crm-kpis .kpi.due > span, .crm-kpis .kpi.due small { color: #C7D2FE; }
.hm.hot b, .ov-stat.hi b, .crm-kpis .kpi.due b, .hd-stats button.hot b { color: #fff; }
.hm:hover { border-color: #C7D2FE; }
.home-list .rang { color: #1E3A8A; }

/* Scores et badges */
.score-badge.fort, .oc-verdict.fort b { background: #1E3A8A; color: #fff; }
.score-badge.moyen { background: #EEF2FF; color: #1E3A8A; box-shadow: inset 0 0 0 1px #C7D2FE; }
.ring.fort .val { stroke: #1E3A8A; }
.ring.moyen .val { stroke: #60A5FA; }
.hb-val.fort { color: #1E3A8A; }
.hb-val.moyen { color: #2563EB; }
.opp-card.fort { border-left: 3px solid #1E3A8A; }
.opp-card.moyen { border-left: 3px solid #60A5FA; }
.ob-count.on, .tabs button[aria-selected="true"] { border-bottom-color: #1E3A8A; }
.ob-count.on { background: #1E3A8A; color: #fff; }
.sync .ws-etat.on, .ws-etat.on { background: #EEF2FF; color: #1E3A8A; }
.sync .ws-etat.off, .ws-etat.off { background: #F1F5F9; color: #475569; }
.ws-ico.mail, .ws-ico.agenda { background: #EEF2FF; color: #1E3A8A; }
.cal-day.today .cal-dh { background: #EEF2FF; color: #1E3A8A; }
.cal-day.today .cal-dh b { background: #1E3A8A; }
.cal-ev.approche { background: #F1F5F9; border-color: #64748B; color: #334155; }
.cal-legend .lg-approche i { background: #64748B; }
.cal-ev.relance { background: #EEF2FF; border-color: #2563EB; color: #1E3A8A; }
.cal-legend .lg-relance i { background: #2563EB; }
.dep-counts .bar i, .crit-track i, .pct i::after, .crit-mini i::after { background: linear-gradient(90deg, #1E3A8A, #3B82F6); }
#france .dep.hit { fill: #BFDBFE; } #france .dep.hit.h2 { fill: #60A5FA; } #france .dep.hit.h3 { fill: #1E3A8A; }
#france .bubble circle.core { fill: #0F172A; stroke: #60A5FA; }
.lg-hit { background: #1E3A8A; }

/* ------------------------------------------------------------------ */
/* Vue d'ensemble : emploi du temps aligné sur le panneau de synchro    */
/* ------------------------------------------------------------------ */
.home-top-grid { align-items: stretch; }
.home-top-grid .cal { display: flex; flex-direction: column; }
.home-top-grid .cal-grid { flex: 1; min-height: 260px; }
.home-top-grid .cal-day { min-height: 0; }
.home-top-grid .sync { align-content: start; }

/* ------------------------------------------------------------------ */
/* Opportunités : Top 5 en histogramme, puis liste épurée               */
/* ------------------------------------------------------------------ */
.top10 { padding: 24px 26px 22px; gap: 18px; }
.top10-head h3 { font: 800 22px/1.15 var(--f-friendly); letter-spacing: -.04em; }
.hbars { gap: 8px; }
.hb-scale, .hb-row { grid-template-columns: 36px minmax(200px, 34%) minmax(0, 1fr) 70px; }
.hb-row { padding: 12px 10px; border-radius: 14px; }
.hb-row:hover { background: #F8FAFF; border-color: #E0E7FF; }
.hb-rank { width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center; background: #EEF2FF; color: #1E3A8A; font-size: 13px; }
.hb-row:nth-child(2) .hb-rank { background: #1E3A8A; color: #fff; }
.hb-label b { font-size: 14.5px; }
.hb-track { height: 30px; border-radius: 10px; background: #F1F5F9; }
.hb-bar { border-radius: 10px; box-shadow: 0 6px 14px -10px rgba(30, 58, 138, .6); }
.hb-track .grid { background: rgba(255, 255, 255, .8); }
.hb-val { font: 800 22px var(--f-friendly); letter-spacing: -.04em; color: #0F172A; }
.hb-val small { font-size: 12px; font-weight: 600; color: #5A6D87; margin-left: 1px; letter-spacing: 0; }
.opp-rows { display: grid; gap: 10px; }
.or-head { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.or-head h3 { font: 800 20px var(--f-friendly); letter-spacing: -.04em; }
.or-head h3 .muted { font-weight: 600; font-size: 14px; letter-spacing: 0; }
.or-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.or-row { display: grid; grid-template-columns: 34px 50px minmax(0, 1fr) auto 34px; gap: 14px; align-items: center; padding: 13px 16px; background: #fff; border: 1px solid #E2E8F0; border-radius: 14px; cursor: pointer;
  transition: border-color .2s, box-shadow .2s, transform .2s; animation: rise .35s ease both; animation-delay: calc(var(--i) * 18ms); }
.or-row:hover { border-color: #C7D2FE; box-shadow: 0 10px 24px -18px rgba(30, 58, 138, .5); transform: translateY(-1px); }
.or-row:focus-visible { outline: 2px solid #2563EB; outline-offset: 2px; }
.or-rang { font: 800 14px var(--f-friendly); color: #5A6D87; text-align: center; letter-spacing: -.02em; }
.or-score { height: 38px; border-radius: 11px; display: grid; place-items: center; font: 800 17px var(--f-friendly); letter-spacing: -.04em; background: #F1F5F9; color: #475569; }
.or-score.fort { background: #1E3A8A; color: #fff; }
.or-score.moyen { background: #EEF2FF; color: #1E3A8A; }
.or-main { display: grid; gap: 2px; min-width: 0; }
.or-main b { font-size: 14.5px; font-weight: 700; color: #0F172A; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.or-main small { font-size: 12.5px; color: #64748B; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.or-main em { font-style: normal; font-size: 12.5px; color: #1E3A8A; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.or-tags { display: flex; gap: 6px; align-items: center; justify-content: flex-end; flex-wrap: wrap; max-width: 300px; }
.or-add, .or-ok { width: 32px; height: 32px; border-radius: 10px; display: grid; place-items: center; font-size: 18px; font-weight: 700; }
.or-add { border: 1px solid #E2E8F0; background: #fff; color: #1E3A8A; }
.or-add:hover { background: #1E3A8A; border-color: #1E3A8A; color: #fff; }
.or-ok { color: #23784B; background: #EAF7EF; font-size: 15px; }
@media (max-width: 860px) {
  .or-row { grid-template-columns: 44px minmax(0, 1fr) 32px; }
  .or-rang { display: none; }
  .or-tags { grid-column: 2 / 4; justify-content: flex-start; max-width: none; }
}

/* ------------------------------------------------------------------ */
/* Veille amont : frise « Horizon de publication » aérée                */
/* ------------------------------------------------------------------ */
.am-timeline-card { padding: 22px 24px 20px; gap: 16px; }
.tl { grid-template-columns: repeat(var(--n), minmax(78px, 1fr)); min-width: 1404px; }
.tl-col { padding: 0 8px 10px; gap: 8px; min-height: 150px; border-left-color: #EDF2F7; }
.tl-head { display: grid; gap: 2px; padding: 10px 2px 12px; white-space: nowrap; line-height: 1.25; border-bottom: 1px solid #EDF2F7; text-transform: none; letter-spacing: 0; }
.tl-head b { font: 700 14px var(--f-friendly); color: #334155; text-transform: capitalize; letter-spacing: -.01em; }
.tl-head small { font-size: 11.5px; font-weight: 600; color: #5A6D87; }
.tl-col.y .tl-head b, .tl-col.y .tl-head small { color: #1E3A8A; }
.tl-col.now { background: linear-gradient(180deg, #EEF2FF, transparent 70%); border-radius: 10px 10px 0 0; }
.tl-dots { gap: 6px; padding-top: 4px; }
.tl-dot { width: 14px; height: 14px; }
.tl-n { font-size: 13px; color: #1E3A8A; }
.tl-legend { gap: 8px 18px; font-size: 12.5px; line-height: 1.6; padding-top: 4px; }

/* ================================================================== */
/* Landing page commerciale + panneau latéral de connexion              */
/* ================================================================== */
html { scroll-behavior: smooth; }
#gate { background: #FDF3E7; }
.lp-wrap { width: min(1180px, 100%); margin: 0 auto; }

/* Barre de navigation */
.lp-nav { position: sticky; top: 0; z-index: 30; display: flex; align-items: center; gap: 24px; padding: 14px clamp(16px, 4vw, 56px);
  background: rgba(253, 243, 231, .86); backdrop-filter: saturate(1.3) blur(12px); border-bottom: 1px solid rgba(194, 94, 56, .12); }
.lp-logo { display: inline-flex; align-items: center; gap: 9px; color: #0F172A; text-decoration: none; }
.lp-logo .logo-mark { width: 30px; height: 30px; color: #0F172A; --gold-bright: #E07B5F; }
.lp-logo span { font: 800 22px/1 "Plus Jakarta Sans", Inter, sans-serif; letter-spacing: -.04em; }
.lp-logo.small .logo-mark { width: 22px; height: 22px; }
.lp-logo.small span { font-size: 16px; }
.lp-links { display: flex; gap: 4px; margin-left: 12px; }
.lp-links a { color: #475569; text-decoration: none; font-weight: 600; font-size: 14px; padding: 8px 12px; border-radius: 10px; transition: background .2s, color .2s; }
.lp-links a:hover { background: rgba(255, 255, 255, .7); color: #0F172A; }
.lp-nav-cta { margin-left: auto; display: flex; gap: 8px; }

/* Hero : micro-interactions */
.gate-hero .tag-tous { display: inline-flex; align-items: center; gap: 10px; }
.tag-dot { width: 8px; height: 8px; border-radius: 50%; background: #E07B5F; box-shadow: 0 0 0 0 rgba(224, 123, 95, .55); animation: ping 2.2s ease-out infinite; }
@keyframes ping { 70% { box-shadow: 0 0 0 9px rgba(224, 123, 95, 0); } 100% { box-shadow: 0 0 0 0 rgba(224, 123, 95, 0); } }
.gate-hero .hello, .gate-hero .gate-pitch { animation: fondu .8s cubic-bezier(.2, .8, .2, 1) both; }
.gate-hero .gate-pitch { animation-delay: .12s; }
@keyframes fondu { from { opacity: 0; transform: translateY(14px); } }
.hero-note { font-size: 13px !important; color: #8A6A55 !important; }
.btn { transition: background .2s, border-color .2s, box-shadow .25s, transform .2s, color .2s; }
.btn-sun:hover, .btn-ghost:hover { transform: translateY(-2px); }
.gate-hero .pastel-proof li { transition: transform .25s cubic-bezier(.2, .8, .2, 1), box-shadow .25s; animation: fondu .7s cubic-bezier(.2, .8, .2, 1) both; }
.gate-hero .pastel-proof li:nth-child(2) { animation-delay: .08s; } .gate-hero .pastel-proof li:nth-child(3) { animation-delay: .16s; } .gate-hero .pastel-proof li:nth-child(4) { animation-delay: .24s; }
.gate-hero .pastel-proof li:hover { transform: translateY(-6px); box-shadow: 0 22px 40px -24px rgba(120, 72, 30, .55); }
.gate-hero .pastel-proof li:hover .pp-ico { transform: scale(1.08) rotate(-4deg); }
.pastel-proof .pp-ico { transition: transform .3s cubic-bezier(.2, .8, .2, 1.4); }

/* Apparition au défilement : seulement une fois le script de l'accueil prêt (sans lui, tout reste visible) */
.anim-pret .reveal { opacity: 0; transform: translateY(22px); transition: opacity .7s ease, transform .7s cubic-bezier(.2, .8, .2, 1); transition-delay: var(--d, 0ms); }
.anim-pret .reveal.in { opacity: 1; transform: none; }

/* Pourquoi Cibly */
.lp-why { padding: 84px clamp(16px, 4vw, 56px); background: #fff; }
.lp-kicker { color: #C25E38; font: 700 13px/1 var(--f-body); letter-spacing: .18em; text-transform: uppercase; text-align: center; }
.lp-why h2, .lp-impact h2, .lp-cta h2 { font: 800 clamp(28px, 3.4vw, 44px)/1.08 "Plus Jakarta Sans", Inter, sans-serif; letter-spacing: -.04em; color: #0F172A; text-align: center; margin: 12px auto 0; max-width: 22ch; }
.why-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; margin-top: 44px; }
.why-card { position: relative; display: grid; gap: 12px; align-content: start; padding: 28px; border-radius: 22px; background: #FDF8F2; border: 1px solid #F3E2CB; overflow: hidden;
  transition: transform .3s cubic-bezier(.2, .8, .2, 1), box-shadow .3s, border-color .3s; }
.why-card:hover { transform: translateY(-6px); box-shadow: 0 26px 50px -30px rgba(120, 72, 30, .5); border-color: #FBBF24; }
.why-ico { width: 54px; height: 54px; border-radius: 16px; display: grid; place-items: center; font-size: 26px; background: #fff; box-shadow: 0 8px 18px -12px rgba(120, 72, 30, .5); transition: transform .3s; }
.why-card:hover .why-ico { transform: rotate(-6deg) scale(1.06); }
.why-num { position: absolute; top: 18px; right: 22px; font: 800 44px/1 "Plus Jakarta Sans", sans-serif; letter-spacing: -.05em; color: rgba(194, 94, 56, .14); }
.why-card h3 { font: 800 21px/1.2 "Plus Jakarta Sans", sans-serif; letter-spacing: -.03em; color: #0F172A; }
.why-card p { font-size: 15px; line-height: 1.6; color: #4D4A47; }

/* Chiffres clés */
.lp-impact { padding: 72px clamp(16px, 4vw, 56px); background: linear-gradient(135deg, #0F172A 0%, #1E3A8A 100%); color: #fff; position: relative; overflow: hidden; }
.lp-impact::before { content: ""; position: absolute; inset: -40% -10% auto auto; width: 520px; height: 520px; border-radius: 50%; background: radial-gradient(circle, rgba(251, 191, 36, .22), transparent 65%); pointer-events: none; }
.lp-impact h2 { color: #fff; }
.impact-grid { position: relative; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; margin-top: 40px; }
.impact { display: grid; gap: 8px; justify-items: center; text-align: center; padding: 30px 20px; border-radius: 22px; background: rgba(255, 255, 255, .06); border: 1px solid rgba(255, 255, 255, .12); transition: transform .3s, background .3s; }
.impact:hover { transform: translateY(-4px); background: rgba(255, 255, 255, .1); }
.impact b { font: 800 clamp(40px, 5vw, 64px)/1 "Plus Jakarta Sans", sans-serif; letter-spacing: -.05em; color: #FBBF24; font-variant-numeric: tabular-nums; }
.impact span { font-size: 16px; color: #CBD5E1; }

/* Appel à l'action final */
.lp-cta { padding: 88px clamp(16px, 4vw, 56px); background: radial-gradient(120% 90% at 50% 0%, #FFF6EA 0%, #FDF3E7 60%, #FBE3C2 100%); text-align: center; }
.lp-cta .lp-wrap { display: grid; justify-items: center; gap: 16px; max-width: 760px; }
.lp-cta p { font-size: 17px; line-height: 1.6; color: #4D4A47; max-width: 46ch; }
.lp-foot { display: flex; flex-wrap: wrap; gap: 10px 22px; align-items: center; justify-content: center; padding: 26px 16px 34px; background: #FDF3E7; border-top: 1px solid #F3E2CB; color: #8A6A55; font-size: 13px; }

/* Panneau latéral */
.acces-scrim { position: fixed; inset: 0; z-index: 60; background: rgba(15, 23, 42, .38); backdrop-filter: blur(3px); opacity: 0; transition: opacity .3s ease; }
.acces-scrim.open { opacity: 1; }
.gate-panel.acces-drawer#acces {
  position: fixed; top: 0; right: 0; bottom: 0; z-index: 61; width: min(540px, 100%); max-height: none; display: block; overflow-y: auto; overscroll-behavior: contain;
  padding: 64px clamp(20px, 3vw, 40px) 40px; background: #fff; box-shadow: -30px 0 80px -30px rgba(15, 23, 42, .45);
  transform: translateX(104%); transition: transform .38s cubic-bezier(.2, .8, .2, 1), width .3s ease; visibility: hidden;
}
.gate-panel.acces-drawer#acces.open { transform: none; visibility: visible; }
.gate-panel.acces-drawer#acces.wide { width: min(720px, 100%); }
.acces-drawer > .gate-step { max-width: none !important; width: 100%; margin: 0 !important; }
.acces-drawer .gate-head { text-align: left !important; justify-items: start !important; }
.acces-drawer .gate-tabs, .acces-drawer .gate-head .link-btn { justify-self: start !important; }
.acces-drawer .gate-alt { text-align: left !important; }
.acces-drawer .wz-steps { justify-content: flex-start !important; }
.acces-close { position: absolute; top: 16px; right: 16px; width: 40px; height: 40px; border-radius: 12px; font-size: 16px; }
.acces-close:hover { transform: rotate(90deg); transition: transform .25s; }
body.acces-ouvert { overflow: hidden; }
#lg-btn { background: #FBBF24; border-color: #F59E0B; color: #1E293B; border-radius: 10px; }
#lg-btn:hover { background: #F59E0B; }

@media (max-width: 900px) {
  .lp-links { display: none; }
  .why-grid, .impact-grid { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 520px) { .lp-nav-cta .btn-ghost { display: none; } }
@media (prefers-reduced-motion: reduce) {
  .anim-pret .reveal { opacity: 1; transform: none; transition: none; }
  .tag-dot, .gate-hero .hello, .gate-hero .gate-pitch, .gate-hero .pastel-proof li { animation: none; }
  .gate-panel.acces-drawer#acces { transition: none; }
}

/* ================================================================== */
/* Vitrine enrichie                                                     */
/* ================================================================== */
.lp-sec { padding: 88px clamp(16px, 4vw, 56px); }
.lp-lead { text-align: center; color: #5B5650; font-size: 17px; line-height: 1.6; max-width: 52ch; margin: 14px auto 0; }
.lp-sec h2 { font: 800 clamp(28px, 3.4vw, 44px)/1.08 "Plus Jakarta Sans", Inter, sans-serif; letter-spacing: -.04em; color: #0F172A; text-align: center; margin: 12px auto 0; max-width: 24ch; }
.anim-pret .reveal { transform: translateY(22px) scale(.98); }
.anim-pret .reveal.in { transform: none; }

/* Cartes chiffrées du hero, effet 3D */
.hero-stats { perspective: 900px; }
.hero-stats li.tilt { transform: perspective(900px) rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg)); transition: transform .2s ease-out, box-shadow .3s; will-change: transform; }
.hero-stats li.tilt:hover { box-shadow: 0 28px 50px -26px rgba(120, 72, 30, .55); transform: perspective(900px) rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg)) translateY(-6px); }
.hero-stats strong { display: block; font: 800 34px/1 "Plus Jakarta Sans", sans-serif; letter-spacing: -.05em; color: #C25E38; margin-bottom: 4px; }
.hero-stats li div b { font: 700 15px/1.3 "Plus Jakarta Sans", sans-serif; color: #0F172A; }

/* Comparatif */
.lp-compare { background: #fff; }
.cmp { margin: 44px auto 0; max-width: 1040px; border-radius: 22px; overflow: hidden; border: 1px solid #F0E1CC; box-shadow: 0 24px 60px -40px rgba(120, 72, 30, .5); }
.cmp-row { display: grid; grid-template-columns: minmax(150px, .8fr) minmax(0, 1fr) minmax(0, 1.2fr); }
.cmp-row > * { padding: 18px 20px; font-size: 14.5px; line-height: 1.5; display: flex; gap: 10px; align-items: flex-start; border-top: 1px solid #F5EADB; }
.cmp-h > * { border-top: 0; font: 800 15px "Plus Jakarta Sans", sans-serif; letter-spacing: -.02em; align-items: center; }
.cmp-row b { font: 700 14.5px "Plus Jakarta Sans", sans-serif; color: #0F172A; background: #FDF8F2; }
.cmp-row > span:nth-child(2) { color: #6B6560; background: #FCFAF7; }
.cmp-us { background: #FFF8E6 !important; color: #2D2A26; }
.cmp-h .cmp-us { background: #FBBF24 !important; color: #1E293B; }
.cmp i { font-style: normal; flex: none; width: 22px; height: 22px; border-radius: 50%; display: grid; place-items: center; font-size: 12px; font-weight: 800; }
.cmp i.no { background: #F1E7DC; color: #A08E7B; }
.cmp i.yes { background: #1E3A8A; color: #fff; }
.cmp-row:not(.cmp-h) { transition: background .2s; }
.cmp-row:not(.cmp-h):hover > * { background-color: #FFF3D6; }

/* Secteurs */
.lp-secteurs { background: #FDF3E7; }
.sect-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 16px; margin-top: 44px; }
.sect-card { position: relative; display: grid; gap: 10px; align-content: start; text-align: left; padding: 24px 20px 20px; min-height: 230px; border-radius: 22px; border: 1px solid #F0E1CC; background: #fff; overflow: hidden; cursor: pointer;
  transition: transform .3s cubic-bezier(.2, .8, .2, 1), box-shadow .3s, border-color .3s; }
.sect-card::before { content: ""; position: absolute; inset: auto -30% -55% auto; width: 180px; height: 180px; border-radius: 50%; background: var(--c); opacity: .14; transition: transform .45s cubic-bezier(.2, .8, .2, 1), opacity .3s; }
.sect-card:hover { transform: translateY(-8px) scale(1.02); box-shadow: 0 30px 50px -30px rgba(120, 72, 30, .5); border-color: var(--c); }
.sect-card:hover::before { transform: scale(1.6); opacity: .22; }
.sc-ico { width: 52px; height: 52px; border-radius: 16px; display: grid; place-items: center; font-size: 26px; background: color-mix(in srgb, var(--c) 18%, white); }
.sect-card b { font: 800 18px/1.2 "Plus Jakarta Sans", sans-serif; letter-spacing: -.03em; color: #0F172A; }
.sc-ex { font-size: 13px; line-height: 1.5; color: #5B5650; }
.sc-go { margin-top: auto; font-size: 13px; font-weight: 700; color: #1E3A8A; opacity: 0; transform: translateY(6px); transition: opacity .25s, transform .25s; }
.sect-card:hover .sc-go, .sect-card:focus-visible .sc-go { opacity: 1; transform: none; }

/* Fonctionnalités */
.lp-features { background: #fff; }
.feat-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; margin-top: 44px; }
.feat { display: grid; gap: 12px; align-content: start; padding: 22px; border-radius: 22px; background: #FDF8F2; border: 1px solid #F3E2CB; transition: transform .3s cubic-bezier(.2, .8, .2, 1), box-shadow .3s; }
.feat:hover { transform: translateY(-6px) scale(1.01); box-shadow: 0 26px 50px -32px rgba(120, 72, 30, .5); }
.feat h3 { font: 800 20px/1.2 "Plus Jakarta Sans", sans-serif; letter-spacing: -.03em; color: #0F172A; }
.feat p { font-size: 14.5px; line-height: 1.6; color: #4D4A47; }
.feat-visu { position: relative; height: 150px; border-radius: 16px; background: #fff; border: 1px solid #F0E1CC; overflow: hidden; }
.dce .doc { position: absolute; left: 22px; top: 22px; width: 74px; height: 98px; border-radius: 8px; background: #EEF2FF; box-shadow: inset 0 0 0 1px #C7D2FE; }
.dce .doc.d2 { left: 34px; top: 30px; background: #fff; }
.dce .doc.d2::after { content: ""; position: absolute; inset: 16px 12px auto; height: 50px; background: repeating-linear-gradient(#E2E8F0 0 3px, transparent 3px 10px); }
.dce .scan-line { position: absolute; left: 30px; width: 82px; height: 3px; border-radius: 2px; background: #FBBF24; box-shadow: 0 0 12px #FBBF24; animation: scanner 2.6s ease-in-out infinite; }
@keyframes scanner { 0%, 100% { top: 34px; } 50% { top: 118px; } }
.dce ul { position: absolute; right: 16px; top: 20px; list-style: none; margin: 0; padding: 0; display: grid; gap: 7px; }
.dce li { font-size: 11.5px; font-weight: 700; color: #1E3A8A; background: #EEF2FF; border-radius: 999px; padding: 4px 10px; animation: apparait 3.2s ease-in-out infinite both; }
.dce li:nth-child(2) { animation-delay: .3s; } .dce li:nth-child(3) { animation-delay: .6s; } .dce li:nth-child(4) { animation-delay: .9s; }
@keyframes apparait { 0%, 15% { opacity: 0; transform: translateX(10px); } 30%, 85% { opacity: 1; transform: none; } 100% { opacity: 0; } }
.memo { padding: 20px 22px; display: grid; gap: 9px; align-content: start; }
.memo .ln { height: 8px; border-radius: 4px; background: #EDE6DA; transform-origin: left; animation: ecrit 3.4s ease-in-out infinite both; }
.memo .ln.hl { background: #FBBF24; }
.memo .w90 { width: 90%; } .memo .w70 { width: 70%; animation-delay: .25s; } .memo .w80 { width: 80%; animation-delay: .5s; } .memo .w50 { width: 50%; animation-delay: .75s; } .memo .w75 { width: 75%; animation-delay: 1s; } .memo .w60 { width: 60%; animation-delay: 1.25s; }
@keyframes ecrit { 0% { transform: scaleX(0); } 30%, 90% { transform: scaleX(1); } 100% { transform: scaleX(1); opacity: .4; } }
.relances { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); align-items: center; padding: 0 14px; }
.relances::before { content: ""; position: absolute; left: 28px; right: 28px; top: 50%; height: 3px; background: linear-gradient(90deg, #1E3A8A, #FBBF24); border-radius: 2px; }
.relances .step { position: relative; display: grid; justify-items: center; gap: 4px; font-size: 11px; color: #5B5650; font-weight: 600; }
.relances .step b { width: 46px; height: 46px; border-radius: 50%; display: grid; place-items: center; background: #fff; border: 3px solid #1E3A8A; font: 800 13px "Plus Jakarta Sans", sans-serif; color: #1E3A8A; animation: pop-step 3s ease-in-out infinite both; }
.relances .s1 b { animation-delay: .3s; } .relances .s2 b { animation-delay: .6s; } .relances .s3 b { animation-delay: .9s; border-color: #FBBF24; }
@keyframes pop-step { 0%, 100% { transform: scale(1); } 15% { transform: scale(1.14); background: #FEF3C7; } 30% { transform: scale(1); } }

/* Réassurance */
.lp-trust { background: #FDF3E7; }
.trust-badges { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin: 34px auto 0; max-width: 900px; }
.trust-badges span { font: 700 14px "Plus Jakarta Sans", sans-serif; letter-spacing: -.01em; color: #1E293B; background: #fff; border: 1px solid #F0E1CC; border-radius: 999px; padding: 10px 18px; box-shadow: 0 6px 16px -14px rgba(120, 72, 30, .6); transition: transform .2s, border-color .2s; }
.trust-badges span:hover { transform: translateY(-3px); border-color: #FBBF24; }
.trust-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; margin-top: 34px; }
.trust { display: grid; gap: 8px; padding: 24px; border-radius: 20px; background: #fff; border: 1px solid #F0E1CC; transition: transform .3s, box-shadow .3s; }
.trust:hover { transform: translateY(-5px); box-shadow: 0 22px 44px -30px rgba(120, 72, 30, .5); }
.trust > span { font-size: 26px; }
.trust b { font: 800 18px "Plus Jakarta Sans", sans-serif; letter-spacing: -.03em; color: #0F172A; }
.trust p { font-size: 14px; line-height: 1.55; color: #4D4A47; }
.temoignages { margin-top: 44px; }
.tm-titre { font: 800 24px "Plus Jakarta Sans", sans-serif; letter-spacing: -.04em; text-align: center; color: #0F172A; margin-bottom: 20px; }
.tm-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 18px; }
.tm { margin: 0; display: grid; gap: 16px; padding: 24px; border-radius: 20px; background: #fff; border: 1px solid #F0E1CC; }
.tm blockquote { margin: 0; font-size: 15.5px; line-height: 1.6; color: #2D2A26; }
.tm figcaption { display: flex; align-items: center; gap: 12px; }
.tm-av { width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; background: #1E3A8A; color: #fff; font: 800 13px "Plus Jakarta Sans", sans-serif; }
.tm figcaption b { display: block; font-size: 14px; color: #0F172A; }
.tm figcaption small { font-size: 12.5px; color: #6B6560; }
.tm figcaption em { margin-left: auto; font-style: normal; font-size: 11.5px; font-weight: 700; color: #C25E38; background: #FDF0E6; border-radius: 999px; padding: 3px 9px; }

/* Appel final */
.lp-cta h2 { font-size: clamp(32px, 4vw, 54px); }
.btn-pulse { animation: pulse-cta 2.4s ease-in-out infinite; }
@keyframes pulse-cta { 0%, 100% { box-shadow: 0 10px 22px -12px rgba(245, 158, 11, .85); } 50% { box-shadow: 0 0 0 10px rgba(251, 191, 36, .18), 0 10px 22px -12px rgba(245, 158, 11, .85); } }
.lp-impact { display: none; }

@media (max-width: 1100px) { .sect-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 900px) {
  .feat-grid, .trust-grid { grid-template-columns: minmax(0, 1fr); }
  .sect-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cmp-row { grid-template-columns: minmax(0, 1fr); }
  .cmp-h { display: none; }
  .cmp-row > span:nth-child(2)::before { content: "Veille classique · "; font-weight: 700; }
  .cmp-row > span.cmp-us::before { content: "Cibly · "; font-weight: 800; color: #1E3A8A; }
  .sc-go { opacity: 1; transform: none; }
}
@media (max-width: 560px) { .sect-grid { grid-template-columns: minmax(0, 1fr); } }
@media (prefers-reduced-motion: reduce) {
  .dce .scan-line, .dce li, .memo .ln, .relances .step b, .btn-pulse { animation: none; }
  .hero-stats li.tilt { transform: none; }
}

/* ================================================================== */
/* Portail client aux couleurs de la landing : pêche, jaune, terre cuite, teal */
/* ================================================================== */
:root {
  --ink: #1E293B; --navy: #1E293B; --navy-2: #334155; --slate: #4A4642; --muted: #7A736B;
  --line: #F3E8DC; --line-strong: #E8D6C2; --cream: #FDF3E7; --pearl: #FDF3E7; --mist: #F8EEE2;
  --terre: #C25E38; --terre-dark: #9A4323; --teal-doux: #319795; --bleu-doux: #2B6CB0;
  --royal: #319795; --royal-dark: #26787A; --royal-soft: #E6F6F5; --royal-mid: #B2E0DD;
  --sun: #FBBF24; --sun-dark: #F59E0B; --sun-soft: #FEF3C7;
}
body .shell, .shell .main { background: #FDF3E7; color: #1E293B; }
.app-top { background: rgba(253, 243, 231, .9); border-bottom-color: #F3E8DC; }
.at-ent { color: #1E293B; }

/* Titres : terre cuite pour les grands titres, anthracite pour les autres */
.shell .view-head h2, #home-hello { color: #C25E38; }
.shell h3, .shell h4, .shell .cal-head h3, .shell .sync h3, .shell .hs-head h3, .shell .block-head h3, .shell .top10-head h3, .shell .or-head h3 { color: #1E293B; }
.shell .eyebrow, .shell .eyebrow-gold, #home-date { color: #9A4323; }

/* Cartes */
.card, .hm, .home-top, .home-feed, .kpi, .ov-stat, .tk, .opp-card, .integ, .dossier, .ws-tile, .or-row, .hb-row:hover, .cal-grid {
  background: #fff; border: 1px solid #F3E8DC; border-radius: 16px; box-shadow: 0 10px 28px -24px rgba(120, 72, 30, .45); }
.cal-grid { box-shadow: none; }
.cal-day, .cal-dh { border-color: #F6EDE2; }
.cal-day.we { background: #FFFAF4; }

/* Boutons : jaune chaleureux, texte sombre */
.shell .btn-navy, .shell .btn-royal, .shell .btn-gold, .shell .btn-sun { background: #FBBF24; border-color: #F59E0B; color: #1E293B; box-shadow: 0 10px 22px -14px rgba(245, 158, 11, .85); }
.shell .btn-navy:hover, .shell .btn-royal:hover, .shell .btn-gold:hover, .shell .btn-sun:hover { background: #F59E0B; border-color: #F59E0B; color: #1E293B; }
.shell .btn-gold .btn-icon { color: #1E293B; --gold-bright: #1E293B; }
.shell .btn-ghost { background: #fff; border-color: #E8D6C2; color: #1E293B; }
.shell .btn-ghost:hover { border-color: #C25E38; color: #9A4323; }
.shell .link-btn, .shell a { color: #26787A; }
.shell .chip-btn.active { background: #1E293B; border-color: #1E293B; color: #fff; }
.shell input:checked + .switch { background: #319795; }
.shell input:focus, .shell textarea:focus, .shell select:focus { border-color: #F59E0B; box-shadow: 0 0 0 3px rgba(251, 191, 36, .22); }

/* Barre latérale */
.sidebar { background: #FFFBF6; border-right-color: #F3E8DC; }
.sidebar .logo-mark { --gold-bright: #E07B5F; }
.sb-tenant { background: #FDF3E7; border-color: #F3E8DC; }
.sb-tenant:hover { border-color: #FBBF24; background: #FCEBD6; }
.sb-tenant .tenant-mono, .tenant-mono, .hd-head .tenant-mono { background: #C25E38; color: #fff; }
.sb-nav a:hover { background: #FDF3E7; }
.sb-nav a[aria-current="page"] { background: #FEF3C7; color: #1E293B; }
.sb-nav a[aria-current="page"]::before { background: #F59E0B; }
.sb-nav a[aria-current="page"] svg { color: #C25E38; }
.sb-nav .nav-count { background: #E6F6F5; color: #26787A; }
.sb-nav .nav-count.due { background: #FBBF24; color: #1E293B; }
.sb-foot { border-top-color: #F3E8DC; }

/* Accents et badges : teal doux */
.hm.hot, .ov-stat.hi, .crm-kpis .kpi.due, .hd-stats button.hot { background: #FEF3C7; border-color: #FBD786; }
.hm.hot > span, .hm.hot small, .ov-stat.hi span, .crm-kpis .kpi.due > span, .crm-kpis .kpi.due small { color: #9A4323; }
.hm.hot b, .ov-stat.hi b, .crm-kpis .kpi.due b, .hd-stats button.hot b { color: #1E293B; }
.hm:hover { border-color: #FBD786; }
.home-list .rang { color: #C25E38; }
.score-badge.fort, .oc-verdict.fort b, .or-score.fort { background: #319795; color: #fff; }
.score-badge.moyen, .or-score.moyen { background: #E6F6F5; color: #26787A; box-shadow: none; }
.ring.fort .val { stroke: #319795; } .ring.moyen .val { stroke: #FBBF24; }
.hb-val.fort { color: #26787A; } .hb-val.moyen { color: #9A4323; }
.hb-rank { background: #FDF3E7; color: #C25E38; }
.hb-row:nth-child(2) .hb-rank { background: #C25E38; color: #fff; }
.hb-track { background: #F8EEE2; }
.opp-card.fort { border-left-color: #319795; } .opp-card.moyen { border-left-color: #FBBF24; }
.or-main em { color: #26787A; }
.or-add { color: #9A4323; } .or-add:hover { background: #FBBF24; border-color: #F59E0B; color: #1E293B; }
.ob-count.on { background: #FBBF24; color: #1E293B; }
.tabs button[aria-selected="true"] { border-bottom-color: #F59E0B; }
.segmented { background: #F8EEE2; }
.sync .ws-etat.on, .ws-etat.on { background: #E6F6F5; color: #26787A; }
.sync .ws-etat.off, .ws-etat.off { background: #FEF3C7; color: #9A4323; }
.ws-ico.mail { background: #E6F6F5; color: #319795; }
.ws-ico.agenda { background: #FEF3C7; color: #C25E38; }
.cal-day.today .cal-dh { background: #FEF3C7; color: #9A4323; }
.cal-day.today .cal-dh b { background: #C25E38; color: #fff; }
.cal-ev.relance { background: #E6F6F5; border-color: #319795; color: #22605F; }
.cal-legend .lg-relance i { background: #319795; }
.cal-ev.approche { background: #FEF6DD; border-color: #FBBF24; color: #7A5300; }
.cal-legend .lg-approche i { background: #FBBF24; }
.sync-choice, .sync-today { background: #FDF3E7; border-color: #F3E8DC; }
.dep-counts .bar i, .crit-track i, .pct i::after, .crit-mini i::after { background: linear-gradient(90deg, #319795, #63B3AE); }
.crit-track.mid i { background: linear-gradient(90deg, #FBBF24, #FCD579); }
#france .dep { fill: #F6EADB; }
#france .dep.zone { fill: #E6F6F5; stroke: #B2E0DD; }
#france .dep.scanned { fill: #DDEFEE; }
#france .dep.hit { fill: #A6D9D5; } #france .dep.hit.h2 { fill: #5FB3AE; } #france .dep.hit.h3 { fill: #319795; }
#france .dep.hit:hover, #france .dep.selected { fill: #C25E38; }
#france .bubble circle.core { fill: #1E293B; stroke: #FBBF24; }
#france .bubble circle.halo { fill: rgba(49, 151, 149, .16); }
.lg-hit { background: #319795; }
.map-wrap { background: radial-gradient(circle at 50% 45%, #fff 0%, #FDF3E7 75%); }
.col { background: #F8EEE2; } .col.drop { background: #E6F6F5; }
.quick-mail { background: #E6F6F5; border-color: #B2E0DD; color: #26787A; }
.quick-mail:hover { background: #319795; border-color: #319795; color: #fff; }
.kpi.value { background: linear-gradient(135deg, #E6F6F5, #fff); }

/* Bloc de bienvenue avec mascotte */
.welcome { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: 20px; padding: 26px 30px 0; margin-bottom: 22px; overflow: hidden;
  background: linear-gradient(120deg, #FFFFFF 0%, #FFF8EF 60%, #FDEBD3 100%); border: 1px solid #F3E8DC; border-radius: 20px; }
.welcome-txt { display: grid; gap: 8px; align-content: center; padding-bottom: 26px; }
.welcome-txt .head-actions { margin-top: 8px; }
#home-hello { font-size: clamp(32px, 3.6vw, 50px); }
.welcome-masc { width: min(270px, 34vw); align-self: end; margin-right: -6px; }
.mascotte { display: block; width: 100%; height: auto; }
.mascotte .salue { animation: salue 2.8s ease-in-out infinite; }
.mascotte .bulle { animation: flotte 4.5s ease-in-out infinite; }
#v-accueil > .view-head { display: none; }
@media (max-width: 720px) { .welcome { grid-template-columns: minmax(0, 1fr); padding: 22px 20px 0; } .welcome-masc { width: 200px; justify-self: end; } }
@media (prefers-reduced-motion: reduce) { .mascotte .salue, .mascotte .bulle { animation: none; } }
.shell .sb-nav a { color: #334155; }
.shell .sb-nav a[aria-current="page"] { color: #1E293B; }
.shell .sb-tenant, .shell .lp-logo { color: #1E293B; }

/* Mascottes de page : petite signature visuelle, jamais devant le contenu */
.shell .view-head { align-items: center; }
.masc-mini { flex: none; width: 112px; margin-left: auto; pointer-events: none; animation: masc-bob 5s ease-in-out infinite; }
.view-head .masc-mini + .head-actions, .view-head .head-actions + .masc-mini { margin-left: 16px; }
.masc-mini-svg { display: block; width: 100%; height: auto; filter: drop-shadow(0 10px 14px rgba(120, 72, 30, .14)); }
@keyframes masc-bob { 50% { transform: translateY(-4px); } }
.masc-mini .tourne { animation: tourne 6s linear infinite; transform-box: fill-box; transform-origin: center; }
.masc-mini .tourne.inverse { animation-direction: reverse; animation-duration: 4s; }
@keyframes tourne { to { transform: rotate(360deg); } }
.masc-mini .confettis rect { animation: confetti 2.4s ease-in-out infinite; transform-box: fill-box; transform-origin: center; }
.masc-mini .confettis rect:nth-child(2n) { animation-delay: -1.2s; }
@keyframes confetti { 50% { transform: translateY(-6px) rotate(25deg); } }
.am-tl-head { align-items: center; }
.masc-amont { width: 92px; margin: -14px 0 -18px auto; }
#v-taches .view-head { flex-wrap: nowrap; }
@media (max-width: 720px) { .masc-mini { width: 76px; } .masc-amont { width: 64px; } .shell .view-head { flex-direction: row; flex-wrap: wrap; } }
@media (prefers-reduced-motion: reduce) { .masc-mini, .masc-mini .tourne, .masc-mini .confettis rect { animation: none; } }

/* ---------- Connexion messagerie & agenda en un clic ---------- */
.oc-on, .oc-off { display: grid; gap: 12px; }
.oc-badge { display: inline-flex; align-items: center; gap: 8px; justify-self: start; padding: 5px 12px 5px 10px; border-radius: 999px; font-size: 12.5px; font-weight: 700; letter-spacing: -.01em; background: #E8F6EE; color: #1F7A4D; border: 1px solid #CDEBD9; }
.oc-badge i { width: 8px; height: 8px; border-radius: 50%; background: #22A06B; box-shadow: 0 0 0 3px rgba(34,160,107,.18); animation: oc-pulse 2.4s ease-in-out infinite; }
.oc-badge.off { background: #FBF4EA; color: #8A6A4F; border-color: #F3E8DC; }
.oc-badge.off i { background: #C9B49E; box-shadow: none; animation: none; }
@keyframes oc-pulse { 50% { box-shadow: 0 0 0 6px rgba(34,160,107,0); } }
.oc-btns { display: grid; gap: 10px; }
.oc-btn { display: flex; align-items: center; gap: 12px; width: 100%; padding: 12px 16px; border-radius: 10px; border: 1px solid #EADBC8; background: #fff; color: #1E293B; font: 600 14px/1.2 Inter, system-ui, sans-serif; cursor: pointer; text-align: left; transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease; }
.oc-btn:hover { border-color: #FBBF24; box-shadow: 0 6px 16px -8px rgba(194,94,56,.35); transform: translateY(-1px); }
.oc-btn:focus-visible { outline: 2px solid #319795; outline-offset: 2px; }
.oc-btn[aria-disabled="true"] { opacity: .55; cursor: not-allowed; transform: none; box-shadow: none; }
.oc-btn.loading { opacity: .75; pointer-events: none; }
.oc-logo { display: inline-grid; place-items: center; width: 22px; height: 22px; flex: none; }
.oc-logo svg { width: 20px; height: 20px; }
.oc-reassure { display: flex; align-items: flex-start; gap: 8px; margin: 0; font-size: 12.5px; line-height: 1.5; color: #2C6E6A; }
.oc-reassure svg { width: 16px; height: 16px; flex: none; margin-top: 1px; color: #319795; }
.oc-note { margin: 0; padding: 10px 12px; border-radius: 10px; background: #FDF3E7; color: #7A5B43; line-height: 1.5; }
.oc-acct { display: flex; align-items: center; gap: 10px; margin: 0; min-width: 0; }
.oc-acct > span:last-child { display: grid; min-width: 0; }
.oc-acct b { overflow-wrap: anywhere; }
.oc-acct small { color: #64748B; }
.oc-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; }
.integ-oc .oc-btns { grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }
@media (prefers-reduced-motion: reduce) { .oc-badge i { animation: none; } .oc-btn { transition: none; } }
@media (min-width: 1181px) { .integ-grid .integ-oc { grid-column: span 2; } }

/* ---------- Configuration : profil express ---------- */
.px { padding: 22px 24px; display: grid; gap: 16px; margin-bottom: 18px; background: #fff; border: 1px solid #F3E8DC; border-radius: 16px; }
.px-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; }
.px-head > div:first-child { min-width: 0; }
.px-kicker { margin: 0 0 2px; font-size: 11.5px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: #319795; }
.px-head h3 { margin: 0 0 4px; color: #C25E38; font-weight: 800; letter-spacing: -.03em; text-wrap: balance; }
.px-masc { position: relative; flex: none; width: 128px; margin-top: -8px; animation: masc-bob 5s ease-in-out infinite; pointer-events: none; }
.px-masc svg { display: block; width: 100%; height: auto; filter: drop-shadow(0 10px 14px rgba(120, 72, 30, .14)); }
.px-masc .tourne { animation: tourne 6s linear infinite; transform-box: fill-box; transform-origin: center; }
.px-masc .tourne.inverse { animation-direction: reverse; animation-duration: 4s; }
.px-bulle { position: absolute; right: 100%; top: 14px; margin-right: 4px; white-space: nowrap; padding: 6px 11px; border-radius: 12px 12px 2px 12px; background: #FDF3E7; border: 1px solid #F3E8DC; color: #7A4A2E; font: 600 12px/1.2 Fredoka, Inter, system-ui, sans-serif; }
.px-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 18px; }
.px-f { display: grid; gap: 6px; align-content: start; min-width: 0; }
.px-wide { grid-column: 1 / -1; }
.px-l { font-size: 12.5px; font-weight: 700; color: #334155; }
.px-f input[type=text], .px-f select { width: 100%; padding: 10px 12px; border: 1px solid #EADBC8; border-radius: 10px; background: #FFFCF8; font: 500 14px Inter, system-ui, sans-serif; color: #1E293B; }
.px-f input:focus, .px-f select:focus { outline: 2px solid #FBBF24; outline-offset: 0; border-color: #FBBF24; background: #fff; }
.px-box { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; padding: 6px; border: 1px solid #EADBC8; border-radius: 10px; background: #FFFCF8; min-width: 0; }
.px-box > span { display: contents; }
.px-box:focus-within { border-color: #FBBF24; box-shadow: 0 0 0 2px rgba(251, 191, 36, .35); background: #fff; }
.px-f .px-box input { flex: 1 1 160px; min-width: 120px; border: 0; padding: 6px; background: transparent; outline: none; }
.px-box .badge-tag { background: #FEF3C7; border-color: #FDE68A; color: #7A4A2E; }
.px-kw { display: grid; gap: 8px; }
.px-kwrow { display: grid; grid-template-columns: 170px minmax(0, 1fr); gap: 10px; align-items: center; }
.px-axe { display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 600; color: #1E293B; min-width: 0; overflow-wrap: anywhere; }
.px-axe::before { content: ""; flex: none; width: 10px; height: 10px; border-radius: 50%; background: var(--ax, #319795); }
.px-foot { grid-column: 1 / -1; display: flex; align-items: center; justify-content: flex-end; gap: 14px; padding-top: 4px; border-top: 1px dashed #F3E8DC; }
.px-foot .btn { min-width: 150px; }
#v-entreprise .view-head .step-sub { max-width: 62ch; }
@media (max-width: 720px) {
  .px { padding: 18px 16px; }
  .px-grid { grid-template-columns: minmax(0, 1fr); }
  .px-kwrow { grid-template-columns: minmax(0, 1fr); gap: 4px; }
  .px-masc { width: 88px; } .px-bulle { display: none; }
}
@media (prefers-reduced-motion: reduce) { .px-masc, .px-masc .tourne { animation: none; } }

/* ---------- Cibly Pro : en-tête clair, cartes de réglages, mascotte ---------- */
body.pro { background: #FDF3E7; }
body.pro .pro-top { background: rgba(253, 243, 231, .92); backdrop-filter: blur(8px); color: #1E293B; border-bottom: 1px solid #F3E8DC; }
body.pro .pro-top .logo-word { color: #1E293B; }
body.pro .pro-top .logo-mark { color: #319795; }
body.pro .pro-badge { background: #C25E38; color: #fff; }
body.pro .pro-nav a { color: #475569; font-weight: 600; }
body.pro .pro-nav a:hover { background: #FBEBD7; color: #C25E38; }
body.pro .pro-who { color: #64748B; }
body.pro .pro-who #pro-who { color: #1E293B; font-weight: 600; }
body.pro .view-head h2 { color: #C25E38; }
body.pro .card { background: #fff; border: 1px solid #F3E8DC; border-radius: 16px; }
body.pro .btn-sun { background: #FBBF24; border-color: #F59E0B; color: #1E293B; }
body.pro .btn-sun:hover { background: #F59E0B; }

.pro-settings { gap: 20px; }
.ps-card { padding: 22px 24px; display: grid; gap: 14px; align-content: start; transition: border-color .2s ease; }
.ps-card.is-ok { border-color: #CDEBD9 !important; }
.ps-head { display: flex; align-items: flex-start; gap: 12px; flex-wrap: wrap; }
.ps-head > div { flex: 1 1 180px; min-width: 0; }
.ps-head h3 { margin: 0; font-size: 16.5px; font-weight: 800; letter-spacing: -.02em; color: #1E293B; }
.ps-head p { margin: 2px 0 0; font-size: 13px; color: #64748B; }
.ps-ico { flex: none; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 12px; background: #FDF3E7; color: #C25E38; }
.ps-ico svg { width: 20px; height: 20px; }
.ps-ico.claude { background: #E6F4F3; color: #319795; }
.ps-badge { display: inline-flex; align-items: center; gap: 7px; padding: 5px 11px 5px 9px; border-radius: 999px; font-size: 12px; font-weight: 700; white-space: nowrap; }
.ps-badge i { width: 8px; height: 8px; border-radius: 50%; background: currentColor; }
.ps-badge.ok { background: #E8F6EE; color: #1F7A4D; border: 1px solid #CDEBD9; }
.ps-badge.ok i { background: #22A06B; box-shadow: 0 0 0 3px rgba(34,160,107,.18); }
.ps-badge.todo { background: #FEF3C7; color: #92590A; border: 1px solid #FDE68A; }
.ps-badge.local { background: #E6F4F3; color: #23706E; border: 1px solid #C6E6E3; }
.ps-desc { margin: 0; font-size: 13.5px; line-height: 1.55; color: #475569; max-width: 62ch; }
.ps-aide { border-radius: 10px; background: #FFFAF3; border: 1px dashed #EADBC8; padding: 10px 12px; font-size: 13px; color: #475569; }
.ps-aide summary { cursor: pointer; font-weight: 600; color: #C25E38; }
.ps-aide p { margin: 8px 0 6px; }
.ps-aide .redir { display: block; overflow-wrap: anywhere; padding: 6px 8px; border-radius: 6px; background: #fff; border: 1px solid #F3E8DC; font-size: 12px; }
.ps-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.ps-fields.one { grid-template-columns: minmax(0, 1fr); }
.ps-fields label { display: grid; gap: 5px; min-width: 0; }
.ps-fields label span { font-size: 12.5px; font-weight: 700; color: #334155; }
.ps-fields input { width: 100%; padding: 10px 12px; border: 1px solid #EADBC8; border-radius: 10px; background: #FFFCF8; font: 500 14px Inter, system-ui, sans-serif; color: #1E293B; }
.ps-fields input:focus { outline: 2px solid #FBBF24; outline-offset: 0; border-color: #FBBF24; background: #fff; }
.ps-foot { display: flex; justify-content: flex-end; align-items: center; gap: 14px; padding-top: 12px; border-top: 1px dashed #F3E8DC; }
.ps-foot .btn { min-width: 130px; }

.pro-head-r { display: flex; align-items: flex-end; gap: 16px; margin-left: auto; }
.pro-masc { position: relative; flex: none; width: 104px; pointer-events: none; animation: masc-bob 5s ease-in-out infinite; }
.pro-masc svg { display: block; width: 100%; height: auto; filter: drop-shadow(0 10px 14px rgba(120, 72, 30, .16)); }
.pro-masc .tourne { animation: tourne 6s linear infinite; transform-box: fill-box; transform-origin: center; }
.pro-masc .tourne.inverse { animation-direction: reverse; animation-duration: 4s; }
.pro-masc-bulle { position: absolute; right: 92%; top: 4px; white-space: nowrap; padding: 6px 10px; border-radius: 12px 12px 2px 12px; background: #fff; border: 1px solid #F3E8DC; color: #7A4A2E; font: 600 12px/1.2 Fredoka, Inter, system-ui, sans-serif; }
body.pro .pro-sec .view-head { align-items: flex-end; }
.pro-settings { align-items: start; }
body.pro .b-scan, body.pro .lg-scan { background: #319795; }
@media (max-width: 720px) { .ps-fields { grid-template-columns: minmax(0, 1fr); } .pro-masc { width: 68px; } .pro-masc-bulle { display: none; } .ps-card { padding: 18px 16px; } }
@media (prefers-reduced-motion: reduce) { .pro-masc, .pro-masc .tourne { animation: none; } }

/* ---------- Mode simulation / démo ---------- */
.ps-badge.sim { background: #EDE9FE; color: #5B3DB5; border: 1px solid #DDD6FE; white-space: normal; }
.ps-badge.sim i { background: #7C5CDB; box-shadow: 0 0 0 3px rgba(124, 92, 219, .18); }
.ps-card.is-sim { border-color: #DDD6FE !important; }
.ps-ico.sim { background: #EDE9FE; color: #7C5CDB; }
.ps-sim { grid-column: 1 / -1; }
.ps-switch { display: inline-flex; align-items: center; gap: 10px; cursor: pointer; font-size: 13px; color: #334155; }
.ps-switch input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.ps-switch span { position: relative; width: 42px; height: 24px; border-radius: 999px; background: #E2D6C6; transition: background .2s ease; }
.ps-switch span::after { content: ""; position: absolute; top: 3px; left: 3px; width: 18px; height: 18px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,.2); transition: transform .2s ease; }
.ps-switch input:checked + span { background: #22A06B; }
.ps-switch input:checked + span::after { transform: translateX(18px); }
.ps-switch input:focus-visible + span { outline: 2px solid #FBBF24; outline-offset: 2px; }
.oc-badges { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.oc-demo { display: inline-flex; align-items: center; padding: 4px 10px; border-radius: 999px; font-size: 11.5px; font-weight: 700; letter-spacing: .02em; background: #EDE9FE; color: #5B3DB5; border: 1px solid #DDD6FE; }
.oc-boite { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.oc-boite li { display: grid; padding: 8px 10px; border-radius: 10px; background: #FFFAF3; border: 1px solid #F3E8DC; font-size: 13px; min-width: 0; }
.oc-boite b { overflow-wrap: anywhere; }
.oc-boite small { color: #64748B; }
.cp-demo { margin: 0 0 10px; padding: 10px 12px; border-radius: 10px; background: #EDE9FE; color: #4C2F9E; font-size: 13px; }
.ps-opt { margin-left: 6px; padding: 1px 7px; border-radius: 999px; background: #F3EEE6; color: #7A6A58; font-size: 11px; font-weight: 600; font-style: normal; }
.ps-partiel { padding: 8px 10px; border-radius: 10px; background: #FEF3C7; color: #92590A; }

/* ---------- Planning unifié : 4 catégories ---------- */
#home-cal { --c-email: #EF4444; --c-rdv: #3B82F6; --c-reunion: #10B981; --c-echeance: #C25E38; }
.cat-email { --c: var(--c-email, #EF4444); --bg: #FEF0F0; --tx: #B42323; }
.cat-rdv { --c: var(--c-rdv, #3B82F6); --bg: #EEF4FF; --tx: #1F5BC4; }
.cat-reunion { --c: var(--c-reunion, #10B981); --bg: #E8F8F1; --tx: #0B7A55; }
.cat-echeance { --c: var(--c-echeance, #C25E38); --bg: #FCEFE8; --tx: #9A4426; }
.cal-head-r { display: flex; align-items: center; gap: 12px; }
.cal-masc { display: block; width: 64px; margin: -14px 0 -10px; pointer-events: none; animation: masc-bob 5s ease-in-out infinite; }
.cal-masc svg { display: block; width: 100%; height: auto; filter: drop-shadow(0 8px 12px rgba(120, 72, 30, .14)); }
.cal-filtres { display: flex; flex-wrap: wrap; gap: 8px; }
.cal-filtres button { display: inline-flex; align-items: center; gap: 7px; padding: 6px 12px; border-radius: 999px; border: 1px solid #EADBC8; background: #fff; color: #475569; font: 600 12.5px Inter, system-ui, sans-serif; cursor: pointer; transition: background .15s, border-color .15s, opacity .15s; }
.cal-filtres button b { font-weight: 700; font-variant-numeric: tabular-nums; color: #5A6D87; }
.cal-filtres .cf i { width: 10px; height: 10px; border-radius: 50%; background: var(--c); }
.cal-filtres .cf[aria-pressed="true"] { background: var(--bg); border-color: var(--c); color: var(--tx); }
.cal-filtres .cf[aria-pressed="true"] b { color: var(--tx); }
.cal-filtres .cf[aria-pressed="false"] { opacity: .55; }
.cal-filtres .cf[aria-pressed="false"] i { background: transparent; box-shadow: inset 0 0 0 2px var(--c); }
.cal-filtres .cf-all[aria-pressed="true"] { background: #FEF3C7; border-color: #FBBF24; color: #1E293B; }
.cal-filtres button:focus-visible { outline: 2px solid #FBBF24; outline-offset: 2px; }
#home-cal .cal-grid { border-color: #F3E8DC; }
#home-cal .cal-day { border-left-color: #F6EEE3; }
#home-cal .cal-day.we { background: #FFFBF5; }
#home-cal .cal-day.today .cal-dh { background: #FEF3C7; color: #9A4426; }
#home-cal .cal-day.today .cal-dh b { background: #C25E38; }
#home-cal .cal-ev { gap: 2px; background: var(--bg); border-left: 3px solid var(--c); color: #1E293B; padding: 6px 7px 7px; }
#home-cal .cal-ev .ce-top { align-items: center; }
#home-cal .cal-ev time { color: var(--tx); font-size: 10.5px; }
#home-cal .cal-ev b { white-space: normal; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
#home-cal .cal-ev small { color: #64748B; opacity: 1; }
.ce-canal { display: inline-grid; place-items: center; width: 16px; height: 16px; flex: none; color: var(--tx); }
.ce-canal svg { width: 13px; height: 13px; }
.ce-badge { justify-self: start; margin-top: 2px; padding: 1px 7px; border-radius: 999px; background: var(--tx); color: #fff; font-size: 9.5px; font-weight: 700; letter-spacing: .03em; white-space: nowrap; max-width: 100%; overflow: hidden; text-overflow: ellipsis; }
#home-cal .cal-legend { display: none; }
@media (max-width: 720px) { .cal-masc { width: 48px; } .cal-head-r { width: 100%; justify-content: space-between; } }
@media (prefers-reduced-motion: reduce) { .cal-masc { animation: none; } }

/* ---------- Widget « Connecter mon agenda » et planning pleine largeur ---------- */
.home-top-grid.plein { grid-template-columns: minmax(0, 1fr); }
.home-top-grid .sync[hidden] { display: none; }
#home-sync { display: grid; gap: 14px; align-content: start; }
.ag-head { display: flex; gap: 12px; align-items: flex-start; }
.ag-ico { flex: none; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 12px; background: #FEF3C7; color: #C25E38; }
.ag-ico svg { width: 22px; height: 22px; }
.ag-head h3 { margin: 0 0 2px; color: #C25E38 !important; }
.ag-btn { justify-content: flex-start; }
.ag-btn .ag-fl { margin-left: auto; color: #C25E38; font-weight: 700; transition: transform .15s ease; }
.ag-btn:hover .ag-fl { transform: translateX(3px); }
.ag-note { margin: 0; padding: 10px 12px; border-radius: 10px; background: #FDF3E7; color: #7A5B43; font-size: 12.5px; line-height: 1.5; }
.cal-sync { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin: 0 0 4px; }
.cal-sync-pill { display: inline-flex; align-items: center; gap: 7px; padding: 3px 10px 3px 8px; border-radius: 999px; background: #E8F6EE; border: 1px solid #CDEBD9; color: #1F7A4D; font-size: 11.5px; font-weight: 700; }
.cal-sync-pill i { width: 7px; height: 7px; border-radius: 50%; background: #22A06B; box-shadow: 0 0 0 3px rgba(34,160,107,.18); }
.cal-sync-src { font-size: 11.5px; color: #64748B; }
.cal-sync .link-btn { font-size: 11.5px; color: #C25E38; }
.ag-options { list-style: none; margin: 0; padding: 12px 14px; display: grid; gap: 10px; border-radius: 12px; background: #FDF3E7; border: 1px solid #F3E8DC; }
.ag-options li { display: grid; grid-template-columns: 22px minmax(0, 1fr); gap: 8px; font-size: 12.5px; line-height: 1.5; color: #475569; }
.ag-options b { color: #9A4426; }
.ag-emo { font-size: 15px; line-height: 1.3; }
.ag-btn > span:nth-child(2) { white-space: normal; text-align: left; }

/* ---- Connexions : quatre onglets (2 boîtes mail, 2 agendas) ---- */
.ag-grp { display: grid; gap: 10px; padding: 14px; border-radius: 14px; background: #FFFCF8; border: 1px solid #F3E8DC; }
.ag-grp.ok { background: #F0FDF4; border-color: #BBF7D0; }
.ag-grp h4 { display: flex; align-items: center; gap: 8px; margin: 0; font: 700 13px/1.2 Inter, system-ui, sans-serif; color: #9A4426; text-transform: uppercase; letter-spacing: .05em; }
.ag-ok { margin-left: auto; padding: 3px 9px; border-radius: 999px; background: #DCFCE7; color: #166534; font-size: 11px; letter-spacing: .02em; text-transform: none; }
.ag-desc { margin: -4px 0 0; font-size: 12.5px; line-height: 1.5; color: #64748B; }
.ag-tabs { display: grid; grid-template-columns: repeat(auto-fit, minmax(118px, 1fr)); gap: 8px; }
.ag-tab { position: relative; flex-direction: column; align-items: flex-start; gap: 8px; padding: 12px; min-height: 0; }
.ag-tab.actif { border-color: #FBBF24; box-shadow: 0 0 0 3px #FEF3C7; }
.ag-tab .oc-logo svg { width: 26px; height: 26px; }
.ag-tab b { display: block; font-size: 14px; color: #1E293B; }
.ag-tab small { display: block; margin-top: 2px; font: 500 11.5px/1.35 Inter, system-ui, sans-serif; color: #64748B; }
.ag-tab .ag-fl { position: absolute; top: 12px; right: 12px; }
.ag-tab.ag-tab-mini { flex-direction: row; align-items: center; min-height: 0; padding: 10px 36px 10px 12px; }
.ag-tab.ag-tab-mini .ag-fl { top: 50%; transform: translateY(-50%); }
.ag-tab.ag-tab-mini:hover .ag-fl { transform: translate(3px, -50%); }
.ag-fait { display: grid; grid-template-columns: 26px minmax(0, 1fr) auto; align-items: center; gap: 10px; margin: 0; padding: 9px 12px; border-radius: 10px; background: #fff; border: 1px solid #DCFCE7; }
.ag-fait .oc-logo svg { width: 22px; height: 22px; }
.ag-fait b { display: block; font-size: 13.5px; color: #1E293B; }
.ag-fait small { display: block; font-size: 11.5px; color: #64748B; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ag-fait i { font-style: normal; display: grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; background: #10B981; color: #fff; font-size: 12px; font-weight: 700; }
.ag-q { display: grid; gap: 10px; padding: 12px; border-radius: 12px; background: #FEF3C7; border: 1px solid #FDE68A; }
.ag-q p { margin: 0; font-size: 13px; line-height: 1.45; color: #78350F; }
.ag-q-btns { display: grid; gap: 8px; }
.ag-q-btns .btn { justify-self: start; }
.ap-form { display: grid; gap: 10px; padding: 14px; border-radius: 12px; background: #fff; border: 1px solid #EADBC8; }
.ap-titre { display: flex; align-items: center; gap: 8px; margin: 0; font-size: 14px; color: #1E293B; }
.ap-titre .oc-logo svg { width: 22px; height: 22px; }
.ap-form label { display: grid; gap: 4px; font-size: 12.5px; font-weight: 600; color: #475569; }
.ap-form input { padding: 9px 11px; border-radius: 9px; border: 1px solid #E2D6C7; font: 14px Inter, system-ui, sans-serif; background: #FFFCF8; }
.ap-form input:focus { outline: 2px solid #FBBF24; outline-offset: 1px; border-color: #FBBF24; }
.ap-aide { margin: 0; font-size: 12px; line-height: 1.5; color: #7A5B43; }
.ap-aide a { color: #C25E38; font-weight: 600; }
.ap-form .form-error:empty { display: none; }
.ap-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; }
.oc-cfg { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 14px; }
.oc-grp { display: flex; gap: 6px; align-items: center; margin: 0 0 8px; font: 700 12px/1 Inter, system-ui, sans-serif; text-transform: uppercase; letter-spacing: .05em; color: #9A4426; }
.oc-rows { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.oc-row { display: grid; grid-template-columns: 24px minmax(0, 1fr) auto; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 10px; border: 1px solid #EADBC8; background: #fff; }
.oc-row.on { border-color: #BBF7D0; background: #F0FDF4; }
.oc-row .oc-logo svg { width: 22px; height: 22px; }
.oc-row b { display: block; font-size: 13.5px; }
.oc-row small { display: block; font-size: 12px; color: #64748B; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.oc-envoi { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; font-size: 13px; font-weight: 600; color: #475569; }
.oc-envoi select { padding: 7px 10px; border-radius: 9px; border: 1px solid #E2D6C7; background: #fff; font: 13px Inter, system-ui, sans-serif; }
.integ-oc { display: grid; gap: 14px; }

/* ---- Top 5 : une carte par projet avec anneau des critères ---- */
#hbars.hbars { display: grid; grid-template-columns: repeat(auto-fit, minmax(178px, 1fr)); gap: 14px; }
.t5-card { position: relative; display: grid; justify-items: center; align-content: start; gap: 10px; padding: 18px 14px 14px; border-radius: 16px; border: 1px solid #F3E8DC; background: #FFFCF8; color: #1E293B; font: inherit; text-align: center; cursor: pointer; min-width: 0; transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease; }
.t5-card:hover { border-color: #FBBF24; box-shadow: 0 10px 24px -14px rgba(194, 94, 56, .45); transform: translateY(-2px); }
.t5-card:focus-visible { outline: 2px solid #0D9488; outline-offset: 2px; }
.t5-rank { position: absolute; top: 10px; left: 10px; display: grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; background: #FDF3E7; color: #C25E38; font: 800 12.5px/1 Inter, system-ui, sans-serif; }
.t5-card:first-child .t5-rank { background: #C25E38; color: #fff; }
.t5-donut { position: relative; width: 116px; height: 116px; }
.t5-donut svg { width: 100%; height: 100%; transform: rotate(-90deg); }
.t5-fond { fill: none; stroke: #F3E8DC; stroke-width: 13; }
.t5-arc { fill: none; stroke: var(--c); stroke-width: 13; stroke-dasharray: var(--long) var(--C); stroke-dashoffset: var(--debut); transition: stroke-dasharray .9s cubic-bezier(.2, .8, .2, 1); }
.t5-card.anim:not(.in) .t5-arc { stroke-dasharray: 0 var(--C); }
.t5-note { position: absolute; inset: 0; display: flex; align-items: baseline; justify-content: center; padding-top: 42px; font-variant-numeric: tabular-nums; }
.t5-note b { font: 800 26px/1 var(--f-friendly, Inter), system-ui, sans-serif; letter-spacing: -.03em; color: #0F172A; }
.t5-note small { font-size: 12px; font-weight: 600; color: #5A6D87; margin-left: 1px; }
.t5-note.fort b { color: #26787A; } .t5-note.moyen b { color: #9A4323; }
.t5-titre { display: grid; gap: 4px; min-width: 0; width: 100%; }
.t5-titre b { font-size: 14px; line-height: 1.3; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-wrap: balance; }
.t5-titre small { font-size: 12px; color: #64748B; line-height: 1.35; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.t5-titre .dot { display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: var(--c); margin-right: 5px; vertical-align: 1px; }
.t5-crit { list-style: none; margin: 2px 0 0; padding: 8px 0 0; border-top: 1px dashed #EADBC8; width: 100%; display: grid; gap: 4px; }
.t5-crit li { display: grid; grid-template-columns: 10px minmax(0, 1fr) auto; align-items: center; gap: 6px; font-size: 11.5px; color: #475569; text-align: left; }
.t5-crit i { width: 9px; height: 9px; border-radius: 3px; background: var(--c); }
.t5-crit b { font-variant-numeric: tabular-nums; color: #1E293B; }
@media (prefers-reduced-motion: reduce) { .t5-arc, .t5-card { transition: none; } }

/* ---- Modales de formulaire : centrées, 85vh max, défilement interne ---- */
dialog.modal { margin: auto; max-height: 85vh; overflow: hidden; }
.modal-sm .modal-inner { display: flex; flex-direction: column; max-height: 85vh; }
.modal-sm .modal-head, .modal-sm .modal-foot { flex: none; }
.modal-sm .modal-inner > .form-grid { flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding-top: 20px; padding-bottom: 22px; }
.modal-identite { width: min(680px, calc(100% - 32px)); }
.modal-identite .form-grid > input, .modal-identite .form-grid select, .modal-identite .form-grid .badge-input { width: 100%; max-width: 100%; box-sizing: border-box; }
.modal-identite .goals { min-width: 0; }
.modal-identite .unit-input { min-width: 0; }
@media (max-width: 600px) { .modal-identite .goals { grid-template-columns: minmax(0, 1fr); } }

/* ---- Accès support : bloc unique, sans journal ---- */
#support-card .sp-grid { grid-template-columns: minmax(0, 1fr); }
.t-retirer { margin-top: 4px; font-size: 12px; }

/* ---- Campagnes & E-mails ---- */
.cg-kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 14px; margin-bottom: 18px; }
.cg-grid { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 18px; align-items: start; }
@media (max-width: 1100px) { .cg-grid { grid-template-columns: minmax(0, 1fr); } }
.cg-journal { padding: 18px; }
.cg-head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 10px; margin-bottom: 12px; }
.cg-head h3 { margin: 0; }
.cg-filtres { display: flex; flex-wrap: wrap; gap: 6px; }
.cg-filtres button { padding: 5px 11px; border-radius: 999px; border: 1px solid #EADBC8; background: #fff; font: 600 12.5px Inter, system-ui, sans-serif; color: #475569; cursor: pointer; }
.cg-filtres button b { color: #5A6D87; margin-left: 3px; }
.cg-filtres button[aria-pressed="true"] { background: #FEF3C7; border-color: #FBBF24; color: #78350F; }
.cg-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.cg-row { display: grid; grid-template-columns: 104px minmax(0, 1fr) auto auto; gap: 12px; align-items: center; padding: 12px 14px; border-radius: 12px; border: 1px solid #F3E8DC; background: #FFFCF8; }
.cg-row.st-repondu { border-color: #A7F3D0; background: #F0FDF4; }
.cg-etape { justify-self: start; padding: 4px 9px; border-radius: 999px; font: 700 11.5px/1.2 Inter, system-ui, sans-serif; background: #FEE2E2; color: #991B1B; white-space: nowrap; }
.cg-etape.et-approche { background: #FDF3E7; color: #9A4426; }
.cg-etape.et-test { background: #E0F2FE; color: #075985; }
.cg-main { min-width: 0; display: grid; gap: 2px; }
.cg-main b { font-size: 13.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cg-main small { font-size: 12px; color: #64748B; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cg-meta em { font-style: normal; color: #B45309; }
.cg-statut { display: inline-flex; border: 1px solid #EADBC8; border-radius: 10px; overflow: hidden; background: #fff; }
.cg-statut button { padding: 6px 10px; border: 0; background: none; font: 600 12px Inter, system-ui, sans-serif; color: #64748B; cursor: pointer; }
.cg-statut button + button { border-left: 1px solid #F3E8DC; }
.cg-statut button[aria-pressed="true"][data-cgst="envoye"] { background: #E2E8F0; color: #1E293B; }
.cg-statut button[aria-pressed="true"][data-cgst="ouvert"] { background: #DBEAFE; color: #1E40AF; }
.cg-statut button[aria-pressed="true"][data-cgst="repondu"] { background: #10B981; color: #fff; }
.cg-statut button:disabled { cursor: default; }
.cg-statut button:not(:disabled):hover { background: #FEF3C7; }
.cg-vide { padding: 22px; text-align: center; color: #64748B; font-size: 13px; border: 1px dashed #EADBC8; border-radius: 12px; }
.cg-test { padding: 18px; display: grid; gap: 10px; position: sticky; top: 70px; }
.cg-test h3 { margin: 0; }
.cg-test p { margin: 0; }
.cg-test select { width: 100%; padding: 9px 11px; border-radius: 10px; border: 1px solid #E2D6C7; background: #fff; font: 14px Inter, system-ui, sans-serif; }
.cg-via { font-size: 12.5px; line-height: 1.5; padding: 9px 11px; border-radius: 10px; background: #FEF3C7; color: #78350F; }
.cg-via.ok { background: #F0FDF4; color: #166534; }
@media (max-width: 720px) { .cg-row { grid-template-columns: minmax(0, 1fr); } }

/* ---- Exports & assignation ---- */
.top10-r { display: grid; justify-items: end; gap: 10px; }
.exp-btns { display: inline-flex; flex-wrap: wrap; gap: 8px; }
.t5-card { padding: 0; cursor: default; display: grid; grid-template-rows: 1fr auto; }
.t5-card:hover { transform: none; }
.t5-open { all: unset; box-sizing: border-box; display: grid; justify-items: center; align-content: start; gap: 10px; padding: 18px 14px 12px; cursor: pointer; text-align: center; width: 100%; border-radius: 16px 16px 0 0; }
.t5-open:hover .t5-donut { transform: scale(1.03); }
.t5-donut { transition: transform .2s ease; }
.t5-open:focus-visible { outline: 2px solid #0D9488; outline-offset: -2px; }
.t5-assign { display: flex; align-items: center; gap: 8px; padding: 9px 12px; border-top: 1px solid #F3E8DC; background: #fff; border-radius: 0 0 16px 16px; }
.t5-assign select { flex: 1; min-width: 0; border: 0; background: transparent; font: 600 12.5px Inter, system-ui, sans-serif; color: #475569; cursor: pointer; padding: 2px 0; }
.t5-noone { display: grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; border: 1.5px dashed #CBB89F; color: #A1886B; font-weight: 700; }
.mk-collab { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; padding: 10px 28px 14px; border-bottom: 1px solid var(--line); }
.mk-assign { display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 600; color: #475569; }
.mk-assign select { padding: 7px 10px; border-radius: 9px; border: 1px solid #E2D6C7; background: #fff; font: 13px Inter, system-ui, sans-serif; }

/* ---- Cycle de vente & statut des cartes ---- */
.funnel { display: grid; grid-template-columns: 230px minmax(0, 1fr); gap: 14px; align-items: stretch; }
@media (max-width: 900px) { .funnel { grid-template-columns: minmax(0, 1fr); } }
.cy-engage { display: grid; align-content: center; gap: 4px; padding: 16px 18px; border-radius: 16px; background: linear-gradient(135deg, #C25E38, #9A4426); color: #fff; }
.cy-engage span { font: 700 11.5px Inter, system-ui, sans-serif; text-transform: uppercase; letter-spacing: .08em; opacity: .85; }
.cy-engage b { font: 800 30px/1.05 var(--f-friendly, Inter), system-ui, sans-serif; letter-spacing: -.03em; font-variant-numeric: tabular-nums; }
.cy-engage small { font-size: 12px; opacity: .9; }
.cy-phases { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
@media (max-width: 720px) { .cy-phases { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.cy-ph { position: relative; display: grid; gap: 2px; padding: 12px 14px; border-radius: 14px; background: #fff; border: 1px solid #F3E8DC; border-top: 4px solid var(--c); min-width: 0; }
.cy-nom { font-size: 12.5px; font-weight: 700; color: #475569; }
.cy-ph b { font: 800 22px/1.1 var(--f-friendly, Inter), system-ui, sans-serif; color: #0F172A; font-variant-numeric: tabular-nums; }
.cy-ph small { font-size: 12.5px; font-weight: 600; color: var(--c); }
.cy-ph em { font-style: normal; font-size: 11.5px; color: #5A6D87; }
.cy-fl { position: absolute; right: -11px; top: 50%; transform: translateY(-50%); z-index: 1; color: #C25E38; font-size: 15px; }
.cy-drop { border-style: dashed; border-top-style: solid; transition: background .15s ease; }
.cy-drop.drop { background: color-mix(in srgb, var(--c) 12%, #fff); }
.st-sel { display: flex; align-items: center; gap: 6px; font-size: 11.5px; color: #5A6D87; }
.st-sel select { flex: 1; min-width: 0; padding: 4px 6px; border-radius: 8px; border: 1px solid #EADBC8; background: #FFFCF8; font: 600 12px Inter, system-ui, sans-serif; color: #475569; cursor: pointer; }

/* ---- Parcours d'accueil ---- */
.onb { width: min(640px, calc(100% - 32px)); }
.onb .modal-inner { display: flex; flex-direction: column; max-height: 85vh; }
.onb-steps { list-style: none; margin: 0; padding: 14px 28px 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; flex: none; }
.onb-steps li { display: flex; align-items: center; gap: 8px; font-size: 12.5px; font-weight: 600; color: #5A6D87; padding-bottom: 10px; border-bottom: 3px solid #F3E8DC; }
.onb-steps li span { display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; background: #F3E8DC; color: #5A6D87; font-size: 12px; flex: none; }
.onb-steps li.actif { color: #C25E38; border-color: #C25E38; }
.onb-steps li.actif span { background: #C25E38; color: #fff; }
.onb-steps li.fait { color: #0D9488; border-color: #0D9488; }
.onb-steps li.fait span { background: #0D9488; color: #fff; }
.onb-body { flex: 1 1 auto; min-height: 0; overflow-y: auto; padding: 18px 28px 22px; display: grid; gap: 8px; align-content: start; }
.onb-intro { margin: 0 0 6px; font-size: 13.5px; color: #475569; line-height: 1.55; }
.onb-body > input, .onb-body select, .onb-search input { width: 100%; box-sizing: border-box; padding: 10px 12px; border-radius: 10px; border: 1px solid #E2D6C7; background: #fff; font: 14px Inter, system-ui, sans-serif; }
.onb-search { position: relative; }
.onb-spin { position: absolute; right: 12px; top: 50%; width: 16px; height: 16px; margin-top: -8px; border-radius: 50%; border: 2px solid #F3E8DC; border-top-color: #C25E38; animation: onbspin .8s linear infinite; }
@keyframes onbspin { to { transform: rotate(360deg); } }
.onb-res { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.onb-res button { all: unset; box-sizing: border-box; display: grid; gap: 2px; width: 100%; padding: 9px 12px; border-radius: 10px; border: 1px solid #F3E8DC; background: #FFFCF8; cursor: pointer; }
.onb-res button:hover, .onb-res button:focus-visible { border-color: #FBBF24; background: #FEF3C7; }
.onb-res b { font-size: 13.5px; }
.onb-res small { font-size: 12px; color: #64748B; }
.onb-pre { margin: 4px 0 0; padding: 9px 12px; border-radius: 10px; background: #F0FDF4; color: #166534; font-size: 12.5px; }
.onb-kw { display: flex; flex-wrap: wrap; gap: 6px; padding: 8px; border-radius: 12px; border: 1px solid #E2D6C7; background: #fff; }
.onb-kw .badge { display: inline-flex; align-items: center; gap: 4px; padding: 4px 6px 4px 10px; border-radius: 999px; background: #FDF3E7; color: #9A4426; font-size: 12.5px; font-weight: 600; }
.onb-kw .badge button { border: 0; background: none; color: #C25E38; cursor: pointer; font-size: 15px; line-height: 1; padding: 0 2px; }
.onb-kw input { flex: 1; min-width: 160px; border: 0; outline: 0; font: 13.5px Inter, system-ui, sans-serif; padding: 4px; }
.onb-sug-t { margin: 6px 0 0; font-size: 12px; font-weight: 600; color: #5A6D87; }
.onb-sug { display: flex; flex-wrap: wrap; gap: 6px; }
.onb-sug button { padding: 4px 10px; border-radius: 999px; border: 1px dashed #CBB89F; background: #fff; font: 600 12px Inter, system-ui, sans-serif; color: #7A5B43; cursor: pointer; }
.onb-sug button:hover { border-style: solid; border-color: #FBBF24; background: #FEF3C7; }
.onb-co { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 12px; }
.onb-foot { flex: none; }
@media (max-width: 600px) { .onb-steps, .onb-body { padding-left: 18px; padding-right: 18px; } .onb-steps li { font-size: 0; } .onb-steps li span { font-size: 12px; } }

/* Bandeau de consentement (même poids visuel pour Refuser et Accepter) */

/* ---- Accessibilité, formulaires, pages légales ---- */
.skip-link { position: absolute; left: 12px; top: -60px; z-index: 10000; padding: 10px 16px; border-radius: 10px; background: #1E293B; color: #fff; font-weight: 700; text-decoration: none; }
.skip-link:focus { top: 12px; }
.hp { position: absolute !important; left: -10000px !important; width: 1px; height: 1px; overflow: hidden; }
.field-msg { margin: 4px 0 2px; display: flex; gap: 6px; align-items: flex-start; font-size: 12.5px; font-weight: 600; line-height: 1.4; color: #B91C1C; }
.field-msg::before { content: "!"; flex: none; display: grid; place-items: center; width: 16px; height: 16px; margin-top: 1px; border-radius: 50%; background: #B91C1C; color: #fff; font-size: 11px; font-weight: 800; }
input[aria-invalid="true"], select[aria-invalid="true"], textarea[aria-invalid="true"] { border-color: #DC2626 !important; box-shadow: 0 0 0 3px rgba(220, 38, 38, .14) !important; background-color: #FFFBFB !important; }
input[type="checkbox"][aria-invalid="true"] { outline: 2px solid #DC2626; outline-offset: 2px; }
.wz-cgu { display: flex; gap: 10px; align-items: flex-start; margin: 10px 0 0; font-size: 13.5px; line-height: 1.5; color: #334155; }
.wz-cgu input { margin-top: 3px; width: 18px; height: 18px; flex: none; accent-color: #C25E38; }
.wz-cgu a { color: #9A4426; font-weight: 600; }
.lp-legal { display: flex; flex-wrap: wrap; gap: 6px 16px; align-items: center; }
.lp-legal a, .lp-legal .link-btn { font-size: 13px; color: #9A4426; text-decoration: underline; text-underline-offset: 3px; font-weight: 600; }
.site-footer { display: grid; gap: 10px; }
:focus-visible { outline: 3px solid #0D9488; outline-offset: 2px; }
.pro-audience { padding: 18px; display: grid; gap: 10px; }
.pa-total { margin: 0; font-size: 13.5px; color: #475569; }
.pa-total b { font-size: 22px; color: #1E293B; margin-right: 4px; }
.pa-bars { display: flex; align-items: flex-end; gap: 3px; height: 70px; }
.pa-bars i { flex: 1; background: #C25E38; border-radius: 3px 3px 0 0; opacity: .85; }
.pa-pages { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 6px 18px; font-size: 13px; }
.pa-pages li { display: flex; justify-content: space-between; border-bottom: 1px dashed #EADBC8; padding: 3px 0; }
.api-card { padding: 18px; display: grid; gap: 14px; }
.api-form .inline { display: flex; gap: 10px; flex-wrap: wrap; }
.api-form input { flex: 1 1 220px; min-width: 0; padding: 9px 12px; border-radius: 10px; border: 1px solid #E2D6C7; font: 14px Inter, system-ui, sans-serif; }
.api-nouvelle { display: grid; gap: 8px; padding: 12px 14px; border-radius: 12px; background: #F0FDF4; border: 1px solid #BBF7D0; color: #166534; font-size: 13.5px; }
.api-nouvelle code { display: block; padding: 8px 10px; border-radius: 8px; background: #fff; color: #1E293B; font-size: 13px; word-break: break-all; user-select: all; }
.api-nouvelle .btn { justify-self: start; }
.api-liste { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.api-liste li { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 10px 12px; border: 1px solid #F3E8DC; border-radius: 10px; background: #FFFCF8; }
.api-liste small { display: block; color: #64748B; font-size: 12px; }


/* ==================================================================== */
/* Accessibilité : contrastes ≥ 4,5:1 pour le texte courant (WCAG 2.1 AA) */
/* Mêmes teintes que la charte, assombries juste assez pour être lisibles */
/* ==================================================================== */
:root { --muted: #625B55; --red: #BE4039; --green: #2E7958; --gold: #926019; --sb-dim: #626C7C; }
.muted, .step-sub, label.sort, .tk-meta { color: #625B55; }
.sb-sep { color: #626D7E; }
.sb-tag, .logo-tag, .sb-tenant small { color: #5E6D82; }
.eyebrow-gold, .home-list .rang, .hb-val.moyen, .pill.prevu, .src-tag.app, .id-lock { color: #926019; }
.cal-legend, .sync-body small, .sync-note, .cal-dh span { color: #606D81; }
.gate-pastel .tag-tous, .gate-hero .tag-tous, .lp-kicker, .px h3, .px-head h3 { color: #AA5231; }
.px-kicker { color: #267675; }
.hero-note { color: #6F5442 !important; }
.or-rang { color: #5A6D87; }
.score-badge.fort, .or-score.fort, .oc-verdict.fort b { background-color: #297E7C; color: #fff; }
.tenant-mono, .hd-head .tenant-mono { background-color: #B65835; color: #fff; }
.cy-ph small { color: #334155; }
.pill.calm { color: #2D7757; }
.pill.urgent { color: #BC3F38; }
.sb-tenant .tenant-mono, .hd-head .tenant-mono, span.tenant-mono { background-color: #B65835; color: #fff; }
.lp-foot { color: #6F5442; }
.team-list button[data-member], .link-btn { color: #267675; }
.link-btn.danger { color: #B42318; }
.cal-day.today .cal-dh b { background-color: #B65835; color: #fff; }

/* ---- Abonnement ---- */
.abo-card { padding: 20px; display: grid; gap: 18px; }
.abo-etat { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 18px; padding: 14px 16px; border-radius: 14px; background: #FDF3E7; border: 1px solid #F3E2CB; }
.abo-etat > div { display: grid; gap: 2px; }
.abo-label { font-size: 11.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; color: #726B64; }
.abo-etat b { font: 800 20px/1.1 var(--f-friendly, Inter), system-ui, sans-serif; color: #1E293B; }
.abo-etat p { flex: 1 1 260px; margin: 0; color: #475569; }
.abo-pill { display: inline-flex; align-items: center; gap: 7px; padding: 5px 11px; border-radius: 999px; font: 700 12.5px Inter, system-ui, sans-serif; background: #FEF3C7; color: #78350F; }
.abo-pill i { width: 8px; height: 8px; border-radius: 50%; background: currentColor; }
.abo-pill.st-actif { background: #DCFCE7; color: #166534; }
.abo-pill.st-suspendu { background: #FEE2E2; color: #991B1B; }
.abo-pill.st-resilie { background: #E2E8F0; color: #334155; }
.abo-sim { color: #92400E; font-weight: 600; }
.abo-formules { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 14px; }
.abo-f { position: relative; display: grid; align-content: start; gap: 10px; padding: 18px; border-radius: 16px; background: #fff; border: 1px solid #EADBC8; }
.abo-f.reco { border: 2px solid #FBBF24; box-shadow: 0 12px 28px -18px rgba(194, 94, 56, .5); }
.abo-f.actuelle { background: #FFFCF8; border-color: #C25E38; }
.abo-reco { position: absolute; top: -11px; right: 14px; padding: 3px 10px; border-radius: 999px; background: #FBBF24; color: #1E293B; font: 700 11.5px Inter, system-ui, sans-serif; }
.abo-f h4 { margin: 0; font-size: 16px; color: #AA5231; }
.abo-prix { margin: 0; color: #475569; font-size: 13px; }
.abo-prix b { font: 800 28px/1 var(--f-friendly, Inter), system-ui, sans-serif; color: #1E293B; letter-spacing: -.02em; }
.abo-f ul { margin: 0; padding-left: 18px; display: grid; gap: 4px; font-size: 13px; color: #334155; }
.abo-actuelle { display: inline-block; padding: 8px 0; font-weight: 700; color: #2E7958; }
.abo-note { margin: 0; color: #475569; }
.abo-ia { display: grid; gap: 6px; padding: 12px 16px; border-radius: 14px; border: 1px solid #E2E8F0; background: #FFFFFF; }
.abo-ia p { margin: 0; color: #475569; }
.abo-ia progress { width: 100%; height: 8px; border: 0; border-radius: 99px; overflow: hidden; background: #E2E8F0; accent-color: #1E3A8A; appearance: none; }
.abo-ia progress::-webkit-progress-bar { background: #E2E8F0; border-radius: 99px; }
.abo-ia progress::-webkit-progress-value { background: #1E3A8A; border-radius: 99px; }
.abo-ia progress::-moz-progress-bar { background: #1E3A8A; border-radius: 99px; }
.abo-ia.is-full { border-color: #F3C99B; background: #FFF7ED; }
.abo-ia.is-full p { color: #9A3412; }
.abo-ia.is-full progress::-webkit-progress-value { background: #C2410C; }
.abo-ia.is-full progress::-moz-progress-bar { background: #C2410C; }
.pay-sim { padding: 10px 12px; border-radius: 10px; background: #FEF3C7; color: #78350F; font-size: 13.5px; }

/* ---- Cibly Pro : fiche entreprise ---- */
.fiche { width: min(860px, calc(100% - 32px)); }
.fiche .modal-inner { display: flex; flex-direction: column; max-height: 85vh; }
.fiche .modal-head { flex: none; }
.fi-onglets { flex: none; display: flex; flex-wrap: wrap; gap: 6px; padding: 12px 28px 0; border-bottom: 1px solid #F3E8DC; }
.fi-onglets button { padding: 9px 14px; border: 0; border-bottom: 3px solid transparent; background: none; font: 700 13.5px Inter, system-ui, sans-serif; color: #726B64; cursor: pointer; }
.fi-onglets button[aria-selected="true"] { color: #AA5231; border-bottom-color: #C25E38; }
.fi-corps { flex: 1 1 auto; min-height: 0; overflow-y: auto; padding: 20px 28px 26px; display: grid; gap: 14px; align-content: start; }
.fi-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 16px; }
.fi-form .large, .fi-form footer { grid-column: 1 / -1; }
.fi-form label, .fi-axe label { display: grid; gap: 5px; font-size: 12.5px; font-weight: 700; color: #475569; }
.fi-form em, .fi-axe em { font-style: normal; font-weight: 500; color: #726B64; }
.fi-form input, .fi-form select, .fi-axe textarea { width: 100%; box-sizing: border-box; padding: 9px 11px; border-radius: 10px; border: 1px solid #E2D6C7; background: #fff; font: 14px Inter, system-ui, sans-serif; color: #1E293B; }
.fi-axe { display: grid; gap: 10px; padding: 14px 16px; border-radius: 14px; background: #FFFCF8; border: 1px solid #F3E8DC; border-left: 4px solid var(--c); }
.fi-axe h4 { margin: 0; font-size: 15px; }
.fi-axe footer { display: flex; justify-content: flex-end; }
.fi-users { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.fi-users li { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: 12px; align-items: center; padding: 10px 14px; border-radius: 12px; border: 1px solid #F3E8DC; background: #fff; }
.fi-users small { display: block; color: #64748B; font-size: 12px; }
.fi-users select { padding: 6px 9px; border-radius: 9px; border: 1px solid #E2D6C7; background: #fff; font: 13px Inter, system-ui, sans-serif; }
.fi-sessions { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; padding: 12px 14px; border-radius: 12px; background: #FDF3E7; font-size: 13.5px; color: #475569; }
.fi-abo { display: grid; gap: 12px; }
.fi-abo p { margin: 0; }
.fi-abo a { color: #9A4426; }
.t-actions { display: flex; flex-wrap: wrap; gap: 4px 12px; margin-top: 4px; }
.t-actions .link-btn { font-size: 12px; }
@media (max-width: 640px) { .fi-form { grid-template-columns: minmax(0, 1fr); } .fi-users li { grid-template-columns: minmax(0, 1fr); } .fi-onglets, .fi-corps { padding-left: 18px; padding-right: 18px; } }

/* Aucune zone sombre : voile crème derrière les fenêtres et tiroirs */
.modal::backdrop, .drawer::backdrop, dialog::backdrop { background: rgba(253, 243, 231, .72); backdrop-filter: blur(4px); }
.modal, dialog.drawer { box-shadow: 0 30px 80px -30px rgba(154, 68, 38, .35), 0 0 0 1px #EADBC8; }
.skip-link { background: #FEF3C7; color: #1E293B; border: 2px solid #C25E38; }
.id-mono { background: #FBBF24 !important; color: #1E293B !important; }
.meta-sector { background: #FDF3E7 !important; color: #9A4426 !important; border: 1px solid #EADBC8; }
.cp-badge { background: #FBBF24 !important; color: #1E293B !important; }
#home-cal .cal-day.today .cal-dh b { background-color: #B65835; }

/* ---- Page d'accueil : tarifs ---- */
.lp-tarifs { background: #FFFFFF; }
.lp-tarifs-head { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 26px; }
.lp-tarifs-head h2 { margin: 4px 0 8px; }
.lp-tarifs-head p { margin: 0; max-width: 60ch; color: #475569; }
.lp-tarifs-masc { width: 130px; margin: 0; }
.lp-plans { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 20px; max-width: 880px; margin: 0 auto; }
.lp-plan { position: relative; display: grid; align-content: start; gap: 12px; padding: 26px 24px 24px; border-radius: 20px; background: #FFFCF8; border: 1px solid #EADBC8; text-align: left; }
.lp-plan.reco { background: #FFFFFF; border: 2px solid #FBBF24; box-shadow: 0 22px 44px -26px rgba(194, 94, 56, .55); }
.lp-reco { position: absolute; top: -13px; left: 24px; padding: 4px 12px; border-radius: 999px; background: #FBBF24; color: #1E293B; font: 700 12px Inter, system-ui, sans-serif; }
.lp-plan h3 { margin: 0; font-size: 20px; color: #AA5231; }
.lp-prix { margin: 0; display: flex; align-items: baseline; gap: 6px; }
.lp-prix b { font: 800 44px/1 var(--f-friendly, Inter), system-ui, sans-serif; letter-spacing: -.03em; color: #1E293B; }
.lp-prix span { color: #475569; font-size: 14px; }
.lp-plan-pour { margin: 0; color: #475569; font-size: 14px; }
.lp-plan ul { margin: 0 0 6px; padding: 0; list-style: none; display: grid; gap: 8px; }
.lp-plan li { position: relative; padding-left: 26px; font-size: 14.5px; color: #1E293B; }
.lp-plan li::before { content: "✓"; position: absolute; left: 0; top: 0; width: 18px; height: 18px; border-radius: 50%; background: #DCFCE7; color: #166534; font-size: 11px; font-weight: 800; display: grid; place-items: center; }
.lp-tarifs-note { text-align: center; margin: 18px 0 0; font-size: 13px; color: #6F5442; }
@media (max-width: 640px) { .lp-tarifs-head { flex-direction: column-reverse; align-items: flex-start; } .lp-tarifs-masc { width: 96px; } }

/* ---- Formule Pro & Équipe : encart ---- */
.pro-only { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 18px; padding: 16px 18px; margin-bottom: 16px; border-radius: 16px; background: linear-gradient(135deg, #FEF3C7, #FDF3E7); border: 1px solid #FDE68A; }
.pro-only > div { flex: 1 1 280px; }
.pro-only b { color: #1E293B; }
.pro-only p { margin: 2px 0 0; font-size: 13.5px; color: #475569; }
.pro-only-tag { padding: 4px 10px; border-radius: 999px; background: #C25E38; color: #fff; font: 700 12px Inter, system-ui, sans-serif; background-color: #B65835; }

/* ---- Suppression du compte ---- */
.danger-zone { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 18px; margin-top: 14px; padding: 14px 16px; border-radius: 14px; border: 1px dashed #F5B5AE; background: #FFF7F5; }
.danger-zone b { color: #9F1D16; }
.danger-zone p { margin: 3px 0 0; color: #475569; max-width: 60ch; }
.btn-danger-ghost { background: #fff; color: #B42318; border: 1.5px solid #F5B5AE; }
.btn-danger-ghost:hover { background: #FEE4E2; }
.sup-alerte { padding: 10px 12px; border-radius: 10px; background: #FEF3F2; border: 1px solid #FECDCA; color: #7A271A; font-size: 13.5px; line-height: 1.5; }
.sup-choix { border: 0; padding: 0; margin: 0; display: grid; gap: 8px; }
.sup-choix label { display: flex; gap: 10px; align-items: flex-start; padding: 10px 12px; border-radius: 12px; border: 1px solid #EADBC8; background: #fff; cursor: pointer; }
.sup-choix label:has(input:checked) { border-color: #C25E38; background: #FFFCF8; }
.sup-choix input { margin-top: 3px; accent-color: #C25E38; }
.sup-choix small { display: block; color: #64748B; font-size: 12.5px; }
.btn-danger { background: #B42318; color: #fff; border-color: #B42318; }
.lp-tarifs-head .lp-kicker { text-align: left; }
@media (max-width: 760px) {
  .ob-list li { grid-template-columns: minmax(0, 1fr); gap: 8px; }
  .ob-list li > * { min-width: 0; }
  .ob-actions { display: flex; flex-wrap: wrap; gap: 8px; }
}
#home-cal .cal-ev small { color: #56647A; }

/* ---- Réglages : onglets ---- */
.rg-head { align-items: flex-start; }
.rg-masc { margin-left: auto; position: relative; flex: none; }
.rg-masc .px-bulle { white-space: nowrap; }
.rg-tabs { display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; padding: 0 clamp(16px, 3vw, 40px); margin: 4px 0 6px; border-bottom: 1px solid #EADBC8; position: sticky; top: 0; z-index: 4; background: #FDF3E7; }
.rg-tabs::-webkit-scrollbar { display: none; }
.rg-tabs button { flex: none; padding: 12px 16px 11px; border: 0; border-bottom: 3px solid transparent; background: none; font: 700 14px Inter, system-ui, sans-serif; color: #726B64; cursor: pointer; white-space: nowrap; }
.rg-tabs button:hover { color: #AA5231; }
.rg-tabs button[aria-selected="true"] { color: #AA5231; border-bottom-color: #C25E38; }
.rg-tabs button:focus-visible { outline: 3px solid #0D9488; outline-offset: -3px; border-radius: 8px 8px 0 0; }
.rg-panel { display: grid; gap: 18px; align-content: start; }
.rg-panel[hidden] { display: none; }
.rg-panel > .block-head { margin-top: 6px; }
.rg-card { padding: 20px 22px; display: grid; gap: 14px; }
.rg-card-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; flex-wrap: wrap; }
.rg-card-head h3 { margin: 2px 0 4px; color: #AA5231; }
.rg-card-head p { margin: 0; max-width: 70ch; }
.rg-form .rg-grid { padding: 0; gap: 8px 18px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.rg-form .rg-grid > * { grid-column: 1 / -1; }
.rg-form .rg-grid > .wz-row { grid-column: 1 / -1; }
.rg-form .rg-grid > input, .rg-form .rg-grid > select { width: 100%; box-sizing: border-box; }
.rg-foot { display: flex; justify-content: flex-end; align-items: center; gap: 14px; padding-top: 12px; margin-top: 8px; border-top: 1px solid #F3E8DC; }
.rg-danger { padding: 20px 22px; border: 1px solid #FECDCA; }
.rg-danger h3 { margin: 0; color: #9F1D16; }
.rg-danger .danger-zone { margin-top: 10px; }
.exp-actuelle { display: flex; align-items: center; gap: 14px; padding: 14px 16px; border-radius: 14px; background: #F0FDF4; border: 1px solid #BBF7D0; }
.exp-actuelle .oc-logo svg { width: 28px; height: 28px; }
.exp-actuelle b { display: block; font-size: 16px; color: #1E293B; }
.exp-actuelle small { display: block; color: #475569; }
.exp-vide { margin: 0; padding: 12px 14px; border-radius: 12px; background: #FEF3C7; color: #78350F; }
.oc-row-act { display: inline-flex; gap: 12px; }
.fac-table td, .fac-table th { padding: 10px 12px; }
.fac-st { padding: 3px 9px; border-radius: 999px; font: 700 12px Inter, system-ui, sans-serif; background: #E2E8F0; color: #334155; }
.fac-st.ok { background: #DCFCE7; color: #166534; } .fac-st.att { background: #FEF3C7; color: #78350F; } .fac-st.ko { background: #FEE2E2; color: #991B1B; }
.fac-liens { display: flex; gap: 12px; } .fac-liens a { color: #9A4426; font-weight: 600; }
.fac-vide { margin: 0; padding: 14px 16px; border-radius: 12px; background: #FDF3E7; color: #475569; }
.sr-txt { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.acc-u { align-items: center; }
.acc-act { display: inline-flex; align-items: center; gap: 10px; }
.acc-act select { padding: 6px 9px; border-radius: 9px; border: 1px solid #E2D6C7; background: #fff; font: 13px Inter, system-ui, sans-serif; }
.role-pill { padding: 3px 10px; border-radius: 999px; background: #F1F5F9; color: #334155; font: 700 12px Inter, system-ui, sans-serif; }
.role-pill.admin { background: #FDF3E7; color: #9A4426; }
@media (max-width: 720px) { .rg-masc { display: none; } .rg-form .rg-grid { grid-template-columns: minmax(0, 1fr); } .acc-act { flex-wrap: wrap; } }
#rg-securite .config-bottom { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: 18px; align-items: start; }
@media (max-width: 1000px) { #rg-securite .config-bottom { grid-template-columns: minmax(0, 1fr); } }
#rg-securite .account-card .block-head h3 { white-space: nowrap; }

/* ---- Page d'accueil : hero, aperçu gratuit, chiffres, FAQ ---- */
.hero-titre { display: flex; align-items: center; justify-content: center; gap: 12px; }
.hero-titre h1 { margin: 0; }
.hero-masc { flex: none; width: 108px; height: auto; animation: masc-bob 5s ease-in-out infinite; }
.apercu { display: grid; gap: 10px; width: min(640px, 100%); margin: 22px auto 0; padding: 18px; border-radius: 20px; background: #FFFFFF; border: 1px solid #F3E2CB; box-shadow: 0 20px 44px -28px rgba(194, 94, 56, .55); text-align: left; }
.apercu > label { font: 700 15px/1.35 Inter, system-ui, sans-serif; color: #1E293B; }
.apercu-row { display: flex; gap: 10px; }
.apercu-row input { flex: 1 1 auto; min-width: 0; padding: 14px 16px; border-radius: 14px; border: 2px solid #EADBC8; background: #FFFCF8; font: 16px Inter, system-ui, sans-serif; color: #1E293B; }
.apercu-row input:focus { outline: none; border-color: #FBBF24; box-shadow: 0 0 0 4px rgba(251, 191, 36, .25); }
.apercu-row .btn { flex: none; background: #FBBF24; color: #1E293B; border-color: #FBBF24; box-shadow: 0 10px 22px -12px rgba(194, 94, 56, .7); }
.apercu .hero-note { margin: 0; text-align: left; }
.apercu .hero-note .link-btn { font-size: inherit; }
.apercu .field-msg { margin-top: 0; }
.apercu-res { width: min(640px, 100%); margin: 14px auto 0; text-align: left; }
.ap-charge { display: flex; align-items: center; gap: 10px; padding: 14px 16px; border-radius: 14px; background: #FFFCF8; border: 1px dashed #EADBC8; color: #475569; }
.ap-charge .onb-spin { position: static; margin: 0; }
.ap-carte { display: grid; gap: 12px; padding: 20px; border-radius: 20px; background: linear-gradient(160deg, #FFFFFF, #FEF7EC); border: 2px solid #FBBF24; box-shadow: 0 24px 50px -30px rgba(194, 94, 56, .6); animation: rise .35s ease both; }
.ap-ent { margin: 0; font-size: 13.5px; color: #475569; }
.ap-ent b { color: #1E293B; }
.ap-total { margin: 0; font-size: 17px; line-height: 1.45; color: #1E293B; }
.ap-total b { font: 800 30px/1 var(--f-friendly, Inter), system-ui, sans-serif; color: #AA5231; letter-spacing: -.02em; }
.ap-ex { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.ap-ex li { display: grid; gap: 2px; padding: 9px 12px; border-radius: 12px; background: #FFFFFF; border: 1px solid #F3E8DC; font-size: 13.5px; color: #1E293B; }
.ap-ex small { color: #64748B; font-size: 12px; }
.ap-note { margin: 0; font-size: 12.5px; line-height: 1.5; color: #475569; }
.ap-msg { margin: 0; padding: 12px 14px; border-radius: 12px; background: #FEF3C7; color: #78350F; }
.lp-preuves { background: #FDF3E7; }
.lp-sous { margin: -4px auto 22px; color: #475569; max-width: 60ch; }
.kpis-pub { list-style: none; margin: 0 auto; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 16px; max-width: 1000px; }
.kpis-pub li { display: grid; gap: 6px; padding: 22px 20px; border-radius: 20px; background: #FFFFFF; border: 1px solid #F3E2CB; text-align: left; }
.kpis-pub li:nth-child(1) { border-top: 5px solid #C25E38; } .kpis-pub li:nth-child(2) { border-top: 5px solid #FBBF24; }
.kpis-pub li:nth-child(3) { border-top: 5px solid #0D9488; } .kpis-pub li:nth-child(4) { border-top: 5px solid #3B82F6; }
.kpis-pub b { font: 800 36px/1 var(--f-friendly, Inter), system-ui, sans-serif; letter-spacing: -.03em; color: #1E293B; font-variant-numeric: tabular-nums; }
.kpis-pub span { font-size: 14px; line-height: 1.45; color: #475569; }
.lp-preuves .temoignages { margin-top: 30px; }
.lp-preuves .tm { background: #FFFFFF; border: 1px solid #F3E2CB; border-radius: 20px; }
.tm-note { display: block; color: #E0A512; letter-spacing: 2px; font-size: 15px; margin-bottom: 6px; }
.lp-faq { background: #FFFFFF; }
.faq-liste { display: grid; gap: 10px; max-width: 780px; margin: 0 auto; text-align: left; }
.faq-item { border-radius: 16px; background: #FFFCF8; border: 1px solid #F3E2CB; }
.faq-item[open] { background: #FFFFFF; border-color: #FBBF24; box-shadow: 0 14px 30px -24px rgba(194, 94, 56, .6); }
.faq-item summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: center; gap: 14px; padding: 16px 18px; font: 700 16px/1.35 Inter, system-ui, sans-serif; color: #1E293B; }
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary::after { content: "+"; flex: none; display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: #FEF3C7; color: #AA5231; font-size: 20px; font-weight: 700; transition: transform .2s ease; }
.faq-item[open] summary::after { transform: rotate(45deg); }
.faq-item summary:focus-visible { outline: 3px solid #0D9488; outline-offset: 2px; border-radius: 16px; }
.faq-item p { margin: 0; padding: 0 18px 18px; color: #334155; line-height: 1.6; }
.lp-cta .hero-cta .btn-sun { background: #FBBF24; color: #1E293B; }
@media (max-width: 640px) {
  .hero-titre { flex-direction: column-reverse; gap: 4px; }
  .hero-masc { width: 84px; }
  .apercu-row { flex-direction: column; }
  .apercu-row .btn { width: 100%; }
  .kpis-pub b { font-size: 30px; }
}
@media (prefers-reduced-motion: reduce) { .hero-masc { animation: none; } .faq-item summary::after { transition: none; } }
.lp-preuves .lp-sous { margin: 10px auto 26px; }
.hero-titre h1 { max-width: 15em; }

/* Aperçu : consultations floutées (aucun intitulé réel n'est transmis à la page) */
.ap-flou { position: relative; border-radius: 14px; overflow: hidden; }
.ap-flou .ap-ex { filter: blur(5px); opacity: .85; user-select: none; pointer-events: none; }
.ap-voile { position: absolute; inset: 0; display: grid; place-content: center; justify-items: center; gap: 4px; padding: 16px; text-align: center; background: rgba(253, 243, 231, .45); backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px); }
.ap-cadenas { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: #FBBF24; font-size: 20px; box-shadow: 0 10px 22px -12px rgba(194, 94, 56, .7); }
.ap-voile b { font-size: 15px; color: #1E293B; }
.ap-voile small { font-size: 12.5px; color: #475569; max-width: 34ch; }

/* ---- Démarrage de l'essai (carte requise, aucun débit avant la fin) ---- */
.essai-gate { min-height: 100vh; display: grid; place-items: center; padding: 32px 16px; background: radial-gradient(circle at 20% 0%, #FEF3C7 0, transparent 45%), #FDF3E7; }
.eg-carte { width: min(760px, 100%); display: grid; gap: 18px; padding: clamp(20px, 4vw, 34px); border-radius: 24px; background: #FFFFFF; border: 1px solid #F3E2CB; box-shadow: 0 30px 70px -40px rgba(154, 68, 38, .55); }
.eg-head { display: flex; align-items: center; gap: 16px; }
.eg-masc { width: 104px; margin: 0; flex: none; }
.eg-head h1 { margin: 2px 0 6px; font: 800 clamp(24px, 3.4vw, 32px)/1.15 "Plus Jakarta Sans", Inter, sans-serif; color: #AA5231; letter-spacing: -.02em; text-wrap: balance; }
.eg-sous { margin: 0; color: #475569; }
.eg-formules { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 12px; }
.eg-f { position: relative; display: grid; gap: 8px; padding: 16px 16px 14px 44px; border-radius: 16px; border: 2px solid #EADBC8; background: #FFFCF8; cursor: pointer; }
.eg-f.on { border-color: #FBBF24; background: #FFFFFF; box-shadow: 0 14px 30px -22px rgba(194, 94, 56, .6); }
.eg-f input { position: absolute; left: 16px; top: 19px; width: 18px; height: 18px; accent-color: #C25E38; }
.eg-f-top { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; }
.eg-f-top > b { font-size: 16px; color: #1E293B; }
.eg-f-top span { color: #475569; font-size: 13px; }
.eg-f-top span b { font-size: 20px; color: #1E293B; }
.eg-f ul { margin: 0; padding-left: 18px; display: grid; gap: 3px; font-size: 13px; color: #334155; }
.eg-recap { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1px; border-radius: 16px; overflow: hidden; background: #F3E2CB; border: 1px solid #F3E2CB; }
.eg-recap > div { display: grid; gap: 2px; padding: 12px 14px; background: #FDF3E7; }
.eg-recap span { font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: #726B64; }
.eg-recap b { font: 800 20px/1.1 var(--f-friendly, Inter), system-ui, sans-serif; color: #1E293B; }
.eg-recap > div:first-child b { color: #2E7958; }
.eg-recap small { font-size: 12px; color: #475569; }
.eg-note { margin: 0; font-size: 13px; line-height: 1.55; color: #475569; text-align: center; }
.eg-liens { margin: 0; text-align: center; }
#eg-ok { background: #FBBF24; color: #1E293B; border-color: #FBBF24; font-size: 16.5px; }
.lp-plan-essai { margin: 0; font-size: 12.5px; line-height: 1.45; color: #475569; text-align: center; }
.wz-essai { margin: 8px 0 0; padding: 10px 12px; border-radius: 12px; background: #FEF3C7; color: #78350F; font-size: 13px; line-height: 1.5; }
@media (max-width: 600px) { .eg-head { flex-direction: column; align-items: flex-start; } .eg-masc { width: 84px; } .eg-recap { grid-template-columns: minmax(0, 1fr); } }

/* ---- Mot de passe oublié, confirmation d'adresse ---- */
.gate-oubli { margin: 6px 0 0; text-align: center; }
.gate-ok { padding: 12px 14px; border-radius: 12px; background: #F0FDF4; border: 1px solid #BBF7D0; color: #166534; font-size: 14px; line-height: 1.5; }
.verif-banner { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 16px; margin: 12px clamp(16px, 3vw, 40px) 0; padding: 12px 16px; border-radius: 14px; background: #FEF3C7; border: 1px solid #FDE68A; color: #78350F; font-size: 14px; }
.verif-banner[hidden] { display: none; }
.sig-reprise-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.al-grille { display: grid; gap: 10px; }
.al-ligne { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 12px 14px; border-radius: 12px; background: #FFFCF8; border: 1px solid #F3E8DC; cursor: pointer; }
.al-ligne b { display: block; font-size: 14px; color: #1E293B; }
.al-ligne small { display: block; font-size: 12.5px; color: #64748B; }
.al-ligne select { padding: 7px 10px; border-radius: 9px; border: 1px solid #E2D6C7; background: #fff; font: 14px Inter, system-ui, sans-serif; }
.al-note { margin: 4px 0 0; padding: 10px 12px; border-radius: 10px; background: #FEF3C7; color: #78350F; font-size: 13px; }
.cg-reponses { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 14px; margin: 0 0 12px; padding: 10px 12px; border-radius: 12px; background: #FDF3E7; font-size: 13px; color: #475569; }
.cg-reponses:empty { display: none; }
.fi-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin: 8px 0 0; }
.pro-demandes { padding: 18px; margin-bottom: 16px; }
.pro-demandes h3 { margin: 0 0 10px; }
.pd-liste, .pc-boite { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.pd-liste li, .pc-boite li { display: grid; grid-template-columns: 130px minmax(0, 1fr); gap: 12px; font-size: 13.5px; padding: 8px 0; border-bottom: 1px dashed #EADBC8; }
.pd-liste small, .pc-boite small { display: block; color: #64748B; }
.pd-liste a, .pc-boite a { color: #9A4426; }
.pc-boite pre { white-space: pre-wrap; word-break: break-word; margin: 6px 0 0; padding: 10px; border-radius: 10px; background: #FFFCF8; border: 1px solid #F3E8DC; font: 12.5px/1.5 Inter, system-ui, sans-serif; color: #334155; max-height: 220px; overflow: auto; }
.ps-card select { width: 100%; padding: 9px 11px; border-radius: 10px; border: 1px solid #E2D6C7; background: #fff; font: 14px Inter, system-ui, sans-serif; }
@media (max-width: 640px) { .pd-liste li, .pc-boite li { grid-template-columns: minmax(0, 1fr); } }
.lp-demo { background: #FDF3E7; }
.lp-demo-grille { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: 32px; align-items: center; text-align: left; }
.lp-demo-txt h2 { margin: 4px 0 10px; }
.lp-demo-txt p { color: #475569; }
.lp-demo-points { list-style: none; margin: 14px 0 0; padding: 0; display: grid; gap: 8px; }
.lp-demo-points li { padding-left: 26px; position: relative; color: #1E293B; }
.lp-demo-points li::before { content: "✓"; position: absolute; left: 0; width: 18px; height: 18px; border-radius: 50%; background: #DCFCE7; color: #166534; font-size: 11px; font-weight: 800; display: grid; place-items: center; top: 2px; }
.lp-demo-form { display: grid; gap: 8px; padding: 22px; border-radius: 20px; background: #FFFFFF; border: 1px solid #F3E2CB; box-shadow: 0 22px 44px -30px rgba(194, 94, 56, .5); }
.lp-demo-form input, .lp-demo-form textarea { width: 100%; box-sizing: border-box; padding: 10px 12px; border-radius: 10px; border: 1px solid #E2D6C7; background: #FFFCF8; font: 14.5px Inter, system-ui, sans-serif; }
.lp-demo-form .small a { color: #9A4426; }
.lp-demo-form .btn-block { white-space: normal; } /* « Envoyer ma demande de démonstration » passe à la ligne à 390 px */
@media (max-width: 860px) { .lp-demo-grille { grid-template-columns: minmax(0, 1fr); } }
.fa-etapes { margin: 0 0 6px; padding-left: 20px; display: grid; gap: 8px; font-size: 13.5px; color: #334155; } .fa-etapes a { color: #9A4426; }
.lp-produit { background: #FFFFFF; }
.pr-onglets { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin: 0 0 18px; }
.pr-onglets button { padding: 9px 16px; border-radius: 999px; border: 1px solid #EADBC8; background: #FFFCF8; font: 700 14px Inter, system-ui, sans-serif; color: #475569; cursor: pointer; }
.pr-onglets button[aria-selected="true"] { background: #FEF3C7; border-color: #FBBF24; color: #78350F; }
.pr-cadre { margin: 0 auto; max-width: 1040px; }
.pr-cadre img { display: block; width: 100%; height: auto; border-radius: 18px; border: 1px solid #EADBC8; box-shadow: 0 30px 60px -36px rgba(154, 68, 38, .55); }
.pr-cadre figcaption { margin-top: 14px; color: #475569; font-size: 14.5px; }
.lp-demo-txt, .lp-demo-txt h2, .lp-demo-txt .lp-kicker { text-align: left; }

/* ===== Écran de verrouillage : essai terminé / abonnement arrêté ===== */
.paywall { position: relative; min-height: 100vh; display: grid; place-items: center; padding: 40px 16px; overflow: hidden;
  background: radial-gradient(circle at 12% 8%, #FDE7D6 0, transparent 42%), radial-gradient(circle at 88% 14%, #EDE4FB 0, transparent 40%),
              radial-gradient(circle at 70% 96%, #DDF3EC 0, transparent 45%), radial-gradient(circle at 8% 90%, #FEF3C7 0, transparent 38%), #FFF9F3; }
.pw-bulles i { position: absolute; border-radius: 50%; filter: blur(2px); opacity: .55; animation: pw-flotte 14s ease-in-out infinite alternate; }
.pw-bulles i:nth-child(1) { width: 180px; height: 180px; left: -40px; top: 30%; background: #F9D3C2; }
.pw-bulles i:nth-child(2) { width: 120px; height: 120px; right: 6%; top: 8%; background: #DCCFF6; animation-delay: -5s; }
.pw-bulles i:nth-child(3) { width: 150px; height: 150px; right: -30px; bottom: 6%; background: #C9EBDF; animation-delay: -9s; }
@keyframes pw-flotte { to { transform: translate(18px, -22px) scale(1.06); } }
@media (prefers-reduced-motion: reduce) { .pw-bulles i { animation: none; } }
.pw-carte { position: relative; width: min(780px, 100%); display: grid; gap: 18px; padding: clamp(20px, 4vw, 36px); border-radius: 28px;
  background: rgba(255, 255, 255, .88); backdrop-filter: blur(10px); border: 1px solid #F1E4D6; box-shadow: 0 34px 80px -46px rgba(122, 76, 160, .45), 0 20px 50px -40px rgba(194, 94, 56, .5); }
.pw-head { display: flex; align-items: center; gap: 18px; }
.pw-cadenas { width: 108px; height: 108px; flex: none; }
.pw-badge { display: inline-block; margin: 0 0 6px; padding: 4px 12px; border-radius: 999px; background: #EDE4FB; color: #5B3F8C; font-size: 12px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.pw-head h1 { margin: 0 0 6px; font: 800 clamp(24px, 3.6vw, 34px)/1.12 "Plus Jakarta Sans", Inter, sans-serif; color: #A14E2F; letter-spacing: -.02em; text-wrap: balance; }
.pw-sous { margin: 0; color: #475569; max-width: 58ch; }
.pw-conserve { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.pw-conserve > div { display: grid; gap: 2px; padding: 14px 16px; border-radius: 18px; }
.pw-conserve > div:nth-child(1) { background: #FDEBDD; }
.pw-conserve > div:nth-child(2) { background: #E3F4EE; }
.pw-conserve > div:nth-child(3) { background: #F0EAFB; }
.pw-conserve b { font: 800 26px/1.05 "Plus Jakarta Sans", Inter, sans-serif; color: #1E293B; font-variant-numeric: tabular-nums; }
.pw-conserve b i { font-style: normal; font-size: 15px; color: #4B5563; margin-left: 1px; }
.pw-conserve span { font-weight: 700; color: #334155; font-size: 14px; }
.pw-conserve small { color: #5B6472; font-size: 12.5px; }
.pw-formules { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 12px; }
.pw-garanties { list-style: none; margin: -6px 0 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; gap: 6px 18px; color: #5B6472; font-size: 13px; }
.pw-note { margin: 0; text-align: center; color: #5B6472; font-size: 13px; }
@media (max-width: 620px) {
  .pw-head { flex-direction: column; align-items: flex-start; gap: 10px; }
  .pw-cadenas { width: 76px; height: 76px; }
  .pw-conserve { grid-template-columns: 1fr; }
}

/* ===== Réglages → Notifications & alertes ===== */
#alertes-corps { display: grid; gap: 18px; }
.nt-bloc { display: grid; gap: 10px; }
.nt-titre { margin: 0; display: flex; align-items: center; gap: 8px; font: 700 15px/1.3 "Plus Jakarta Sans", Inter, sans-serif; color: #1E293B; }
.nt-titre small { font-weight: 500; font-size: 12.5px; }
.al-ligne.nt-principal { background: #FDF3E7; border-color: #F3D9BF; }
.al-ligne > span:first-child { min-width: 0; }
.nt-seg { display: inline-flex; flex: none; padding: 3px; border-radius: 999px; background: #F3EBE1; }
.nt-seg label { position: relative; padding: 6px 12px; border-radius: 999px; font-size: 13px; font-weight: 600; color: #5B6472; cursor: pointer; white-space: nowrap; }
.nt-seg label.on { background: #fff; color: #A14E2F; box-shadow: 0 2px 6px -2px rgba(120, 60, 30, .3); }
.nt-seg input { position: absolute; opacity: 0; inset: 0; margin: 0; cursor: pointer; }
.nt-seg label:has(input:focus-visible) { outline: 2px solid #C25E38; outline-offset: 2px; }
.nt-seg label:has(input:disabled) { opacity: .55; cursor: not-allowed; }
.nt-apercu-l { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; }
.nt-apercu { padding: 14px 16px; border-radius: 14px; background: #F0F9F6; border: 1px solid #CDEBDF; display: grid; gap: 8px; }
.nt-apercu p { margin: 0; font-size: 13.5px; color: #1F4D3F; }
.nt-sous { font-weight: 700; font-size: 12px !important; text-transform: uppercase; letter-spacing: .06em; color: #47695C !important; }
.nt-liste { margin: 0; padding: 0; list-style: none; display: grid; gap: 6px; }
.nt-liste li { display: grid; gap: 1px; font-size: 13.5px; color: #1E293B; }
.nt-liste li .link-btn { text-align: left; font-size: 13.5px; }
.nt-liste small { color: #5B6472; font-size: 12.5px; }
.nt-vide { margin: 0; padding: 12px 14px; border-radius: 12px; background: #F8F5F1; color: #475569; font-size: 13.5px; }
@media (max-width: 620px) {
  .al-ligne:has(.nt-seg) { flex-direction: column; align-items: flex-start; }
}

/* ===== Fiche opportunité : conseils du Bid-Copilot ===== */
.mk-ia { padding: 18px; border-radius: 18px; background: linear-gradient(135deg, #FFF8EE 0%, #F6F1FD 100%); border: 1px solid #EFE2D2; }
.mk-ia-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; margin-bottom: 12px; }
.mk-ia-head h3 { margin: 2px 0 0; font: 700 17px/1.25 "Plus Jakarta Sans", Inter, sans-serif; color: #1E293B; }
.mk-ia-head .eyebrow { margin: 0; }
.ia-intro { display: grid; gap: 12px; justify-items: start; }
.ia-promesse { margin: 0; padding: 0; list-style: none; display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 8px; width: 100%; }
.ia-promesse li { padding: 10px 12px; border-radius: 12px; background: rgba(255, 255, 255, .8); border: 1px solid #EFE6DA; font-size: 13.5px; color: #334155; }
.ia-promesse b { color: #1E293B; }
.ia-consent { display: flex; gap: 10px; align-items: flex-start; font-size: 13px; color: #475569; max-width: 70ch; }
.ia-consent input { margin-top: 3px; accent-color: #C25E38; width: 16px; height: 16px; flex: none; }
.ia-attente { display: flex; gap: 12px; align-items: center; padding: 12px 14px; border-radius: 14px; background: #fff; border: 1px solid #EFE6DA; }
.ia-attente b { display: block; font-size: 14px; color: #1E293B; }
.ia-attente small { color: #64748B; font-size: 12.5px; }
.ia-pulse { width: 14px; height: 14px; border-radius: 50%; background: #C9A6E8; box-shadow: 0 0 0 0 rgba(201, 166, 232, .7); animation: ia-pulse 1.4s infinite; flex: none; }
@keyframes ia-pulse { 70% { box-shadow: 0 0 0 12px rgba(201, 166, 232, 0); } 100% { box-shadow: 0 0 0 0 rgba(201, 166, 232, 0); } }
.ia-squelette { display: grid; gap: 8px; margin-top: 12px; }
.ia-squelette i { display: block; height: 12px; border-radius: 6px; background: linear-gradient(90deg, #F1E9DF 0, #FBF6F0 50%, #F1E9DF 100%); background-size: 200% 100%; animation: ia-sq 1.3s linear infinite; }
.ia-squelette i:nth-child(2) { width: 84%; } .ia-squelette i:nth-child(3) { width: 62%; }
@keyframes ia-sq { to { background-position: -200% 0; } }
@media (prefers-reduced-motion: reduce) { .ia-pulse, .ia-squelette i { animation: none; } }
.ia-verdict { display: flex; gap: 12px; align-items: center; padding: 12px 14px; border-radius: 14px; background: #fff; border: 1px solid #EFE6DA; }
.ia-verdict p { margin: 0; font-size: 14px; color: #334155; }
.ia-decision { flex: none; padding: 5px 12px; border-radius: 999px; font-weight: 800; font-size: 13px; letter-spacing: .02em; }
.ia-verdict.go .ia-decision { background: #DDF3EC; color: #1F6B52; }
.ia-verdict.etudier .ia-decision { background: #FEF3C7; color: #7A4B06; }
.ia-verdict.nogo .ia-decision { background: #FCE4E0; color: #9B2C22; }
.ia-synthese { margin: 12px 0; font-size: 14px; line-height: 1.6; color: #334155; max-width: 75ch; }
.ia-cols { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-top: 12px; }
.ia-col { padding: 12px 14px; border-radius: 14px; }
.ia-col.pos { background: #EEF8F4; } .ia-col.neg { background: #FDF0EC; }
.ia-col h4, .ia-h { margin: 0 0 8px; font: 700 13px/1.3 Inter, system-ui, sans-serif; text-transform: uppercase; letter-spacing: .06em; color: #5B6472; }
.ia-h { margin-top: 16px; }
.ia-col ul, .ia-check { margin: 0; padding-left: 18px; display: grid; gap: 5px; font-size: 13.5px; color: #334155; }
.ia-strat { margin: 0; padding: 0; list-style: none; counter-reset: s; display: grid; gap: 8px; }
.ia-strat li { counter-increment: s; position: relative; padding: 10px 12px 10px 46px; border-radius: 12px; background: #fff; border: 1px solid #EFE6DA; }
.ia-strat li::before { content: counter(s); position: absolute; left: 12px; top: 10px; width: 24px; height: 24px; border-radius: 50%; display: grid; place-items: center; background: #EDE4FB; color: #5B3F8C; font-weight: 800; font-size: 13px; }
.ia-strat b { font-size: 14px; color: #1E293B; }
.ia-strat p { margin: 2px 0 0; font-size: 13.5px; color: #475569; }
.ia-crit { width: 100%; border-collapse: collapse; font-size: 13.5px; background: #fff; border-radius: 12px; overflow: hidden; }
.ia-crit th { text-align: left; padding: 8px 10px; font-size: 12px; text-transform: uppercase; letter-spacing: .05em; color: #5B6472; background: #F8F3EC; }
.ia-crit td { padding: 9px 10px; border-top: 1px solid #F1E9DF; vertical-align: top; color: #334155; }
.ia-crit td.num { white-space: nowrap; font-variant-numeric: tabular-nums; }
.ia-plan { margin: 0; padding: 0; list-style: none; display: grid; gap: 6px; border-left: 2px solid #E5D7F5; padding-left: 12px; }
.ia-plan li { font-size: 13.5px; color: #334155; }
.ia-plan span { display: block; font-size: 12px; font-weight: 700; color: #7A5BA8; font-variant-numeric: tabular-nums; }
.ia-pied { margin: 14px 0 0; font-size: 12.5px; color: #64748B; }
.mk-charge { margin: 0; }
@media (max-width: 620px) { .ia-cols { grid-template-columns: 1fr; } .ia-verdict { flex-direction: column; align-items: flex-start; } }

/* ===== Fiche opportunité : texte complet de l'avis ===== */
.mk-avis { display: grid; gap: 12px; }
.mk-avis-faits { margin: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 8px; }
.mk-avis-faits div { padding: 8px 10px; border-radius: 10px; background: #F8F5F1; }
.mk-avis-faits span { display: block; font-size: 11.5px; text-transform: uppercase; letter-spacing: .05em; color: #64748B; }
.mk-avis-faits b { font-size: 13.5px; color: #1E293B; }
.mk-avis-s h4 { margin: 0 0 4px; font-size: 13.5px; color: #1E293B; }
.mk-avis-s p { margin: 0; font-size: 13.5px; line-height: 1.6; color: #334155; white-space: pre-line; max-width: 80ch; }
.mk-avis-int { border: 1px solid #EFE6DA; border-radius: 12px; background: #FFFCF8; }
.mk-avis-int summary { cursor: pointer; padding: 10px 12px; font-weight: 600; font-size: 13.5px; color: #1E293B; }
.mk-avis-int summary small { font-weight: 400; color: #64748B; margin-left: 6px; }
.mk-avis-texte { max-height: 340px; overflow: auto; padding: 0 12px 12px; font-size: 13px; line-height: 1.6; color: #334155; white-space: pre-line; overflow-wrap: anywhere; }
.mk-avis-pied { margin: 0; font-size: 12.5px; color: #64748B; }

/* Contrastes (fiche opportunité, réglages) */
.crit.na .crit-pct { color: #7A6F63; }
.why-row .star { color: #8A5A00; }
.kw-detail summary { color: #1F6F6D; }
.al-ligne.nt-principal small { color: #5B6472; }
.paywall { grid-template-columns: minmax(0, 1fr); justify-items: center; }
.pw-carte { min-width: 0; }
.pw-formules { grid-template-columns: repeat(auto-fit, minmax(min(240px, 100%), 1fr)); }
.pw-carte { grid-template-columns: minmax(0, 1fr); }
#pw-ok { white-space: normal; text-wrap: balance; }
/* Tiroirs : la grille ne doit jamais s'élargir au-delà du tiroir (mobile) */
.drawer-inner { grid-template-columns: minmax(0, 1fr); }
.mk-section { grid-template-columns: minmax(0, 1fr); }
.mk-section > * { min-width: 0; }
@media (max-width: 620px) { .mk-ia { padding: 14px; } .mk-ia-head { flex-wrap: wrap; } }

/* Correctif mobile : la frise de la veille amont (1 404 px) élargissait toute la page à 390 px de large.
   Un élément de grille garde par défaut la largeur minimale de son contenu : on l'autorise à rétrécir,
   et c'est la frise elle-même qui défile horizontalement. */
.am-timeline-card { grid-template-columns: minmax(0, 1fr); min-width: 0; }
.am-timeline { min-width: 0; max-width: 100%; }
/* Correctif mobile : les actions d'un signal amont (« Source officielle », « Écarter »…) étaient alignées sur une
   seule ligne et dépassaient de l'écran ; elles passent à la ligne. */
@media (max-width: 720px) { .sig-actions { display: flex; flex-wrap: wrap; gap: 6px 14px; justify-content: flex-start; align-items: center; } }

/* ================================================================== */
/* Accueil : cartes sous l'aperçu et section « Chiffres clés »          */
/* Bloc dédié, placé en fin de fichier pour l'emporter sur les règles   */
/* précédentes (.pastel-proof, .hero-stats, .kpis-pub).                 */
/* Couleurs : charte uniquement (terracotta, bleu nuit, soleil,         */
/* sarcelle, crème ; textes #1E293B / #475569).                         */
/* ================================================================== */

/* ---- Cartes du hero (ul.pastel-proof.hero-stats) ----
   Grille : 4 colonnes, 2 sous 1 100 px, 1 sous 640 px.
   Chaque carte occupe 4 rangées en sous-grille (icône, valeur, titre, description) :
   valeurs, titres et descriptions tombent sur les mêmes lignes d'une carte à l'autre,
   et toutes les cartes d'une rangée ont la même hauteur. */
.gate-hero .hero-stats { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; width: 100%; max-width: 1180px; margin: 14px auto 0; perspective: none; }
.gate-hero .hero-stats > li.tilt {
  grid-row: span 4; display: grid; grid-template-rows: subgrid; grid-template-columns: minmax(0, 1fr); row-gap: 0; align-content: start;
  padding: 22px 20px 20px; background: #FFFFFF; border: 1px solid #F3E2CB; border-radius: 18px; box-shadow: 0 10px 26px -20px rgba(120, 72, 30, .45); text-align: left;
  /* Au repos : aucune inclinaison ni décalage. L'animation d'entrée ne fige plus rien une fois jouée. */
  transform: none; will-change: auto; animation-fill-mode: backwards;
  transition: transform .35s cubic-bezier(.2, .8, .2, 1), box-shadow .35s ease;
}
.gate-hero .hero-stats > li.tilt > * { align-self: start; min-width: 0; }
/* Survol : inclinaison discrète (variables --rx / --ry posées par app.js, atténuées de moitié) et léger soulèvement */
.gate-hero .hero-stats > li.tilt:hover {
  transform: perspective(900px) rotateX(calc(var(--rx, 0deg) * .5)) rotateY(calc(var(--ry, 0deg) * .5)) translateY(-3px);
  box-shadow: 0 20px 36px -24px rgba(120, 72, 30, .5);
}
/* Icône SVG au trait (stroke 1.75, currentColor) dans un carré arrondi teinté */
.gate-hero .hero-stats .pp-ico { width: 44px; height: 44px; margin: 0 0 16px; border-radius: 12px; display: grid; place-items: center; font-size: 0; }
.gate-hero .hero-stats > li.tilt:hover .pp-ico { transform: none; }
.gate-hero .hero-stats .pp-ico svg { display: block; width: 22px; height: 22px; }
.gate-hero .hero-stats .i1 { background: color-mix(in srgb, #C25E38 14%, #FFFFFF); color: #AA5231; }
.gate-hero .hero-stats .i2 { background: color-mix(in srgb, #2E7C74 14%, #FFFFFF); color: #2E7C74; }
.gate-hero .hero-stats .i3 { background: color-mix(in srgb, #FBBF24 24%, #FFFFFF); color: #1F3A4D; }
.gate-hero .hero-stats .i4 { background: color-mix(in srgb, #1F3A4D 11%, #FFFFFF); color: #1F3A4D; }
/* Hiérarchie : même taille pour toutes les valeurs, titre, puis description sur 2 lignes au plus */
.gate-hero .hero-stats strong { display: block; margin: 0 0 6px; font: 800 28px/1.1 "Plus Jakarta Sans", Inter, sans-serif; letter-spacing: -.03em; color: #AA5231; font-variant-numeric: tabular-nums; white-space: nowrap; }
.gate-hero .hero-stats b { display: block; margin: 0 0 6px; font: 700 15px/1.3 "Plus Jakarta Sans", Inter, sans-serif; color: #1E293B; }
.gate-hero .hero-stats .pp-desc {
  font-size: 13.5px; line-height: 1.5; color: #475569; text-wrap: pretty;
  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; overflow: hidden;
}
/* Entre 1 101 et 1 280 px, 4 colonnes étroites : cartes resserrées pour tenir les descriptions sur 2 lignes */
@media (min-width: 1101px) and (max-width: 1280px) {
  .gate-hero .hero-stats { gap: 10px; }
  .gate-hero .hero-stats > li.tilt { padding: 20px 14px 18px; }
  .gate-hero .hero-stats .pp-desc { font-size: 13px; text-wrap: wrap; }
}
@media (max-width: 1100px) { .gate-hero .hero-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) {
  .gate-hero .hero-stats { grid-template-columns: minmax(0, 1fr); gap: 12px; }
  .gate-hero .hero-stats > li.tilt { padding: 18px; }
}
@media (prefers-reduced-motion: reduce) {
  .gate-hero .hero-stats > li.tilt, .gate-hero .hero-stats > li.tilt:hover { transform: none; transition: box-shadow .2s ease; }
}

/* ---- Chiffres clés (section#chiffres, ul#kpis-pub) ----
   Titre, sous-titre, pastille et grille centrés dans le même conteneur (.lp-wrap) que les autres sections.
   La grille est en flex centré : elle reste équilibrée avec 2 cartes (chiffres BOAMP pas encore chargés)
   comme avec 4. */
.lp-sec.lp-preuves { padding-bottom: 56px; }
.lp-preuves .lp-wrap { display: flex; flex-direction: column; align-items: center; text-align: center; }
.lp-preuves .lp-sous { margin: 12px auto 0; text-align: center; }
/* « relevés le JJ/MM/AAAA » en pastille avec un point de couleur */
.lp-preuves .kp-maj { display: inline-flex; align-items: center; gap: 8px; margin: 14px auto 30px; padding: 6px 14px 6px 12px; border-radius: 999px; background: #FFFFFF; border: 1px solid #F3E2CB; font: 600 12.5px/1.2 Inter, system-ui, sans-serif; color: #475569; font-variant-numeric: tabular-nums; }
.lp-preuves .kp-maj-point { flex: none; width: 8px; height: 8px; border-radius: 50%; background: #C25E38; box-shadow: 0 0 0 3px color-mix(in srgb, #C25E38 18%, transparent); }
.lp-preuves .kpis-pub { --kp-gap: 16px; display: flex; flex-wrap: wrap; justify-content: center; gap: var(--kp-gap); width: 100%; max-width: 1180px; margin: 0 auto; }
/* Un seul style de carte : plus de bordures supérieures de couleurs différentes */
.lp-preuves .kpis-pub > li {
  flex: 0 1 calc((100% - 3 * var(--kp-gap)) / 4); min-width: 0;
  display: flex; flex-direction: column; align-items: center; gap: 0;
  padding: 24px 20px 22px; border: 1px solid #F3E2CB; border-radius: 20px; background: #FFFFFF; text-align: center;
  box-shadow: 0 10px 26px -22px rgba(120, 72, 30, .4);
}
/* Les cartes data-kpi-bloc restent masquées tant que app.js n'a pas reçu les vrais chiffres */
.lp-preuves .kpis-pub > li[hidden] { display: none; }
.lp-preuves .kpis-pub .kp-ico { flex: none; width: 40px; height: 40px; margin: 0 0 14px; border-radius: 12px; display: grid; place-items: center; background: color-mix(in srgb, #C25E38 12%, #FFFFFF); color: #AA5231; }
.lp-preuves .kpis-pub .kp-ico svg { display: block; width: 20px; height: 20px; }
.lp-preuves .kpis-pub b { margin: 0 0 8px; font: 800 34px/1.1 "Plus Jakarta Sans", Inter, sans-serif; letter-spacing: -.02em; color: #1F3A4D; font-variant-numeric: tabular-nums; white-space: nowrap; }
.lp-preuves .kpis-pub .kp-lib {
  max-width: 26ch; min-height: calc(2 * 1.45em); font-size: 14px; line-height: 1.45; color: #475569; text-wrap: balance;
  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; overflow: hidden;
}
.lp-preuves .kpis-pub .kp-note { margin-top: 12px; padding-top: 10px; text-wrap: balance; border-top: 1px solid #F3E2CB; font-size: 12px; line-height: 1.4; color: #475569; }
.lp-preuves .temoignages { width: 100%; }
@media (max-width: 900px) { .lp-preuves .kpis-pub > li { flex-basis: calc((100% - var(--kp-gap)) / 2); } }
@media (max-width: 520px) {
  .lp-preuves .kpis-pub { --kp-gap: 12px; }
  .lp-preuves .kpis-pub > li { flex-basis: 100%; padding: 20px 18px; }
  .lp-preuves .kpis-pub b { font-size: 30px; }
}

/* Icônes du thème en ligne (remplacent les emoji de l'interface) : taille relative au texte, trait 1,75 */
.ic-inline { width: 1.15em; height: 1.15em; flex: none; margin-right: .45em; vertical-align: -.2em; fill: none; stroke: currentColor; stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; }
/* Icône seule dans un médaillon ou un titre à espacement propre */
.sc-ico .ic-inline, .trust > span .ic-inline, .ap-cadenas .ic-inline, .oc-grp .ic-inline, .nt-titre .ic-inline { margin: 0; }
.sc-ico .ic-inline { width: 26px; height: 26px; color: #1F3A4D; }
.trust > span .ic-inline { width: 28px; height: 28px; color: #AA5231; }
.ap-cadenas .ic-inline { width: 22px; height: 22px; color: #1E293B; }
.cmp-row b .ic-inline { color: #AA5231; }

/* Offre de lancement (CIBLY_LANCEMENT=1) : mention discrète, encart sans grille tarifaire */
.mode-badge { display: inline-flex; align-items: center; align-self: center; padding: 3px 9px; border-radius: 99px; border: 1px solid #CBD5E1; background: #F8FAFC; color: #334155; font: 600 11.5px/1.3 Inter, system-ui, sans-serif; white-space: nowrap; }
.lp-nav .mode-badge { margin-right: auto; margin-left: 10px; }
.sidebar .mode-badge { margin: 0 8px 6px; align-self: flex-start; }
.mode-badge .bb-court { display: none; }
@media (max-width: 560px) {
  .lp-nav .mode-badge { margin-left: 6px; padding: 2px 7px; }
  .lp-nav .mode-badge .bb-long { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .lp-nav .mode-badge .bb-court { display: inline; }
}
.lp-gratuit .hero-cta { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 14px; }
.support-banner.acces-fin { background: #1E293B; }
.support-banner.acces-fin .btn-ghost { background: transparent; color: #FFFFFF; border-color: rgba(255, 255, 255, .6); }
.support-banner.acces-fin .btn-sun { margin-left: 0; }
.lp-tarifs-head.lp-gratuit { display: block; max-width: 720px; margin: 0 auto; text-align: center; }
.lp-tarifs-head.lp-gratuit p { margin-left: auto; margin-right: auto; }
.lp-gratuit .hero-cta { justify-content: center; }
.lp-gratuit .lp-kicker { justify-content: center; text-align: center; }

/* Chantier 14 : onglets choisis par le dirigeant, personne par personne ---------------------------------------- */
.nav-lecture { margin-left: auto; padding: 0 7px; border: 1px solid #475569; border-radius: 999px; font: 600 10.5px Inter, system-ui, sans-serif; color: #94A3B8; }
.ro-banner { display: flex; gap: 10px; align-items: baseline; flex-wrap: wrap; margin: 0 clamp(16px, 3vw, 40px) 12px; padding: 10px 14px; border-radius: 12px; background: #1E293B; color: #fff; font-size: 13.5px; }
.ro-banner b { color: #FBBF24; }
.view.lecture-seule #btn-new-opp, .view.lecture-seule #btn-rules, .view.lecture-seule #btn-signature, .view.lecture-seule #am-refresh,
.view.lecture-seule #am-doc-btn, .view.lecture-seule #rfv-add, .view.lecture-seule #rfv-import, .view.lecture-seule #tk-refresh,
.view.lecture-seule #btn-scan, body.sans-suivi [data-track], body.sans-scan [data-scan] { display: none !important; }
.view.lecture-seule .tk input[type="checkbox"] { pointer-events: none; opacity: .5; }
#rg-equipe { display: grid; gap: 18px; min-width: 0; grid-template-columns: minmax(0, 1fr); }
#rg-equipe > *, #dr-corps, .dr-table-wrap { min-width: 0; max-width: 100%; }
#rg-equipe[hidden] { display: none; }
.dr-bandeau { display: flex; gap: 12px; align-items: center; justify-content: space-between; flex-wrap: wrap; background: #E6F2F1; border: 1px solid #BFDCD9; border-radius: 12px; padding: 12px 14px; font-size: 13.5px; }
.dr-legende { display: flex; gap: 16px; flex-wrap: wrap; align-items: center; font-size: 12.5px; color: #726B64; margin-bottom: 10px; }
.dr-legende > span { display: inline-flex; align-items: center; gap: 6px; }
.dr-legende .dr-lm { flex-direction: row; }
.dr-table-wrap { overflow-x: auto; border: 1px solid #F1E7DA; border-radius: 12px; }
.dr-table { border-collapse: separate; border-spacing: 0; width: 100%; min-width: 1280px; }
.dr-table th, .dr-table td { padding: 10px 8px; border-bottom: 1px solid #F1E7DA; text-align: center; vertical-align: middle; font-size: 13px; }
.dr-table thead th { background: #FBF6EF; font-size: 11.5px; font-weight: 700; color: #4B5563; line-height: 1.25; }
.dr-table thead tr:last-child th:not(.dr-col-pers) { min-width: 76px; }
.dr-table thead th.dr-sec { font-size: 10.5px; letter-spacing: .06em; text-transform: uppercase; color: #726B64; padding: 6px 8px; border-bottom: 0; }
.dr-table .dr-col-pers { text-align: left; position: sticky; left: 0; background: #fff; z-index: 1; min-width: 250px; box-shadow: 1px 0 0 #F1E7DA; font-weight: 400; }
.dr-table thead .dr-col-pers { background: #FBF6EF; z-index: 2; }
.dr-table tr.dr-moi > * { background: #FFFBF3; }
.dr-table tr.dr-change > * { background: #F2F8F7; }
.dr-pers { display: grid; grid-template-columns: 36px minmax(0, 1fr); gap: 10px; align-items: center; text-align: left; }
.dr-pers .avatar { width: 36px; height: 36px; font-size: 13px; }
.dr-pers b { display: block; font-size: 14px; color: #1E293B; }
.dr-pers small { display: block; color: #726B64; font-size: 12px; overflow-wrap: anywhere; }
.dr-statut { margin-top: 6px; font: 600 12.5px Inter, system-ui, sans-serif; border: 1px solid #DCD2C3; border-radius: 8px; padding: 4px 6px; background: #fff; color: #1E293B; min-height: 32px; }
.dr-cadenas { display: block; margin-top: 4px; font-size: 11.5px; color: #726B64; }
.dr-cell { display: grid; gap: 5px; justify-items: center; }
.dr-case { width: 22px; height: 22px; accent-color: #267675; cursor: pointer; margin: 0; }
.dr-lm { display: inline-flex; flex-direction: column; border: 1px solid #D5CABB; border-radius: 7px; overflow: hidden; }
.dr-lm button { border: 0; background: #fff; padding: 3px 8px; min-width: 64px; font: 700 11px Inter, system-ui, sans-serif; color: #5E5850; cursor: pointer; }
.dr-lm button + button { border-top: 1px solid #D5CABB; }
.dr-legende .dr-lm button + button { border-top: 0; border-left: 1px solid #D5CABB; }
.dr-lm button[aria-pressed="true"] { background: #267675; color: #fff; }
.dr-lm button:focus-visible { outline: 3px solid #1E293B; outline-offset: -3px; }
.dr-masque { font-size: 11px; color: #8A8178; }
.dr-reserve { font-size: 11px; font-weight: 700; color: #9A4426; background: #FBEDE6; border-radius: 999px; padding: 3px 8px; white-space: nowrap; }
.dr-reserve.non { color: #6B635B; background: #F3EEE6; font-weight: 600; }
.dr-perim { display: inline-flex; gap: 6px; align-items: flex-start; text-align: left; font-size: 12px; color: #4B5563; min-width: 150px; line-height: 1.3; }
.dr-perim + small { display: block; max-width: 180px; text-align: left; font-size: 11.5px; margin-top: 4px; }
.dr-actions { display: grid; gap: 4px; justify-items: start; text-align: left; }
.dr-actions .link-btn { font-size: 12.5px; white-space: nowrap; }
.dr-cartes { display: none; }
.dr-carte { border: 1px solid #EADBC8; border-radius: 14px; overflow: hidden; background: #fff; }
.dr-carte summary { list-style: none; cursor: pointer; padding: 12px; background: #FBF6EF; min-height: 48px; }
.dr-carte summary::-webkit-details-marker { display: none; }
.dr-carte-statut { padding: 10px 12px; display: grid; gap: 4px; font-size: 13px; }
.dr-carte-statut label { display: flex; gap: 8px; align-items: center; font-weight: 600; }
.dr-carte-statut .dr-statut { margin-top: 0; }
.dr-carte ul { list-style: none; margin: 0; padding: 0; }
.dr-carte li { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; align-items: center; padding: 8px 12px; border-top: 1px solid #F1E7DA; min-height: 48px; font-size: 14px; }
.dr-carte li label { display: flex; align-items: center; gap: 10px; }
.dr-carte .dr-lm { flex-direction: row; }
.dr-carte .dr-lm button { min-height: 36px; min-width: 56px; }
.dr-carte .dr-lm button + button { border-top: 0; border-left: 1px solid #D5CABB; }
.dr-carte-pied { padding: 10px 12px; border-top: 1px solid #EADBC8; display: grid; gap: 10px; }
.dr-carte-pied .dr-actions { grid-auto-flow: row; }
.dr-carte-pied .dr-actions .link-btn { min-height: 32px; }
.dr-bas { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 18px; align-items: start; }
.dr-modeles { display: flex; flex-wrap: wrap; gap: 8px; }
.dr-modele { border: 1px solid #EADBC8; border-radius: 12px; padding: 10px 12px; display: grid; gap: 4px; flex: 1 1 200px; }
.dr-modele small { color: #726B64; font-size: 12px; }
.dr-journal { width: 100%; border-collapse: collapse; font-size: 13px; }
.dr-journal th { text-align: left; font-size: 11.5px; color: #726B64; font-weight: 700; padding: 6px 8px; border-bottom: 1px solid #EADBC8; }
.dr-journal td { padding: 8px; border-bottom: 1px solid #F1E7DA; vertical-align: top; }
.dr-journal td:first-child { white-space: nowrap; color: #726B64; }
.dr-apercu { display: grid; grid-template-columns: 220px minmax(0, 1fr); border: 1px solid #EADBC8; border-radius: 14px; overflow: hidden; }
.ap-sb { background: #1E293B; padding: 14px 10px; display: grid; gap: 2px; align-content: start; font-size: 13px; }
.ap-sep { font-size: 10px; letter-spacing: .08em; text-transform: uppercase; color: #94A3B8; margin: 10px 8px 2px; }
.ap-lien { display: flex; justify-content: space-between; gap: 6px; padding: 7px 8px; border-radius: 8px; color: #E2E8F0; }
.ap-lien i { font-style: normal; font-size: 10.5px; color: #CBD5E1; border: 1px solid #64748B; border-radius: 999px; padding: 0 6px; }
.ap-corps { padding: 16px; display: grid; gap: 10px; align-content: start; background: #FDF8F1; }
.ap-bandeau { margin: 0; background: #1E293B; color: #fff; border-radius: 10px; padding: 9px 12px; font-size: 13px; }
.ap-liste { margin: 0; padding-left: 18px; display: grid; gap: 6px; font-size: 13.5px; }
.dr-choix { border: 0; padding: 0; margin: 0; display: grid; gap: 6px; }
.dr-choix label { display: flex; gap: 8px; align-items: center; min-height: 36px; }
.mes-onglets-bloc { display: grid; gap: 8px; margin: 4px 0 12px; }
.mes-onglets-bloc h4 { margin: 0; }
.mes-onglets { display: flex; flex-wrap: wrap; gap: 6px; }
.mes-onglets span { border: 1px solid #EADBC8; border-radius: 999px; padding: 4px 10px; font-size: 12.5px; background: #fff; }
.mes-onglets em { font-style: normal; color: #726B64; }
@media (max-width: 900px) { .dr-bas { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 760px) {
  .dr-table-wrap { display: none; }
  .dr-cartes { display: grid; gap: 12px; }
  .dr-apercu { grid-template-columns: minmax(0, 1fr); }
  .ap-sb { grid-template-columns: 1fr 1fr; }
  .ap-sep { grid-column: 1 / -1; }
  .dr-journal th:nth-child(2), .dr-journal td:nth-child(2) { display: none; }
}

/* Chantier 14b : mot de passe affichable et solidité (application et portail Pro) */
.mdp-boite { position: relative; display: block; }
.mdp-boite > input { width: 100%; padding-right: 46px; }
.mdp-oeil { position: absolute; top: 50%; right: 4px; transform: translateY(-50%); width: 38px; height: 38px; display: grid; place-items: center;
  border: 0; border-radius: 9px; background: none; color: #55606A; cursor: pointer; }
.mdp-oeil:hover { background: #FAF3EA; color: #1F3A4D; }
.mdp-oeil:focus-visible { outline: 2px solid #2E6E69; outline-offset: 1px; }
.mdp-oeil svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.mdp-jauge { display: grid; gap: 4px; margin-top: 6px; }
.mdp-barres { display: grid; grid-template-columns: repeat(4, 1fr); gap: 4px; }
.mdp-barres i { height: 5px; border-radius: 3px; background: #EADBC8; }
.mdp-jauge small { font-size: 12.5px; color: #55606A; line-height: 1.4; }
.mdp-jauge[data-niveau="0"] small { color: #A6342E; }
.mdp-jauge[data-niveau="1"] i:nth-child(-n+1) { background: #C2413A; }
.mdp-jauge[data-niveau="2"] i:nth-child(-n+2) { background: #B45309; }
.mdp-jauge[data-niveau="3"] i:nth-child(-n+3) { background: #2F7D5B; }
.mdp-jauge[data-niveau="4"] i { background: #23574F; }

/* Créer un compte : deux chemins ; choix de l'espace */
.gate-chemins { display: grid; gap: 10px; }
.gate-chemin { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 14px; align-items: start; text-align: left; width: 100%;
  border: 1px solid #E3CFB2; border-radius: 14px; background: #fff; padding: 16px; cursor: pointer; color: #1F3A4D; font: inherit; }
.gate-chemin:hover { border-color: #2E6E69; background: #F6FBFA; }
.gate-chemin:focus-visible { outline: 2px solid #2E6E69; outline-offset: 2px; }
.gate-chemin svg { width: 26px; height: 26px; color: #2E6E69; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; margin-top: 2px; }
.gate-chemin b { display: block; font-size: 15.5px; margin-bottom: 4px; }
.gate-chemin small { display: block; color: #55606A; font-size: 13.5px; line-height: 1.5; }
.gate-note { margin-top: 4px; }
.wz-rejoindre { margin: 0; }
.gate-espaces { display: grid; gap: 8px; }
.gate-espace { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 12px; align-items: center; width: 100%; text-align: left;
  border: 1px solid #E3CFB2; border-radius: 12px; background: #fff; padding: 10px 12px; min-height: 52px; cursor: pointer; font: inherit; color: #1F3A4D; }
.gate-espace:hover { border-color: #2E6E69; background: #F6FBFA; }
.gate-espace b { overflow-wrap: anywhere; }
.gate-espace small { color: #2E6E69; font-size: 12px; }
.gate-espace.actuel { cursor: default; background: #F6FBFA; border-color: #B9DCD5; }
.gate-espace-mono { width: 34px; height: 34px; border-radius: 9px; display: grid; place-items: center; background: #FDE7BC; font-weight: 700; font-size: 13px; }
.sb-espace { display: flex; align-items: center; gap: 8px; width: 100%; border: 1px solid #EDE6DA; border-radius: 10px; background: none; padding: 8px 10px;
  font: inherit; font-size: 13px; color: #475569; cursor: pointer; margin-bottom: 6px; }
.sb-espace:hover { background: #FAF6F0; color: #1E293B; }
.sb-espace svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }

/* Équipe & droits : demandes et invitations en attente, fenêtre d'invitation */
.dr-attente { border: 1px solid #EADBC8; border-radius: 14px; padding: 12px 14px; display: grid; gap: 8px; margin-bottom: 12px; background: #fff; }
.dr-demandes { background: #FDF8F1; border-color: #F2D7A8; }
.dr-attente h4 { margin: 0; display: flex; gap: 8px; align-items: center; }
.dr-attente p { margin: 0; }
.dr-attente ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.dr-att { display: flex; gap: 10px; justify-content: space-between; align-items: center; flex-wrap: wrap; border-top: 1px solid #F1E7DA; padding-top: 8px; }
.dr-att > div { display: grid; gap: 2px; min-width: 0; }
.dr-att small { color: #726B64; font-size: 12.5px; overflow-wrap: anywhere; }
.dr-nb { font: 700 11.5px var(--f-body); background: #1F3A4D; color: #fff; border-radius: 999px; padding: 1px 8px; }
.us-onglets { border: 0; margin: 0; padding: 0; }
.us-onglets ul { list-style: none; margin: 6px 0 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px 14px; }
.us-onglets li { display: flex; justify-content: space-between; align-items: center; gap: 8px; min-height: 40px; border-bottom: 1px solid #F1E7DA; }
.us-onglets label { display: flex; gap: 8px; align-items: center; font-size: 14px; }
.us-onglets select { width: auto; font-size: 13px; padding: 5px 28px 5px 8px; }
.us-onglets select:disabled { opacity: .45; }
.us-qui { margin: 0; padding: 10px 12px; border-radius: 12px; background: #FDF8F1; border: 1px solid #F2D7A8; }
@media (max-width: 560px) { .us-onglets ul { grid-template-columns: minmax(0, 1fr); } }
#user-modal { width: min(760px, calc(100% - 32px)); }
#user-modal .modal-inner, #user-form .form-grid { grid-template-columns: minmax(0, 1fr); }
#user-form .form-grid { max-height: calc(100dvh - 240px); overflow-y: auto; overscroll-behavior: contain; }
.sup-espaces { margin: 0 0 4px; padding-left: 18px; display: grid; gap: 4px; font-size: 14px; }
.sup-espaces small { color: #726B64; }
.sup-bloque { margin: 0; padding: 10px 12px; border-radius: 10px; background: #FEF3E2; border: 1px solid #F2D7A8; color: #7A3E0C; font-size: 13.5px; line-height: 1.5; }
#sup-ok:disabled { opacity: .45; cursor: not-allowed; box-shadow: none; }
.team-badge { font: 600 11px var(--f-body); font-style: normal; color: #726B64; border: 1px solid #E3CFB2; border-radius: 999px; padding: 1px 7px; margin-left: 6px; vertical-align: middle; }
.team-ancien b { color: #55606A; }

/* ------------------------------------------------------------------ */
/* Chantier 16 : vente sur devis, formulaire de demande, abonnement    */
/* ------------------------------------------------------------------ */
.lp-prixbox { flex: 0 0 280px; display: grid; gap: 10px; padding: 18px; border-radius: 18px; background: #FFFFFF; border: 2px solid #FBBF24; text-align: center; }
.lp-apartir { margin: 0; color: #64748B; font-size: 13px; }
.lp-apartir b { display: block; font: 800 30px/1.15 var(--f-friendly, Inter), system-ui, sans-serif; color: #1E293B; }
.lp-modules { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 12px; margin-top: 8px; }
.lp-mod { display: grid; gap: 4px; padding: 14px 16px; border-radius: 14px; background: #FFFFFF; border: 1px solid #F3E2CB; text-align: left; }
.lp-mod b { color: #1E293B; font-size: 15px; }
.lp-mod small { color: #64748B; font-size: 13px; line-height: 1.45; }
.lp-mod.avenir { border-style: dashed; background: transparent; }
.lp-mod.avenir b::after { content: " · bientôt"; color: #64748B; font-weight: 600; font-size: 12.5px; }
@media (max-width: 640px) { .lp-prixbox { flex-basis: auto; width: 100%; box-sizing: border-box; } }

.lp-demande-grille { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: 28px; align-items: start; text-align: left; }
.lp-demande-grille h2 { margin: 2px 0 6px; }
.dm-type { display: flex; flex-wrap: wrap; gap: 8px 18px; margin: 4px 0 6px; font-weight: 600; color: #1E293B; }
.dm-type label { display: inline-flex; align-items: center; gap: 6px; }
.lp-demo-form select { width: 100%; box-sizing: border-box; padding: 10px 12px; border-radius: 10px; border: 1px solid #E2D6C7; background: #FFFCF8; font: 14.5px Inter, system-ui, sans-serif; }
.dm-groupe { border: 0; padding: 0; margin: 4px 0 0; min-width: 0; }
.dm-puces { display: flex; flex-wrap: wrap; gap: 6px; }
.dm-puce { border: 1px solid #E2D6C7; background: #FFFCF8; border-radius: 999px; padding: 6px 12px; font: 600 13px Inter, system-ui, sans-serif; color: #475569; cursor: pointer; }
.dm-puce[aria-pressed="true"] { background: #E4F1EE; border-color: #8CC5BC; color: #134E4A; }
.dm-puce:focus-visible { outline: 3px solid #93C5FD; outline-offset: 2px; }
.dm-apercu { display: grid; gap: 10px; padding: 20px; border-radius: 20px; background: #FFFFFF; border: 1px solid #F3E2CB; position: sticky; top: 16px; }
.dm-apercu h3 { margin: 2px 0 0; font-size: 18px; color: #AA5231; }
.dm-apercu p { margin: 0; }
.dm-apercu .btn { justify-self: start; }
.dm-ap-tete { display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; flex-wrap: wrap; }
.dm-lecture { font-size: 12px; color: #64748B; border: 1px solid #E2D6C7; border-radius: 999px; padding: 3px 10px; white-space: nowrap; }
.dm-ap-liste { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.dm-ap-it { display: grid; grid-template-columns: 46px minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 10px 12px; border-radius: 12px; border: 1px solid #F1E7DA; background: #FFFCF8; }
.dm-ap-it b { display: block; font-size: 13.5px; color: #1E293B; overflow-wrap: anywhere; }
.dm-ap-it small { color: #64748B; font-size: 12px; }
.dm-note { width: 46px; height: 46px; border-radius: 50%; display: grid; place-items: center; background: conic-gradient(#2E6E69 calc(var(--n) * 10%), #EFE4D5 0); }
.dm-note span { width: 36px; height: 36px; border-radius: 50%; background: #FFFFFF; display: grid; place-items: center; font: 800 12.5px Inter, system-ui, sans-serif; color: #1E293B; }
.dm-dl { font-size: 12px; font-weight: 700; color: #AA5231; white-space: nowrap; }
.dm-ap-msg { color: #64748B; font-size: 13.5px; padding: 8px 0; }
@media (max-width: 860px) {
  .lp-demande-grille { grid-template-columns: 1fr; }
  .dm-apercu { position: static; }
  .dm-ap-it { grid-template-columns: 46px minmax(0, 1fr); }
  .dm-dl { grid-column: 2; white-space: normal; }
}
.lp-support { padding-top: 12px; }
.lp-support-carte { padding: 20px 22px; border-radius: 18px; background: #FFFFFF; border: 1px solid #F3E2CB; text-align: left; }
.lp-support-carte h2 { margin: 2px 0 6px; font-size: 22px; }
.lp-support-carte p { margin: 0; color: #475569; }
.lp-support-carte a { color: #9A4426; font-weight: 600; }

.abo-kv { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 10px; }
.abo-kv > div { padding: 10px 12px; border-radius: 12px; background: #FAF6F0; border: 1px solid #EDE6DA; display: grid; gap: 2px; }
.abo-kv small { color: #64748B; font-size: 12px; }
.abo-kv b { color: #1E293B; font-size: 14.5px; }
.abo-modules { display: flex; flex-wrap: wrap; gap: 6px; margin: 6px 0 4px; }
.abo-mod { border-radius: 999px; padding: 4px 11px; font-size: 13px; border: 1px solid #B9DCD5; background: #E4F1EE; color: #134E4A; font-weight: 600; }
.abo-mod.off { background: #F3EEE6; border-color: #EDE6DA; color: #8A8178; font-weight: 500; text-decoration: line-through; }
.abo-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.abo-resil-info { margin: 0; padding: 10px 14px; border-radius: 12px; background: #FFF7ED; border: 1px solid #F3C99B; color: #7C2D12; font-size: 13.5px; }
.abo-motifs { border: 0; padding: 0; margin: 0; display: grid; gap: 6px; }
.abo-motifs label { display: flex; gap: 8px; align-items: center; }
.abo-resil { margin: 0; padding: 10px 12px; border-radius: 10px; background: #FFF7ED; color: #7C2D12; }
.sb-avis { margin-bottom: 6px; }
.avis-notes { border: 0; padding: 0; margin: 0; }
.avis-boutons { display: flex; gap: 6px; flex-wrap: wrap; margin: 4px 0; }
.avis-boutons button { width: 44px; height: 44px; border-radius: 10px; border: 1px solid #DCD2C3; background: #FFFFFF; font: 700 15px Inter, system-ui, sans-serif; color: #1E293B; cursor: pointer; }
.avis-boutons button[aria-checked="true"] { background: #2E6E69; border-color: #2E6E69; color: #FFFFFF; }

/* Portail Pro : demandes, devis, vente et éditeur, avis (chantier 16) */
.po-filtres { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 12px; }
.po-filtres button { border: 1px solid #EDE6DA; background: #FFFFFF; border-radius: 999px; padding: 5px 12px; font: 600 12.5px Inter, system-ui, sans-serif; color: #475569; cursor: pointer; }
.po-filtres button[aria-pressed="true"] { background: #1E293B; border-color: #1E293B; color: #FFFFFF; }
.po-deux { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 16px; align-items: start; }
.po-liste tr.sel td { background: #FFFBF3; }
.po-fiche, .po-editeur { display: grid; gap: 10px; }
.po-tete { display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; flex-wrap: wrap; }
.po-tete h3 { margin: 2px 0; color: #AA5231; }
.po-recap { display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 4px 12px; margin: 0; font-size: 13.5px; }
.po-recap dt { color: #64748B; } .po-recap dd { margin: 0; overflow-wrap: anywhere; }
.po-notes { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.po-notes li { border-left: 3px solid #EDE6DA; padding: 2px 0 2px 10px; font-size: 13.5px; }
.po-notes small { display: block; color: #64748B; font-size: 11.5px; }
.po-note-form { display: grid; gap: 6px; }
.po-note-form textarea { width: 100%; box-sizing: border-box; border: 1px solid #DCD2C3; border-radius: 10px; padding: 8px 10px; font: 14px Inter, system-ui, sans-serif; }
.po-note-form .btn { justify-self: start; }
.po-actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.po-st { display: inline-block; border-radius: 999px; padding: 2px 9px; font-size: 12px; font-weight: 700; background: #F3EEE6; color: #6B6259; }
.po-st.st-nouvelle, .po-st.et-brouillon { background: #FEF3C7; color: #92400E; }
.po-st.st-contactee { background: #E0ECFF; color: #1E40AF; }
.po-st.st-devis_envoye, .po-st.et-a_accepter { background: #EDE7FF; color: #5B21B6; }
.po-st.st-gagnee, .po-st.et-accepte { background: #DCFCE7; color: #166534; }
.po-mods { border: 0; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 6px 14px; }
.po-mods legend { font-size: 13px; font-weight: 700; color: #334155; margin-bottom: 6px; }
.po-mods legend em { font-weight: 400; color: #64748B; font-style: normal; }
.po-mod { display: flex !important; flex-direction: row !important; align-items: center; gap: 8px; font-size: 13.5px; }
.po-mod input { width: 18px; height: 18px; accent-color: #2E6E69; }
.po-mod.dis { color: #A39A90; }
.po-ech { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.po-ech li { display: flex; flex-wrap: wrap; gap: 8px 14px; align-items: center; font-size: 13.5px; padding: 6px 0; border-bottom: 1px solid #F1E7DA; }
.po-ok { color: #166534; }
.po-note { margin: 0; }
.po-mode { margin: 0 0 10px; font-weight: 600; color: #2E6E69; }
.po-accuse { white-space: pre-wrap; font: 12.5px/1.5 Inter, system-ui, sans-serif; background: #FAF6F0; padding: 10px; border-radius: 10px; }
.po-msg { max-width: 48ch; white-space: pre-wrap; }
@media (max-width: 860px) { .po-deux { grid-template-columns: 1fr; } .po-recap { grid-template-columns: 1fr; gap: 0; } .po-recap dd { margin-bottom: 6px; } }
.lp-demo-form .dm-type input { width: auto; margin: 0; }
.lp-demo-form .dm-type label { white-space: nowrap; }
a.gate-chemin { text-decoration: none; color: inherit; }
.lp-support-carte .lp-kicker, .lp-demande-grille .lp-kicker { text-align: left; }
.lp-demande-grille h2 { text-align: left; }
.po-deux > *, .po-editeur, #po-devis-liste, #po-vente .card, #po-avis { min-width: 0; max-width: 100%; }

/* Détail de la note : critères non renseignés (calibrage des notes) */
.crit-conseil { margin: 8px 0 0; padding: 8px 10px; border-radius: 10px; background: #FFF7ED; color: #7C2D12; font-size: 12.5px; }

/* Conversations d'équipe (chantier 15) : fil commun aux dossiers et à l'onglet Conversations */
.cv-sr { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.cv-badge { display: inline-block; margin-left: 6px; padding: 1px 8px; border-radius: 999px; background: var(--coral); color: #fff; font-size: 11px; font-weight: 700; letter-spacing: 0; text-transform: none; vertical-align: 1px; }
.cv-dossier { min-width: 0; }
.dr-discussion { display: grid; gap: 8px; }
.cv-fil { display: grid; gap: 8px; min-width: 0; }
.cv-fil-hote .cv-msgs { max-height: 360px; }
.cv-msgs { overflow-y: auto; display: grid; gap: 10px; align-content: start; padding: 4px 2px; min-height: 0; overscroll-behavior: contain; }
.cv-msgs:focus-visible { outline: 2px solid var(--teal); outline-offset: 2px; border-radius: 10px; }
.cv-plus { justify-self: center; font-size: 12.5px; }
.cv-msg { background: var(--white); border: 1px solid var(--line); border-radius: 12px; padding: 8px 12px; min-width: 0; max-width: 100%; }
.cv-msg.moi { background: var(--royal-soft); border-color: var(--royal-mid); }
.cv-msg.vide { background: transparent; border-style: dashed; }
.cv-msg header { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; font-size: 12.5px; color: var(--slate); }
.cv-msg header b { color: var(--ink); font-size: 13px; }
.cv-modifie { font-style: italic; color: var(--muted); }
.cv-texte { white-space: pre-wrap; overflow-wrap: anywhere; font-size: 14px; line-height: 1.5; color: var(--ink); margin-top: 2px; }
.cv-texte a { overflow-wrap: anywhere; }
.cv-vide { margin: 2px 0 0; font-style: italic; color: var(--muted); font-size: 13.5px; }
.cv-info { margin: 0; text-align: center; font-size: 12.5px; color: var(--slate); }
.cv-info time { color: var(--muted); margin-left: 6px; }
.cv-mention { font-weight: 700; color: var(--teal-dark); background: var(--royal-soft); border-radius: 6px; padding: 0 3px; }
.cv-mention.moi { background: var(--gold-soft); color: var(--coral-dark); }
.cv-actions { display: flex; gap: 12px; margin-top: 4px; }
.cv-actions .link-btn { font-size: 12px; }
.cv-pj { list-style: none; margin: 6px 0 0; padding: 0; display: grid; gap: 4px; }
.cv-pj li { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; font-size: 13px; min-width: 0; }
.cv-pj li a { overflow-wrap: anywhere; }
.cv-pj li small { color: var(--muted); }
.cv-pj img { display: block; flex-basis: 100%; max-width: min(260px, 100%); max-height: 200px; object-fit: contain; border-radius: 8px; border: 1px solid var(--line); background: var(--mist); }
.cv-compose { display: grid; gap: 6px; }
.cv-saisie { position: relative; }
.cv-saisie textarea { width: 100%; box-sizing: border-box; resize: vertical; min-height: 44px; }
.cv-compose-bas { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.cv-compose-bas .btn[type=submit] { margin-left: auto; }
.cv-err:empty { display: none; }
.cv-suggest { position: absolute; left: 0; bottom: calc(100% + 4px); z-index: 5; list-style: none; margin: 0; padding: 4px; min-width: 220px; max-width: 100%; background: var(--white); border: 1px solid var(--line-strong); border-radius: 10px; box-shadow: var(--shadow-md); }
.cv-suggest li { display: grid; padding: 6px 10px; border-radius: 8px; cursor: pointer; }
.cv-suggest li small { color: var(--muted); }
.cv-suggest li[aria-selected=true], .cv-suggest li:hover { background: var(--royal-soft); }
.cv-pj-envoi { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }
.cv-pj-envoi li { display: inline-flex; align-items: center; gap: 6px; padding: 2px 4px 2px 10px; border-radius: 999px; background: var(--mist); font-size: 12.5px; max-width: 100%; overflow-wrap: anywhere; }
.cv-pj-envoi .icon-btn { width: 24px; height: 24px; font-size: 11px; }
.cv-edit { display: grid; gap: 6px; }
.cv-edit textarea { width: 100%; box-sizing: border-box; }

/* Onglet Conversations : liste à gauche, fil à droite ; à 390 px, la liste puis le fil en plein écran */
.cv-app { display: grid; grid-template-columns: minmax(240px, 320px) minmax(0, 1fr); gap: 16px; min-height: 0; height: calc(100vh - 230px); min-height: 460px; }
.cv-col, .cv-panneau { background: var(--white); border: 1px solid var(--line); border-radius: 16px; min-width: 0; min-height: 0; display: flex; flex-direction: column; overflow: hidden; }
.cv-vues { flex: none; }
.cv-vues button { flex: 1; }
.cv-cherche { padding: 10px 12px 4px; flex: none; }
.cv-cherche input { width: 100%; box-sizing: border-box; }
.cv-liste { overflow-y: auto; padding: 4px 8px 12px; flex: 1; min-height: 0; }
.cv-l-titre { margin: 12px 6px 4px; font-size: 11.5px; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); font-weight: 700; }
.cv-l, .cv-res { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; }
.cv-l button, .cv-res button { width: 100%; display: flex; align-items: center; gap: 8px; text-align: left; border: 0; background: none; padding: 9px 10px; border-radius: 10px; color: var(--ink); font: inherit; font-size: 14px; cursor: pointer; min-width: 0; }
.cv-l button:hover, .cv-res button:hover { background: var(--mist); }
.cv-l button[aria-current=true] { background: var(--royal-soft); font-weight: 600; }
.cv-l button:focus-visible, .cv-res button:focus-visible { outline: 2px solid var(--teal); outline-offset: -2px; }
.cv-l-nom { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cv-l-tag { color: var(--muted); font-size: 11.5px; white-space: nowrap; flex-shrink: 0; }
.cv-l > li { min-width: 0; }  /* éléments de grille : le nom se raccourcit, l'étiquette reste visible */
.cv-l-n { flex: none; min-width: 20px; text-align: center; padding: 1px 7px; border-radius: 999px; background: var(--coral); color: #fff; font-size: 11.5px; font-weight: 700; }
.cv-res button { display: grid; gap: 2px; }
.cv-res button span { color: var(--slate); font-size: 13px; overflow-wrap: anywhere; }
.cv-res button small { color: var(--muted); }
.cv-res-tete { display: flex; justify-content: space-between; align-items: center; padding: 8px 6px; font-size: 13px; }
.cv-aide { padding: 12px 6px; margin: 0; }
.cv-panneau { padding: 0; }
.cv-tete { display: flex; align-items: center; gap: 10px 14px; flex-wrap: wrap; padding: 12px 16px; border-bottom: 1px solid var(--line); flex: none; }
.cv-tete-txt { flex: 1; min-width: 0; }
.cv-tete h3 { margin: 0; font-size: 17px; overflow-wrap: anywhere; }
.cv-tete p { margin: 2px 0 0; }
.cv-tete-act { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.cv-retour { display: none; }
.cv-fil-principal { flex: 1; min-height: 0; display: flex; flex-direction: column; padding: 10px 16px 14px; }
.cv-fil-principal:empty { display: none; }
.cv-fil-principal .cv-fil { flex: 1; min-height: 0; display: flex; flex-direction: column; }
.cv-fil-principal .cv-msgs { flex: 1; }
.cv-choisir { margin: auto; padding: 24px; text-align: center; }
.cv-dialog .cv-d-form { display: grid; gap: 12px; padding: 0 0 18px; }
.cv-dialog .cv-d-form > :not(.modal-head) { margin-left: 24px; margin-right: 24px; }
.cv-d-gens { border: 0; padding: 0; display: grid; gap: 4px; max-height: 280px; overflow-y: auto; }
.cv-d-p { display: flex; align-items: center; gap: 10px; padding: 6px 4px; font-size: 14px; }
.cv-d-p input { width: 18px; height: 18px; accent-color: var(--teal); }
.cv-dialog label.field-label input { display: block; width: 100%; margin-top: 4px; box-sizing: border-box; }
@media (max-width: 760px) {
  .cv-app { grid-template-columns: minmax(0, 1fr); height: calc(100dvh - 210px); min-height: 420px; }
  .cv-app .cv-panneau { display: none; }
  .cv-app.ouvert .cv-col { display: none; }
  .cv-app.ouvert .cv-panneau { display: flex; }
  #v-conversations.cv-plein { padding-block: 8px 12px; }
  #v-conversations.cv-plein > .view-head, #v-conversations.cv-plein > .ro-banner { display: none; }
  #v-conversations.cv-plein .cv-app { height: calc(100dvh - 84px); min-height: 360px; }
  .cv-retour { display: inline-flex; flex-basis: 100%; }
  .cv-fil-principal { padding: 8px 12px 12px; }
  .cv-dialog .cv-d-form > :not(.modal-head) { margin-left: 16px; margin-right: 16px; }
}
.cv-pj li:has(img) { display: grid; justify-items: start; gap: 4px; }
.cv-docs-l { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; color: var(--slate); }
.cv-docs-l select { max-width: 200px; font-size: 12.5px; padding: 4px 8px; }
.cv-joindre { display: inline-flex; align-items: center; gap: 10px; flex-wrap: wrap; min-width: 0; }
.cv-conservation { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 12px; }
.cv-conservation span { display: grid; gap: 2px; min-width: 0; flex: 1 1 260px; }
.cv-conservation small { color: var(--muted); }

.dr-delete-zone { display: flex; flex-direction: column; gap: 2px; }
.dr-delete-avert { color: var(--red); max-width: 32ch; }


/* ==================================================================== */
/* Finitions (chantier 11) : logo, accueil, téléphone, accessibilité      */
/* Bloc placé en fin de fichier pour l'emporter sur les règles précédentes */
/* ==================================================================== */
:root { --f-marque: "Fredoka", "Plus Jakarta Sans", Inter, sans-serif; }

/* ---- Logo : le nom « Cibly » en Fredoka 500, comme la bande-annonce ---- */
.logo-word, .lp-logo > span, .gate-logo span { font-family: var(--f-marque); font-weight: 500; letter-spacing: -.01em; text-transform: none; }
.lp-logo > span { font-size: 25px; line-height: 1; }
.lp-logo.small > span { font-size: 18px; }

/* ---- Accroche : encre et terre cuite, comme la bande-annonce ---- */
.gate-hero .gate-pitch h1 { color: #1F3A4D; }
.gate-hero .gate-pitch h1 .h1-accent { color: #AA5231; }
.gate-hero .hero-sous { max-width: 62ch; margin-inline: auto; }
.gate-hero .gate-pitch > .hero-cta { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; margin: 6px 0 4px; }
.lp-nav-cta .bb-court { display: none; }

/* ---- Secteurs : une carte par modèle, rangées centrées ---- */
.lp-secteurs .sect-grid { display: flex; flex-wrap: wrap; justify-content: center; gap: 14px; }
.lp-secteurs .sect-card { flex: 0 1 calc((100% - 4 * 14px) / 5); min-height: 0; padding: 20px 18px 18px; gap: 8px; color: inherit; text-decoration: none; }
.lp-secteurs .sect-card b { font-size: 16.5px; }
.lp-secteurs .sc-go { color: #1E3A8A; }
.lp-secteurs .sect-card:focus-visible { outline: 3px solid #0D9488; outline-offset: 3px; }
@media (max-width: 1100px) { .lp-secteurs .sect-card { flex-basis: calc((100% - 2 * 14px) / 3); } }
@media (max-width: 760px) { .lp-secteurs .sect-card { flex-basis: calc((100% - 14px) / 2); } }

/* ---- Quatre étapes : 4 colonnes, puis 2, puis 1 ---- */
.feat-grid.etapes { grid-template-columns: repeat(4, minmax(0, 1fr)); list-style: none; padding: 0; gap: 18px; }
.feat-grid.etapes .feat { padding: 20px; }
.feat-grid.etapes .feat h3 { font-size: 18px; }
.feat-grid.etapes .feat > p:last-child { margin: 0; font-size: 14px; line-height: 1.6; color: #475569; }
.etape-num { margin: 4px 0 0; display: flex; align-items: baseline; gap: 8px; font: 700 13px/1 Inter, system-ui, sans-serif; letter-spacing: .14em; text-transform: uppercase; color: #AA5231; }
.etape-num span { font: 500 22px/1 var(--f-marque); letter-spacing: 0; color: #1F3A4D; }
.feat-visu.sources { display: grid; align-content: center; gap: 7px; padding: 0 18px; }
.sources .src { justify-self: start; padding: 4px 12px; border-radius: 999px; border: 1px solid #F3E2CB; background: #FFF7E8; font: 700 12px/1.3 Inter, system-ui, sans-serif; color: #1F3A4D; animation: src-arrive 3.6s cubic-bezier(.2, .8, .2, 1) infinite both; }
.sources .s1 { margin-left: 22px; animation-delay: .25s; } .sources .s2 { margin-left: 44px; animation-delay: .5s; } .sources .s3 { margin-left: 66px; animation-delay: .75s; background: #FEF3C7; }
@keyframes src-arrive { 0% { transform: translateX(-10px); } 18%, 100% { transform: none; } }
/* Frise des relances : seules les échéances restent, les libellés se chevaucheraient dans une colonne étroite */
.etapes .relances .step { font-size: 0; gap: 0; }
.etapes .relances .step b { width: 40px; height: 40px; font-size: 12px; }
@media (max-width: 1100px) { .feat-grid.etapes { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) { .feat-grid.etapes { grid-template-columns: minmax(0, 1fr); } }

/* ---- Trois raisons de choisir Cibly, puis l'assistant IA en appui ---- */
.lp-atouts { background: #fff; }
.atouts { list-style: none; padding: 0; margin: 40px 0 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; counter-reset: atout; }
.atout { position: relative; padding: 24px 22px 22px; border-radius: 20px; background: #FDF8F2; border: 1px solid #F3E2CB; counter-increment: atout; }
.atout::after { content: counter(atout, decimal-leading-zero); position: absolute; top: 18px; right: 20px; font: 500 22px/1 var(--f-marque); color: #AA5231; }
.atout-ico { width: 46px; height: 46px; border-radius: 14px; display: grid; place-items: center; background: color-mix(in srgb, #2E7C74 14%, #fff); color: #2E7C74; }
.atout-ico svg { width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.atout h3 { margin: 16px 0 8px; font: 800 19px/1.25 "Plus Jakarta Sans", Inter, sans-serif; letter-spacing: -.02em; color: #0F172A; }
.atout p { margin: 0; font-size: 14.5px; line-height: 1.6; color: #475569; }
.atout-ia { max-width: 70ch; margin: 22px auto 0; text-align: center; font-size: 15px; line-height: 1.6; color: #475569; }
.atout-ia b { color: #1F3A4D; }
@media (max-width: 900px) { .atouts { grid-template-columns: minmax(0, 1fr); } }

/* ---- Règles de la commande publique ---- */
.lp-regles { padding-top: 0; }
.lp-regles-carte { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.6fr); gap: 28px; align-items: center; padding: 28px; border-radius: 22px; background: #fff; border: 1px solid #F3E2CB; }
.lp-regles-carte h2 { margin: 8px 0 0; max-width: none; text-align: left; font-size: clamp(24px, 2.6vw, 32px); }
.lp-regles-carte .lp-kicker { text-align: left; margin: 0; }
.lp-trust .trust { align-content: start; }
.regles { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; }
.regles li { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 12px; align-items: start; font-size: 14.5px; line-height: 1.55; color: #475569; }
.regles svg { width: 22px; height: 22px; margin-top: 1px; fill: none; stroke: #2E7C74; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.regles b { color: #1F3A4D; }
@media (max-width: 760px) { .lp-regles-carte { grid-template-columns: minmax(0, 1fr); padding: 22px 18px; } }
.trust-grid { grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }

/* ---- Titres alignés sur leur surtitre (blocs alignés à gauche) ---- */
.lp-tarifs-head h2, .lp-support-carte h2 { margin-left: 0; margin-right: 0; max-width: none; text-align: left; }

/* ---- Veille amont : les étiquettes longues passent à la ligne au lieu d'élargir la carte ---- */
.sig-body { min-width: 0; grid-template-columns: minmax(0, 1fr); }
.sig-top > *, .sig h4, .sig .meta { max-width: 100%; white-space: normal; overflow-wrap: anywhere; }

/* ---- Tableau des droits : la case garde son dessin, sa zone cliquable fait 44 × 44 px ---- */
.dr-case-zone { display: inline-grid; place-items: center; min-width: 44px; min-height: 44px; cursor: pointer; }

/* ---- Contrastes : teintes de la charte assombries juste assez ---- */
.onb-steps li.actif { color: #AA5231; border-color: #AA5231; }
.onb-steps li.actif span { background: #AA5231; }
.onb-steps li.fait { color: #0F766E; border-color: #0F766E; }
.onb-steps li.fait span { background: #0F766E; }
::placeholder { color: #6B7280; opacity: 1; }
.cal-empty { color: #64748B; }
.t5-rank { color: #AA5231; }
.t5-card:first-child .t5-rank { background: #AA5231; }
.dr-masque { color: #6F665E; }
.cv-l-n { background: #AA5231; }
.dm-puce:focus-visible { outline-color: #0D9488; }


/* ---- Téléphone ---- */
@media (max-width: 640px) {
  /* Accueil : illustration et mascotte réduites, le formulaire d'aperçu remonte */
  .gate-hero { gap: 14px; }
  .gate-hero .hello { width: min(300px, 86%); margin-inline: auto; }
  .gate-hero .hello-illu .bulle { display: none; }
  .hero-masc { width: 52px; }
  .hero-titre { flex-direction: row; gap: 10px; }
  .gate-hero .gate-pitch > .hero-cta .btn { flex: 1 1 100%; }
  .lp-nav-cta .bb-long { display: none; }
  .lp-nav-cta .bb-court { display: inline; }
  .lp-nav { gap: 10px; }
  .lp-nav .mode-badge { flex: 0 1 auto; min-width: 0; }
  .lp-secteurs .sc-ex { display: none; }
  .lp-secteurs .sect-card { padding: 16px 14px; }
  .lp-secteurs .sect-card b { font-size: 15px; }

  /* Application : mascottes décoratives masquées, le contenu passe en premier */
  #shell .masc-mini, #shell .welcome-masc, #shell .px-masc, #shell .cal-masc { display: none; }

  /* Zones tactiles d'au moins 44 × 44 px (le dessin peut rester plus petit) */
  .btn, .btn-sm, .chip-btn, .dm-puce, .dep-chip, .cf, .cf-all, .cal-more, .quick-mail, .advance, .pr-onglets button, [role="tab"],
  .segmented button, .sb-nav a, .sb-espace, .logo, .lp-logo, .pg-logo, .gate-chemin, .rg-tabs button,
  select, input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="hidden"]) { min-height: 44px; }
  .icon-btn, .sb-logout, .acces-close, .mdp-oeil, .link-btn.danger { min-width: 44px; min-height: 44px; }
  .dr-statut { min-height: 44px; }
  button[data-fil], .dr-lm button { min-height: 44px; }
  .badge-tag button { position: relative; }
  .badge-tag button::after { content: ""; position: absolute; inset: -11px; }
  .lp-legal a, .pg-foot a { padding-inline: 8px; margin-inline: -8px; }
  .link-btn { min-width: 44px; text-align: center; }
  summary { min-height: 44px; }
  input, select, textarea { font-size: 16px; }
  /* Liens et boutons en ligne : la zone cliquable s'étend au-dessus et au-dessous du texte, sans décaler la ligne */
  .link-btn, .lp-legal a, .lp-legal .link-btn, .hero-note a, .lp-foot a, .gate-alt .link-btn { display: inline-block; padding-block: 12px; margin-block: -12px; }
  .lp-legal { row-gap: 14px; }
  /* Cases et boutons radio : tout le libellé est cliquable, sur 44 px de haut */
  label:has(> input[type="checkbox"]), label:has(> input[type="radio"]) { min-height: 44px; display: inline-flex; align-items: center; gap: 8px; }
  .dm-type { display: flex; flex-wrap: wrap; gap: 0 18px; }
  /* Petits repères cliquables (frise de la veille amont, cases du tableau des droits) : zone élargie autour du dessin */
  .tl-dot, .dr-case-zone { position: relative; }
  .tl-dot::after { content: ""; position: absolute; inset: -15px; transform: rotate(-45deg); }  /* le point est tourné de 45° : zone remise droite */
  summary { padding-block: 11px; }

}

/* ---- Animations : réduites partout quand la personne le demande ---- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; animation-delay: 0s !important; transition-duration: .01ms !important; transition-delay: 0s !important; scroll-behavior: auto !important; }
}