:root {
  --navy-950: #071f37;
  --navy-900: #0b2a48;
  --navy-800: #10385d;
  --blue-700: #1767c7;
  --blue-600: #2379df;
  --blue-100: #eaf4ff;
  --slate-800: #304b65;
  --slate-600: #627b93;
  --slate-400: #9cafc0;
  --slate-200: #d9e4ed;
  --slate-100: #edf3f7;
  --paper: #f8fbfd;
  --white: #ffffff;
  --red: #ef4050;
  --coral: #ff6f61;
  --violet: #a65de2;
  --green: #168b70;
  --orange: #e99a22;
  --gradient-brand: linear-gradient(115deg, #ff4e57 4%, #ff795e 45%, #bd5cda 100%);
  --shadow-sm: 0 14px 34px rgba(13, 47, 79, .08);
  --shadow-lg: 0 30px 80px rgba(7, 31, 55, .16);
  --radius-xl: 34px;
  --radius-lg: 24px;
  --radius-md: 16px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 92px; }
body { margin: 0; color: var(--navy-950); background: var(--paper); font-family: "DM Sans", Arial, sans-serif; -webkit-font-smoothing: antialiased; }
body.menu-open { overflow: hidden; }
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }
button, input, textarea { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
::selection { color: white; background: #216fd2; }

.shell { width: min(1200px, calc(100% - 48px)); margin: 0 auto; }
.section { position: relative; padding: 110px 0; overflow: hidden; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.skip-link { position: fixed; top: -80px; left: 24px; z-index: 1000; padding: 12px 18px; color: white; background: var(--navy-950); border-radius: 10px; transition: top .2s; }
.skip-link:focus { top: 18px; }

.site-header { position: fixed; inset: 0 0 auto; z-index: 100; border-bottom: 1px solid transparent; transition: background .25s, border-color .25s, box-shadow .25s; }
.site-header.scrolled { background: rgba(248,251,253,.92); border-color: rgba(169,190,208,.4); box-shadow: 0 12px 30px rgba(10,42,72,.06); backdrop-filter: blur(18px); }
.site-header:not(.scrolled) .brand-copy strong { color: white; }
.site-header:not(.scrolled) .brand-copy small { color: #c8dce9; }
.site-header:not(.scrolled) .main-nav { color: #e3edf4; }
.site-header:not(.scrolled) .main-nav .nav-cta { color: white; background: rgba(6,31,55,.68); border: 1px solid rgba(255,255,255,.16); backdrop-filter: blur(10px); }
.header-inner { min-height: 88px; display: flex; align-items: center; justify-content: space-between; gap: 28px; }
.brand { display: inline-flex; align-items: center; gap: 12px; min-width: max-content; }
.brand-mark { width: 48px; height: 48px; display: grid; place-items: center; overflow: hidden; background: white; border-radius: 15px; box-shadow: 0 8px 25px rgba(7,31,55,.12); }
.brand-mark img { width: 46px; height: 46px; object-fit: cover; }
.brand-copy { display: grid; gap: 2px; }
.brand-copy strong { font: 800 20px/1 "Manrope", sans-serif; letter-spacing: -.03em; }
.brand-copy small { color: var(--slate-600); font-size: 10px; font-weight: 700; letter-spacing: .04em; }
.main-nav { display: flex; align-items: center; gap: 30px; color: var(--slate-800); font-size: 13px; font-weight: 700; }
.main-nav > a { position: relative; padding: 14px 0; }
.main-nav > a:not(.nav-cta)::after { content: ""; position: absolute; inset: auto 0 7px; height: 2px; transform: scaleX(0); transform-origin: right; background: var(--blue-600); transition: transform .25s; }
.main-nav > a:hover::after, .main-nav > a:focus-visible::after { transform: scaleX(1); transform-origin: left; }
.main-nav .nav-cta { padding: 12px 17px; color: white; background: var(--navy-900); border-radius: 12px; box-shadow: 0 8px 20px rgba(11,42,72,.14); }
.main-nav .nav-cta span { margin-left: 8px; }
.menu-toggle { display: none; width: 46px; height: 46px; padding: 11px; border: 0; background: white; border-radius: 13px; box-shadow: var(--shadow-sm); }
.menu-toggle i { display: block; height: 2px; margin: 5px 0; background: var(--navy-900); border-radius: 2px; transition: transform .2s, opacity .2s; }

.hero { min-height: 840px; padding-top: 178px; padding-bottom: 52px; color: white; background: linear-gradient(118deg, #0a2d4e 0%, #14527a 52%, #546886 79%, #9d668a 115%); }
.hero::before { content: ""; position: absolute; inset: 0; opacity: .22; background-image: linear-gradient(rgba(255,255,255,.09) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.09) 1px, transparent 1px); background-size: 82px 82px; mask-image: linear-gradient(to bottom, black, transparent 82%); }
.hero-orbit { position: absolute; border: 1px solid rgba(255,255,255,.12); border-radius: 50%; }
.orbit-one { width: 620px; height: 620px; top: -260px; right: -80px; box-shadow: inset 0 0 0 60px rgba(255,255,255,.025), inset 0 0 0 130px rgba(255,255,255,.02); }
.orbit-two { width: 380px; height: 380px; left: -180px; bottom: 40px; box-shadow: inset 0 0 0 50px rgba(255,255,255,.02); }
.hero-grid { position: relative; display: grid; grid-template-columns: minmax(0, .93fr) minmax(480px, 1.07fr); gap: 48px; align-items: center; }
.eyebrow { display: inline-flex; align-items: center; gap: 10px; margin-bottom: 20px; font: 800 11px/1.2 "Manrope", sans-serif; letter-spacing: .16em; text-transform: uppercase; color: #d9e9f5; }
.eyebrow span { width: 8px; height: 8px; background: var(--red); border-radius: 50%; box-shadow: 0 0 0 7px rgba(239,64,80,.16); }
.eyebrow.dark { color: var(--slate-600); }
.eyebrow.light { color: #bcd5e9; }
.hero h1, h2 { margin: 0; font-family: "Manrope", sans-serif; letter-spacing: -.055em; }
.hero h1 { max-width: 730px; font-size: clamp(52px, 6vw, 82px); line-height: .98; }
h1 em, h2 em { font-style: normal; color: transparent; background: var(--gradient-brand); -webkit-background-clip: text; background-clip: text; }
.hero-lead { max-width: 640px; margin: 28px 0 0; color: #e5eef5; font-size: 18px; line-height: 1.7; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 36px; }
.button { min-height: 50px; display: inline-flex; align-items: center; justify-content: center; gap: 12px; padding: 0 20px; border: 1px solid transparent; border-radius: 14px; cursor: pointer; font-weight: 800; font-size: 13px; transition: transform .2s, box-shadow .2s, background .2s; }
.button:hover { transform: translateY(-2px); }
.button-primary { color: white; background: linear-gradient(110deg, #1c73d4, #1f66c3); box-shadow: 0 14px 30px rgba(3, 30, 67, .22); }
.button-primary:hover { box-shadow: 0 18px 36px rgba(3,30,67,.28); }
.button-quiet { color: white; border-color: rgba(255,255,255,.28); background: rgba(255,255,255,.08); backdrop-filter: blur(8px); }
.button.full { width: 100%; }
.hero-trust { display: flex; flex-wrap: wrap; gap: 20px; margin-top: 32px; color: #cfe0ec; font-size: 11px; font-weight: 700; }
.hero-trust span { display: inline-flex; align-items: center; gap: 7px; }
.hero-trust i { width: 19px; height: 19px; display: grid; place-items: center; color: #8ce2cc; background: rgba(24,153,119,.18); border-radius: 50%; font-style: normal; }

.product-stage { position: relative; min-height: 510px; user-select: none; }
.stage-glow { position: absolute; width: 520px; height: 420px; top: 20px; right: -40px; background: radial-gradient(circle, rgba(106,190,255,.28), transparent 70%); filter: blur(10px); }
.device { position: absolute; overflow: hidden; background: #f6f9fc; border: 1px solid rgba(255,255,255,.58); box-shadow: 0 35px 80px rgba(3,25,47,.34); }
.desktop-device { width: 92%; aspect-ratio: 16/10; top: 30px; right: 0; border: 7px solid #eef4f8; border-radius: 22px; transform: perspective(1000px) rotateY(-3deg) rotateX(1deg); }
.device-topbar { height: 27px; display: flex; align-items: center; gap: 5px; padding: 0 10px; color: #8498a9; background: #eef3f7; font-size: 7px; }
.device-topbar span { width: 6px; height: 6px; border-radius: 50%; background: #c7d3dc; }
.device-topbar b { margin-left: 6px; font-weight: 700; }
.desktop-screen { height: calc(100% - 27px); display: flex; background: #f1f5f8; }
.mini-sidebar { width: 18%; padding: 15px 13px; background: #0b2a48; }
.mini-logo { width: 24px; height: 24px; display: grid; place-items: center; margin-bottom: 28px; color: white; background: linear-gradient(135deg, var(--red), #bc1f50); border-radius: 7px; font-size: 10px; font-weight: 800; }
.mini-sidebar i { display: block; width: 70%; height: 5px; margin: 13px 0; background: #45617a; border-radius: 5px; }
.mini-sidebar i.active { width: 100%; height: 22px; background: #195991; border-radius: 6px; }
.mini-main { width: 82%; padding: 18px; }
.mini-heading { height: 75px; display: flex; align-items: center; justify-content: space-between; padding: 14px 17px; color: white; background: linear-gradient(120deg, #0e3457, #185792); border-radius: 12px; }
.mini-heading small, .mini-heading strong { display: block; }
.mini-heading small { margin-bottom: 5px; font-size: 5px; letter-spacing: .12em; }
.mini-heading strong { font-size: 13px; }
.mini-heading b { font-size: 7px; }
.mini-kpis { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; margin: 12px 0; }
.mini-kpis i { height: 40px; background: white; border: 1px solid #dfe8ef; border-radius: 8px; }
.mini-kpis i:nth-child(1) { border-left: 3px solid #2477dc; }.mini-kpis i:nth-child(2) { border-left: 3px solid #8755d6; }.mini-kpis i:nth-child(3) { border-left: 3px solid #168b70; }.mini-kpis i:nth-child(4) { border-left: 3px solid #e99a22; }
.mini-panels { display: grid; grid-template-columns: 1.3fr .7fr; gap: 10px; }
.mini-panels > div { min-height: 125px; padding: 10px; background: white; border: 1px solid #dfe8ef; border-radius: 10px; }
.mini-panels span { display: inline-block; width: 29%; height: 70px; margin: 18px 1.5% 0; background: #eef4f8; border-radius: 7px; }
.mini-panels b { display: block; height: 20px; margin: 9px 0; background: #eef4f8; border-radius: 6px; }
.tablet-device { width: 30%; aspect-ratio: 4/5; left: 0; bottom: 8px; z-index: 3; border: 6px solid #e9f0f5; border-radius: 22px; transform: rotate(-5deg); }
.tablet-notch { position: absolute; width: 6px; height: 6px; top: 5px; left: calc(50% - 3px); z-index: 2; background: #8d9eab; border-radius: 50%; }
.tablet-screen { height: 100%; padding: 19px 10px 10px; background: #eef4f8; }
.tablet-head { display: flex; align-items: center; gap: 7px; margin-bottom: 17px; }
.tablet-head b { width: 20px; height: 20px; display: grid; place-items: center; color: white; background: #0d3458; border-radius: 6px; font-size: 8px; }
.tablet-head span { width: 60%; height: 6px; background: #c8d6e1; border-radius: 5px; }
.tablet-screen > strong { display: block; color: #0c2c4c; font-size: 8px; }
.tablet-card { height: 46px; margin-top: 9px; background: white; border: 1px solid #d5e0e8; border-radius: 8px; }
.tablet-card.accent { height: 62px; background: linear-gradient(135deg, #123d65, #2673b7); }
.tablet-card.small { height: 31px; }
.phone-device { width: 23%; aspect-ratio: 9/18; right: -12px; bottom: -6px; z-index: 4; border: 5px solid #eaf0f4; border-radius: 25px; }
.phone-speaker { position: absolute; width: 28px; height: 4px; top: 7px; left: calc(50% - 14px); z-index: 2; background: #8a9aa7; border-radius: 4px; }
.phone-screen { height: 100%; padding: 22px 9px 9px; background: #f2f6f9; }
.phone-head { display: flex; align-items: center; gap: 7px; margin-bottom: 20px; }
.phone-head b { width: 21px; height: 21px; display: grid; place-items: center; color: white; background: #c62943; border-radius: 7px; font-size: 9px; }.phone-head span { color: #153a5c; font-size: 7px; font-weight: 800; }
.phone-screen > small, .phone-screen > strong { display: block; }.phone-screen > small { color: #8193a2; font-size: 5px; letter-spacing: .1em; }.phone-screen > strong { margin: 3px 0 11px; color: #0d2f50; font-size: 11px; }
.phone-row { display: flex; align-items: center; gap: 7px; height: 35px; margin: 7px 0; padding: 6px; background: white; border: 1px solid #dce5ec; border-radius: 7px; }
.phone-row i { width: 18px; height: 18px; background: #e8f2fc; border-radius: 5px; }.phone-row span { width: 60%; height: 5px; background: #d6e1e9; border-radius: 4px; }
.stage-label { position: absolute; left: 34%; bottom: -14px; z-index: 5; padding: 10px 15px; color: #dceaf4; background: rgba(6,29,52,.74); border: 1px solid rgba(255,255,255,.18); border-radius: 999px; backdrop-filter: blur(12px); font-size: 10px; font-weight: 700; }
.stage-label span { margin-right: 6px; color: #6bd8bd; }
.proof-strip { position: relative; display: grid; grid-template-columns: repeat(4, 1fr); margin-top: 85px; border: 1px solid rgba(255,255,255,.18); border-radius: 18px; background: rgba(255,255,255,.08); backdrop-filter: blur(14px); }
.proof-strip > div { display: flex; gap: 14px; min-height: 94px; align-items: center; padding: 20px; border-right: 1px solid rgba(255,255,255,.15); }.proof-strip > div:last-child { border-right: 0; }
.proof-strip strong { color: #ff6d6d; font: 800 12px "Manrope", sans-serif; }.proof-strip span, .proof-strip b, .proof-strip small { display: block; }.proof-strip b { font-size: 12px; }.proof-strip small { margin-top: 5px; color: #c9dce9; font-size: 9px; line-height: 1.4; }

.split-heading { display: grid; grid-template-columns: 1fr .85fr; gap: 90px; align-items: end; margin-bottom: 55px; }
.split-heading h2, .centered-heading h2, .anywhere h2, .deployment h2 { font-size: clamp(42px, 5vw, 68px); line-height: 1.04; }
.split-heading > p, .centered-heading > p { margin: 0; color: var(--slate-600); font-size: 17px; line-height: 1.75; }
.journey-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.journey-card { position: relative; min-height: 430px; padding: 30px; overflow: hidden; background: white; border: 1px solid var(--slate-200); border-radius: var(--radius-lg); box-shadow: var(--shadow-sm); transition: transform .25s, box-shadow .25s; }.journey-card:hover { transform: translateY(-5px); box-shadow: var(--shadow-lg); }
.journey-number { position: absolute; top: 22px; right: 24px; color: #b0bfcb; font: 800 13px "Manrope", sans-serif; }
.journey-icon { width: 54px; height: 54px; display: grid; place-items: center; margin-bottom: 52px; border-radius: 16px; font-size: 21px; font-weight: 800; }.journey-icon.blue { color: #1668c8; background: #e7f2ff; }.journey-icon.green { color: #12826a; background: #e2f7f0; }.journey-icon.violet { color: #7c4fc5; background: #f0e9fb; }
.journey-card h3 { max-width: 260px; margin: 0 0 14px; font: 800 24px/1.2 "Manrope", sans-serif; letter-spacing: -.035em; }.journey-card p { color: var(--slate-600); line-height: 1.65; }.journey-card ul { display: grid; gap: 10px; padding: 20px 0 0; margin: 24px 0 0; border-top: 1px solid var(--slate-200); list-style: none; }.journey-card li { position: relative; padding-left: 18px; color: var(--slate-800); font-size: 12px; font-weight: 700; }.journey-card li::before { content: ""; position: absolute; top: 6px; left: 0; width: 7px; height: 7px; background: var(--blue-600); border-radius: 50%; }

.essential { color: white; background: linear-gradient(125deg, #08233f 0%, #0b3458 62%, #163f65 100%); }
.essential::after { content: ""; position: absolute; width: 700px; height: 700px; right: -280px; top: -230px; border: 1px solid rgba(255,255,255,.08); border-radius: 50%; box-shadow: inset 0 0 0 75px rgba(255,255,255,.018), inset 0 0 0 155px rgba(255,255,255,.018); }
.essential-grid { position: relative; z-index: 1; display: grid; grid-template-columns: .7fr 1.3fr; gap: 85px; }
.essential-copy { position: sticky; top: 125px; align-self: start; }.essential h2 { font-size: clamp(54px, 7vw, 88px); line-height: .95; }.essential-copy > p { margin: 28px 0; color: #c7dbe9; font-size: 17px; line-height: 1.7; }
.essential-note { display: flex; gap: 14px; padding: 17px; color: #dce8f1; background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.12); border-radius: 15px; }.essential-note i { flex: 0 0 30px; height: 30px; display: grid; place-items: center; color: #8dd9ff; background: rgba(70,167,232,.14); border-radius: 9px; font-style: normal; font-weight: 800; }.essential-note span, .essential-note strong { display: block; }.essential-note strong { margin-bottom: 4px; color: white; font-size: 12px; }.essential-note span { font-size: 10px; line-height: 1.55; }
.essential-features { display: grid; }.essential-features article { display: grid; grid-template-columns: 55px 1fr; gap: 20px; padding: 25px 0; border-bottom: 1px solid rgba(255,255,255,.13); }.essential-features article:first-child { padding-top: 0; }.essential-features article:last-child { border-bottom: 0; }.essential-features article > span { width: 42px; height: 42px; display: grid; place-items: center; color: #ff7a78; background: rgba(255,255,255,.06); border-radius: 12px; font: 800 11px "Manrope", sans-serif; }.essential-features h3 { margin: 0 0 7px; font: 700 19px "Manrope", sans-serif; }.essential-features p { margin: 0; color: #bdd1e0; line-height: 1.6; }

.solutions { background: #f5f9fc; }
.centered-heading { max-width: 820px; margin-bottom: 55px; text-align: center; }.centered-heading .eyebrow { justify-content: center; }.centered-heading > p { max-width: 670px; margin: 22px auto 0; }
.modules-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 15px; }.module-card { min-height: 205px; display: grid; grid-template-columns: 48px 1fr auto; gap: 16px; align-items: start; padding: 25px; background: white; border: 1px solid var(--slate-200); border-radius: 20px; box-shadow: 0 10px 30px rgba(13,47,79,.05); transition: transform .2s, border-color .2s; }.module-card:hover { transform: translateY(-4px); border-color: #a9c3da; }.module-icon { width: 48px; height: 48px; display: grid; place-items: center; border-radius: 14px; font-size: 17px; font-weight: 800; }.module-icon.workshop { color: #156dcf; background: #e6f2ff; }.module-icon.training { color: #148067; background: #e3f6f0; }.module-icon.heritage { color: #a46512; background: #fff0d8; }.module-icon.hr { color: #7849bf; background: #efe8fb; }.module-icon.stock { color: #b34b59; background: #fde9ec; }.module-icon.custom-icon { color: white; background: linear-gradient(135deg, var(--blue-600), var(--violet)); }.module-card small { color: var(--slate-600); font: 800 9px "Manrope", sans-serif; letter-spacing: .12em; }.module-card h3 { margin: 7px 0 9px; font: 800 20px "Manrope", sans-serif; letter-spacing: -.03em; }.module-card p { margin: 0; color: var(--slate-600); font-size: 12px; line-height: 1.6; }.module-card > b { color: #7890a5; font-size: 16px; }.module-card.custom { background: linear-gradient(145deg, white, #f3effb); }

.intelligence { color: white; background: linear-gradient(122deg, #0a2947, #143c63 64%, #503d70 120%); }
.intelligence-grid { display: grid; grid-template-columns: 1.05fr .95fr; gap: 90px; align-items: center; }.ai-visual { position: relative; min-height: 570px; user-select: none; }.ai-ring { position: absolute; border: 1px solid rgba(121,194,245,.18); border-radius: 50%; }.ring-a { width: 480px; height: 480px; top: 45px; left: 30px; }.ring-b { width: 350px; height: 350px; top: 110px; left: 95px; }.ring-c { width: 220px; height: 220px; top: 175px; left: 160px; background: radial-gradient(circle, rgba(45,127,208,.25), transparent 72%); }.ai-core { position: absolute; top: 210px; left: 195px; z-index: 2; width: 150px; height: 150px; display: grid; align-content: center; justify-items: center; padding: 15px; text-align: center; background: linear-gradient(145deg, rgba(41,121,197,.84), rgba(126,75,183,.84)); border: 1px solid rgba(255,255,255,.28); border-radius: 50%; box-shadow: 0 0 55px rgba(72,160,229,.28); backdrop-filter: blur(12px); }.ai-core small { color: #cee8fb; font-size: 7px; letter-spacing: .1em; }.ai-core strong { margin: 6px 0; font: 800 16px "Manrope", sans-serif; }.ai-core span { color: #d7e5ef; font-size: 7px; }
.ai-signal { position: absolute; z-index: 3; min-width: 200px; display: flex; align-items: center; gap: 12px; padding: 13px 15px; background: rgba(255,255,255,.09); border: 1px solid rgba(255,255,255,.15); border-radius: 14px; box-shadow: 0 18px 35px rgba(0,0,0,.16); backdrop-filter: blur(13px); }.ai-signal i { width: 31px; height: 31px; flex: 0 0 31px; background: radial-gradient(circle at 35% 35%, #88d4ff, #277acb); border-radius: 10px; }.ai-signal span, .ai-signal small, .ai-signal b { display: block; }.ai-signal small { color: #9cb8cc; font-size: 7px; letter-spacing: .12em; }.ai-signal b { margin-top: 3px; font-size: 10px; }.signal-one { top: 62px; right: -5px; }.signal-two { bottom: 80px; right: 5px; }.signal-two i { background: radial-gradient(circle at 35% 35%, #ffbc81, #e05d55); }.signal-three { bottom: 46px; left: -8px; }.signal-three i { background: radial-gradient(circle at 35% 35%, #bf9bf0, #7550c4); }
.ai-copy h2 { font-size: clamp(50px, 6vw, 78px); line-height: .99; }.ai-copy > p { margin: 27px 0 34px; color: #c5d8e7; font-size: 16px; line-height: 1.75; }.ai-principles { display: grid; border-top: 1px solid rgba(255,255,255,.14); }.ai-principles > div { display: grid; grid-template-columns: 35px 1fr; gap: 13px; padding: 17px 0; border-bottom: 1px solid rgba(255,255,255,.14); }.ai-principles > div > strong { color: #ff7776; font-size: 10px; }.ai-principles span, .ai-principles b, .ai-principles small { display: block; }.ai-principles b { margin-bottom: 5px; font-size: 12px; }.ai-principles small { color: #abc3d4; font-size: 10px; line-height: 1.5; }

.anywhere { background: white; }.anywhere-grid { display: grid; grid-template-columns: .8fr 1.2fr; gap: 80px; align-items: center; }.anywhere h2 { margin-bottom: 24px; }.anywhere-copy > p { color: var(--slate-600); font-size: 16px; line-height: 1.75; }.anywhere-copy ul { display: grid; gap: 12px; padding: 0; margin: 28px 0 0; list-style: none; }.anywhere-copy li { position: relative; padding-left: 27px; color: var(--slate-800); font-size: 12px; font-weight: 700; }.anywhere-copy li::before { content: "✓"; position: absolute; left: 0; top: -1px; width: 18px; height: 18px; display: grid; place-items: center; color: var(--green); background: #e4f7f1; border-radius: 50%; font-size: 9px; }
.responsive-board { min-height: 480px; display: grid; grid-template-columns: 1.3fr 1fr .8fr; gap: 13px; align-items: end; padding: 32px; background: linear-gradient(145deg, #eaf2f8, #f7f9fc); border: 1px solid var(--slate-200); border-radius: 30px; user-select: none; }.board-item { text-align: center; }.board-item > span { display: inline-grid; place-items: center; width: 28px; height: 28px; margin-bottom: 13px; color: var(--slate-600); background: white; border-radius: 9px; font: 800 9px "Manrope", sans-serif; }.board-screen { position: relative; margin: 0 auto 16px; overflow: hidden; background: #f9fbfd; border: 6px solid white; box-shadow: 0 20px 40px rgba(14,51,83,.16); }.desktop-mini { width: 100%; aspect-ratio: 16/11; border-radius: 14px; }.tablet-mini { width: 88%; aspect-ratio: 4/5; border-radius: 17px; }.mobile-mini { width: 76%; aspect-ratio: 9/17; border-radius: 21px; }.board-screen i { display: block; width: 100%; height: 28%; background: linear-gradient(115deg, #123d65, #1f70b7); }.board-screen b { display: inline-block; width: 25%; height: 20%; margin: 8% 2% 0; background: #e5edf3; border-radius: 6px; }.tablet-mini b { width: 82%; height: 20%; }.mobile-mini b { display: block; width: 80%; height: 13%; margin: 9% auto 0; }.board-item strong, .board-item small { display: block; }.board-item strong { font: 800 13px "Manrope", sans-serif; }.board-item small { margin-top: 4px; color: var(--slate-600); font-size: 9px; }

.security { color: white; background: #08223c; }.security::before { content: ""; position: absolute; inset: 0; opacity: .08; background-image: radial-gradient(circle at 10% 20%, white 1px, transparent 1px); background-size: 28px 28px; }.security-heading { position: relative; display: grid; grid-template-columns: 1fr .75fr; gap: 80px; align-items: end; margin-bottom: 55px; }.security-heading h2 { font-size: clamp(43px, 5.2vw, 70px); line-height: 1.03; }.security-heading > p { margin: 0; color: #bcd2e1; font-size: 16px; line-height: 1.75; }.security-grid { position: relative; display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }.security-card { position: relative; min-height: 285px; padding: 27px; background: rgba(255,255,255,.055); border: 1px solid rgba(255,255,255,.12); border-radius: 20px; }.security-card.primary { background: linear-gradient(140deg, rgba(34,118,196,.38), rgba(121,74,169,.24)); }.security-index { position: absolute; top: 24px; right: 24px; color: #7994aa; font: 800 10px "Manrope", sans-serif; }.security-symbol { width: 46px; height: 46px; display: grid; place-items: center; margin-bottom: 40px; color: #9cd9ff; background: rgba(73,157,224,.14); border: 1px solid rgba(115,190,244,.17); border-radius: 14px; font: 800 13px "Manrope", sans-serif; }.security-card h3 { margin: 0 0 12px; font: 700 19px/1.3 "Manrope", sans-serif; }.security-card p { margin: 0; color: #b8cede; font-size: 12px; line-height: 1.65; }.security-disclaimer { position: relative; display: flex; gap: 20px; align-items: center; margin-top: 18px; padding: 18px 22px; color: #bad0df; background: rgba(255,255,255,.045); border: 1px solid rgba(255,255,255,.1); border-radius: 14px; }.security-disclaimer span { flex: 0 0 auto; padding: 7px 10px; color: #ffb1aa; background: rgba(255,111,97,.1); border-radius: 8px; font: 800 9px "Manrope", sans-serif; text-transform: uppercase; letter-spacing: .1em; }.security-disclaimer p { margin: 0; font-size: 10px; line-height: 1.55; }

.deployment { background: #eef4f8; }.deployment-grid { display: grid; grid-template-columns: .8fr 1.2fr; gap: 90px; align-items: start; }.deployment-copy { position: sticky; top: 125px; }.deployment-copy p { color: var(--slate-600); font-size: 16px; line-height: 1.7; }.deployment-steps { display: grid; padding: 0; margin: 0; list-style: none; counter-reset: step; }.deployment-steps li { display: grid; grid-template-columns: 68px 1fr; gap: 22px; padding: 30px 0; border-bottom: 1px solid #ccdbe6; }.deployment-steps li:first-child { padding-top: 0; }.deployment-steps li > span { width: 55px; height: 55px; display: grid; place-items: center; color: var(--blue-700); background: white; border: 1px solid #d5e2ec; border-radius: 17px; font: 800 11px "Manrope", sans-serif; box-shadow: var(--shadow-sm); }.deployment-steps strong { font: 800 22px "Manrope", sans-serif; }.deployment-steps p { margin: 7px 0 0; color: var(--slate-600); line-height: 1.6; }

.contact { padding-bottom: 80px; background: linear-gradient(180deg, #eef4f8, #f7fafc); }.contact-card { display: grid; grid-template-columns: .9fr 1.1fr; overflow: hidden; color: white; background: linear-gradient(125deg, #0a2b4b, #184f7c 70%, #5d547e); border-radius: var(--radius-xl); box-shadow: var(--shadow-lg); }.contact-copy { padding: 58px; }.contact-copy h2 { max-width: 520px; font-size: clamp(38px, 4.3vw, 59px); line-height: 1.07; }.contact-copy > p { color: #c8dbe9; line-height: 1.75; }.contact-channels { display: grid; gap: 10px; margin-top: 32px; }.contact-channels a { display: flex; align-items: center; gap: 12px; padding: 13px 14px; background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.12); border-radius: 13px; transition: background .2s; }.contact-channels a:hover { background: rgba(255,255,255,.12); }.contact-channels a > span { width: 32px; height: 32px; display: grid; place-items: center; color: #9bd8ff; background: rgba(78,167,228,.15); border-radius: 10px; }.contact-channels small, .contact-channels strong { display: block; }.contact-channels small { color: #a7bfd0; font-size: 7px; letter-spacing: .12em; }.contact-channels strong { margin-top: 3px; font-size: 12px; }
.contact-form { margin: 12px; padding: 36px; color: var(--navy-950); background: white; border-radius: 25px; }.form-heading { display: flex; justify-content: space-between; align-items: center; margin-bottom: 25px; padding-bottom: 18px; border-bottom: 1px solid var(--slate-200); }.form-heading span { font: 800 20px "Manrope", sans-serif; }.form-heading small { padding: 6px 9px; color: var(--green); background: #e6f6f1; border-radius: 8px; font-size: 8px; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 13px; }.contact-form label { display: grid; gap: 7px; margin-bottom: 14px; }.contact-form label > span { color: var(--slate-800); font-size: 10px; font-weight: 800; }.contact-form input, .contact-form textarea { width: 100%; padding: 13px 14px; color: var(--navy-950); background: #f7fafc; border: 1px solid #ccdae5; border-radius: 11px; outline: none; transition: border-color .2s, box-shadow .2s; }.contact-form textarea { resize: vertical; min-height: 120px; }.contact-form input:focus, .contact-form textarea:focus { border-color: var(--blue-600); box-shadow: 0 0 0 4px rgba(35,121,223,.1); }.contact-form .consent { display: grid; grid-template-columns: 17px 1fr; gap: 9px; align-items: start; }.consent input { width: 17px; height: 17px; margin: 1px 0 0; accent-color: var(--blue-700); }.contact-form .consent span { font-weight: 500; line-height: 1.45; }.consent a { color: var(--blue-700); text-decoration: underline; }.form-status { margin: 10px 0 0; color: var(--slate-600); font-size: 9px; text-align: center; }

.site-footer { color: white; background: #061b30; }.footer-main { display: grid; grid-template-columns: 1.2fr .7fr .8fr 1.3fr; gap: 50px; padding: 62px 0 45px; }.footer-brand { align-self: start; }.brand-mark.small { width: 43px; height: 43px; }.brand-mark.small img { width: 41px; height: 41px; }.footer-brand .brand-copy small { color: #8fa9bc; }.footer-links { display: grid; align-content: start; gap: 10px; }.footer-links strong { margin-bottom: 4px; color: #b6cada; font: 800 9px "Manrope", sans-serif; letter-spacing: .12em; text-transform: uppercase; }.footer-links a { color: #829caf; font-size: 11px; transition: color .2s; }.footer-links a:hover { color: white; }.footer-note { padding-left: 28px; border-left: 1px solid rgba(255,255,255,.12); }.footer-note strong { font: 700 16px "Manrope", sans-serif; }.footer-note p { color: #829caf; font-size: 11px; line-height: 1.65; }.footer-bottom { display: flex; justify-content: space-between; gap: 20px; padding: 20px 0 28px; color: #718ca1; border-top: 1px solid rgba(255,255,255,.09); font-size: 9px; }.footer-bottom nav { display: flex; flex-wrap: wrap; gap: 18px; }

.legal-page { min-height: 100vh; padding: 150px 0 90px; background: #f5f9fc; }.legal-shell { width: min(860px, calc(100% - 48px)); margin: 0 auto; }.legal-shell > a { display: inline-flex; gap: 8px; margin-bottom: 30px; color: var(--blue-700); font-size: 12px; font-weight: 800; }.legal-card { padding: 42px; background: white; border: 1px solid var(--slate-200); border-radius: 24px; box-shadow: var(--shadow-sm); }.legal-card h1 { margin: 0 0 16px; font: 800 clamp(36px,5vw,56px)/1.05 "Manrope", sans-serif; letter-spacing: -.05em; }.legal-card h2 { margin: 34px 0 10px; font-size: 20px; letter-spacing: -.03em; }.legal-card p, .legal-card li { color: var(--slate-600); line-height: 1.7; }.legal-card .draft-note { padding: 14px 16px; color: #925a0c; background: #fff4df; border: 1px solid #f4d49d; border-radius: 12px; font-size: 12px; font-weight: 700; }

/* Présentation métier : des situations compréhensibles plutôt que des écrans abstraits. */
.ecosystem-stage { position: relative; min-height: 560px; padding: 20px; color: var(--navy-950); background: rgba(247,251,254,.97); border: 1px solid rgba(255,255,255,.6); border-radius: 28px; box-shadow: 0 34px 80px rgba(4,24,43,.26); user-select: none; }
.ecosystem-stage::before { content: ""; position: absolute; inset: -26px; z-index: -1; background: radial-gradient(circle at 68% 36%, rgba(112,194,246,.28), transparent 48%), radial-gradient(circle at 35% 78%, rgba(210,91,184,.19), transparent 43%); filter: blur(22px); }
.ecosystem-stage-head { display: flex; justify-content: space-between; align-items: center; padding: 4px 3px 17px; color: var(--slate-600); border-bottom: 1px solid var(--slate-200); font-size: 10px; }
.ecosystem-stage-head > span { display: flex; align-items: center; gap: 8px; color: var(--navy-800); font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
.ecosystem-stage-head i { width: 9px; height: 9px; background: var(--green); border: 3px solid #d9f5eb; border-radius: 50%; box-sizing: content-box; }
.ecosystem-brief { margin-top: 16px; padding: 19px; background: white; border: 1px solid #dbe7ef; border-radius: 18px; box-shadow: 0 14px 34px rgba(13,47,79,.07); }
.brief-title { display: flex; justify-content: space-between; align-items: center; padding-bottom: 14px; border-bottom: 1px solid #e4ecf2; }
.brief-title span, .brief-title small, .brief-title strong { display: block; }.brief-title small { margin-bottom: 4px; color: var(--blue-700); font-size: 7px; font-weight: 800; letter-spacing: .14em; }.brief-title strong { font: 800 16px "Manrope", sans-serif; }.brief-title > b { width: 35px; height: 35px; display: grid; place-items: center; color: white; background: linear-gradient(135deg, var(--blue-700), #6b4fc4); border-radius: 11px; font: 800 13px "Manrope", sans-serif; }
.brief-line { display: grid; grid-template-columns: 31px 1fr auto; gap: 10px; align-items: center; padding: 13px 0; border-bottom: 1px solid #edf2f5; }.brief-line:last-child { border-bottom: 0; padding-bottom: 0; }.brief-line > i { width: 31px; height: 31px; display: grid; place-items: center; color: var(--blue-700); background: #eaf4ff; border-radius: 9px; font-style: normal; font-weight: 800; }.brief-line.urgent > i { color: #bc3b43; background: #ffeaeb; }.brief-line span, .brief-line strong, .brief-line small { display: block; }.brief-line strong { font-size: 10px; }.brief-line small { margin-top: 3px; color: var(--slate-600); font-size: 8px; }.brief-line em { padding: 5px 7px; color: var(--slate-600); background: #f0f4f7; border-radius: 7px; font-size: 7px; font-style: normal; font-weight: 800; }
.ecosystem-flow { display: grid; grid-template-columns: 1fr auto 1fr auto 1fr; gap: 8px; align-items: center; margin-top: 14px; }.ecosystem-flow article { min-height: 94px; padding: 13px; background: #edf4f9; border: 1px solid #d8e4ed; border-radius: 14px; }.ecosystem-flow article > span { float: right; color: #9cb1c1; font: 800 8px "Manrope", sans-serif; }.ecosystem-flow small, .ecosystem-flow strong { display: block; }.ecosystem-flow small { color: var(--blue-700); font-size: 7px; font-weight: 800; letter-spacing: .1em; }.ecosystem-flow strong { margin-top: 19px; font-size: 9px; line-height: 1.35; }.ecosystem-flow > b { color: #7f98ac; font-size: 14px; }
.ecosystem-toast { position: absolute; right: 32px; bottom: -22px; left: 32px; z-index: 2; display: flex; gap: 12px; align-items: center; padding: 14px 16px; color: white; background: linear-gradient(115deg, #1767c7, #5149b8); border: 1px solid rgba(255,255,255,.24); border-radius: 15px; box-shadow: 0 18px 40px rgba(19,70,133,.35); }.ecosystem-toast > span { width: 33px; height: 33px; display: grid; place-items: center; flex: 0 0 33px; background: rgba(255,255,255,.13); border-radius: 10px; font-weight: 800; }.ecosystem-toast small, .ecosystem-toast strong { display: block; }.ecosystem-toast small { color: #cde3fb; font-size: 7px; letter-spacing: .12em; }.ecosystem-toast strong { margin-top: 4px; font-size: 10px; }

/* Le premier visuel raconte la promesse centrale : saisir, centraliser, informer et suivre. */
.information-stage { display: flex; flex-direction: column; min-height: 560px; }
.information-source { display: grid; grid-template-columns: 47px 1fr auto; gap: 13px; align-items: center; margin-top: 16px; padding: 17px; background: white; border: 1px solid #d8e4ed; border-radius: 17px; box-shadow: 0 13px 32px rgba(13,47,79,.07); }
.source-icon { width: 45px; height: 45px; display: grid; place-items: center; color: #b63a42; background: #ffeaeb; border-radius: 13px; font: 800 17px "Manrope", sans-serif; }
.information-source small, .information-source strong, .information-source p { display: block; margin: 0; }.information-source small { color: #bd4651; font-size: 7px; font-weight: 800; letter-spacing: .12em; }.information-source strong { margin-top: 5px; font: 800 14px "Manrope", sans-serif; }.information-source p { margin-top: 4px; color: var(--slate-600); font-size: 8px; line-height: 1.45; }.information-source > span { padding: 6px 8px; color: #08775e; background: #dff6ef; border-radius: 8px; font-size: 7px; font-weight: 800; }
.information-core { display: grid; grid-template-columns: 55px 1fr; gap: 15px; align-items: center; margin: 13px 0; padding: 18px; color: white; background: linear-gradient(118deg, #0d3c65, #1b6daf 58%, #684ca2); border-radius: 17px; box-shadow: 0 17px 37px rgba(20,75,126,.22); }
.information-core > span { width: 51px; height: 51px; display: grid; place-items: center; background: rgba(255,255,255,.13); border: 1px solid rgba(255,255,255,.2); border-radius: 15px; font: 800 20px "Manrope", sans-serif; }.information-core small, .information-core strong, .information-core p { display: block; margin: 0; }.information-core small { color: #bfe2fa; font-size: 7px; font-weight: 800; letter-spacing: .13em; }.information-core strong { margin-top: 5px; font: 800 14px "Manrope", sans-serif; }.information-core p { margin-top: 5px; color: #d2e5f2; font-size: 8px; line-height: 1.45; }
.information-routes { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; }.information-routes article { display: grid; grid-template-columns: 34px 1fr; gap: 10px; align-items: center; min-height: 70px; padding: 12px; background: #edf4f9; border: 1px solid #d7e3ec; border-radius: 13px; }.information-routes i { width: 32px; height: 32px; display: grid; place-items: center; color: var(--blue-700); background: white; border-radius: 9px; font-style: normal; font-weight: 800; box-shadow: 0 5px 14px rgba(13,47,79,.06); }.information-routes small, .information-routes strong { display: block; }.information-routes small { color: var(--slate-600); font-size: 6px; font-weight: 800; letter-spacing: .12em; }.information-routes strong { margin-top: 4px; font-size: 9px; line-height: 1.35; }
.information-proof { display: grid; grid-template-columns: repeat(3,1fr); gap: 8px; margin-top: auto; padding-top: 13px; }.information-proof span { padding: 10px 7px; color: var(--slate-600); background: white; border: 1px solid #dce7ee; border-radius: 11px; font-size: 7px; font-weight: 700; text-align: center; }.information-proof b { display: block; margin-bottom: 3px; color: var(--navy-900); font: 800 13px "Manrope", sans-serif; }

.attention { background: linear-gradient(180deg, #f7fafc, #edf4f8); }.attention-grid { display: grid; grid-template-columns: .72fr 1.28fr; gap: 75px; align-items: center; }.attention-copy h2 { font-size: clamp(47px, 5.5vw, 72px); line-height: 1.02; }.attention-copy > p { margin: 27px 0 32px; color: var(--slate-600); font-size: 16px; line-height: 1.72; }.attention-rules { display: grid; border-top: 1px solid #cbdbe6; }.attention-rules > div { display: grid; grid-template-columns: 35px 1fr; gap: 12px; padding: 15px 0; border-bottom: 1px solid #cbdbe6; }.attention-rules > div > span { color: var(--red); font-size: 9px; font-weight: 800; }.attention-rules p, .attention-rules strong { display: block; margin: 0; }.attention-rules p { color: var(--slate-600); font-size: 10px; line-height: 1.5; }.attention-rules strong { margin-bottom: 3px; color: var(--navy-950); font-size: 12px; }
.notification-console { padding: 26px; background: white; border: 1px solid #d5e2ec; border-radius: 25px; box-shadow: var(--shadow-lg); user-select: none; }.notification-head { display: flex; justify-content: space-between; align-items: center; }.notification-head span, .notification-head small, .notification-head strong { display: block; }.notification-head small { color: var(--slate-600); font-size: 7px; font-weight: 800; letter-spacing: .14em; }.notification-head strong { margin-top: 5px; font: 800 21px "Manrope", sans-serif; }.notification-head > b { width: 42px; height: 42px; display: grid; place-items: center; color: white; background: linear-gradient(135deg, var(--red), var(--orange)); border-radius: 13px; box-shadow: 0 9px 24px rgba(239,64,80,.22); }
.profile-switch { display: grid; grid-template-columns: repeat(3,1fr); gap: 5px; margin: 20px 0 10px; padding: 5px; background: #edf3f7; border-radius: 12px; }.profile-switch span { padding: 9px; color: var(--slate-600); border-radius: 8px; font-size: 8px; font-weight: 800; text-align: center; }.profile-switch .active { color: white; background: var(--navy-800); }
.notification-feed { display: grid; }.notification-feed article { display: grid; grid-template-columns: 39px 1fr auto; gap: 12px; align-items: start; padding: 15px 4px; border-bottom: 1px solid #e2ebf1; }.notification-feed article > i { width: 36px; height: 36px; display: grid; place-items: center; color: var(--blue-700); background: #e8f3ff; border-radius: 11px; font-style: normal; font-weight: 800; }.notification-feed article.replace > i { color: #a05804; background: #fff0d8; }.notification-feed article.message > i { color: #7449b7; background: #f1e9fc; }.notification-feed article.task > i { color: white; background: #7851c4; }.notification-feed article.info > i { color: #08775e; background: #dff6ef; }.notification-feed small, .notification-feed strong, .notification-feed p { display: block; margin: 0; }.notification-feed small { color: var(--slate-600); font-size: 6px; font-weight: 800; letter-spacing: .1em; }.notification-feed strong { margin-top: 4px; font-size: 10px; }.notification-feed p { margin-top: 4px; color: var(--slate-600); font-size: 8px; line-height: 1.45; }.notification-feed time { color: #8da1b2; font-size: 7px; white-space: nowrap; }.notification-channels { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 15px; }.notification-channels span { padding: 6px 8px; color: #42617c; background: #edf4f8; border-radius: 7px; font-size: 7px; font-weight: 800; }

.replacement-workflow { display: grid; grid-template-columns: 1fr auto 1fr auto 1fr; gap: 7px; align-items: center; margin-top: 13px; padding: 11px; background: #fff8ec; border: 1px solid #f2dfbc; border-radius: 12px; }.replacement-workflow span { display: flex; gap: 7px; align-items: center; color: #76501b; font-size: 7px; line-height: 1.35; }.replacement-workflow i { width: 21px; height: 21px; display: grid; place-items: center; flex: 0 0 21px; color: white; background: #d48616; border-radius: 7px; font-style: normal; font-weight: 800; }.replacement-workflow em { color: #c8a66e; font-size: 10px; font-style: normal; }

/* Le formulaire ne publie aucune adresse destinataire et prépare les contrôles serveur. */
.contact-form select { width: 100%; padding: 13px 14px; color: var(--navy-950); background: #f7fafc; border: 1px solid #ccdae5; border-radius: 11px; outline: none; transition: border-color .2s, box-shadow .2s; }.contact-form select:focus { border-color: var(--blue-600); box-shadow: 0 0 0 4px rgba(35,121,223,.1); }.form-trap { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }.anti-bot-control { display: flex; gap: 11px; align-items: center; margin: 2px 0 14px; padding: 12px 13px; color: #315c51; background: #e9f7f2; border: 1px solid #c9e9dd; border-radius: 12px; }.anti-bot-control > span { width: 30px; height: 30px; display: grid; place-items: center; flex: 0 0 30px; color: white; background: #149071; border-radius: 9px; font-size: 10px; font-weight: 800; }.anti-bot-control strong, .anti-bot-control small { display: block; }.anti-bot-control strong { font-size: 10px; }.anti-bot-control small { margin-top: 3px; color: #5a7a72; font-size: 8px; line-height: 1.45; }.turnstile-slot { margin: 0 0 14px; }.contact-form button[disabled] { cursor: wait; opacity: .7; transform: none; }.form-status.success { color: #08775e; }.form-status.error { color: #b63a42; }

.service-map { display: grid; grid-template-columns: 1fr 1fr; gap: 15px; }.service-domain { position: relative; min-height: 245px; padding: 27px; overflow: hidden; background: white; border: 1px solid #d6e2eb; border-radius: 21px; box-shadow: 0 12px 30px rgba(11,42,72,.055); }.service-domain::after { content: ""; position: absolute; width: 165px; height: 165px; right: -85px; bottom: -95px; border: 26px solid rgba(26,111,198,.04); border-radius: 50%; }.domain-head { display: flex; align-items: center; gap: 14px; margin-bottom: 45px; }.domain-head > span { width: 43px; height: 43px; display: grid; place-items: center; flex: 0 0 43px; color: var(--blue-700); background: #eaf4ff; border-radius: 12px; font: 800 10px "Manrope", sans-serif; }.domain-head small { color: var(--slate-600); font-size: 7px; font-weight: 800; letter-spacing: .12em; }.domain-head h3 { margin: 4px 0 0; font: 800 21px "Manrope", sans-serif; }.service-domain > p { position: relative; z-index: 1; margin: 0; color: var(--slate-600); font-size: 11px; line-height: 1.8; }.service-domain.technical .domain-head > span { color: #08775e; background: #e1f6ef; }.service-domain.digital .domain-head > span { color: #7247b5; background: #f0e8fb; }.service-domain.health .domain-head > span { color: #bc3b43; background: #ffeaeb; }.service-domain.people .domain-head > span { color: #aa6600; background: #fff0d8; }.service-domain.estate .domain-head > span { color: #4d6d85; background: #eaf0f4; }.service-domain.command { color: white; background: linear-gradient(130deg, #0b2f50, #1e5f92); border-color: transparent; }.service-domain.command small, .service-domain.command > p { color: #c6dae8; }.service-domain.command .domain-head > span { color: white; background: rgba(255,255,255,.12); }.service-domain.custom-domain { color: white; background: linear-gradient(130deg, #5d3e78, #9b4d78); border-color: transparent; }.service-domain.custom-domain small, .service-domain.custom-domain > p { color: #eadced; }.service-domain.custom-domain .domain-head > span { color: white; background: rgba(255,255,255,.12); }.service-map-note { display: flex; gap: 13px; margin-top: 16px; padding: 17px 20px; color: var(--slate-600); background: #e9f1f6; border: 1px solid #d2e0e9; border-radius: 14px; font-size: 11px; }.service-map-note strong { color: var(--navy-800); }

.echelons { color: white; background: linear-gradient(125deg, #092641, #123f67 62%, #4e4b78); }.echelons-grid { display: grid; grid-template-columns: .75fr 1.25fr; gap: 85px; align-items: center; }.echelons-copy h2 { font-size: clamp(46px, 5.5vw, 72px); line-height: 1.02; }.echelons-copy > p { margin-top: 28px; color: #c3d7e5; font-size: 16px; line-height: 1.72; }.echelon-layers { display: grid; gap: 10px; user-select: none; }.echelon-layers article { display: grid; grid-template-columns: 44px 1fr auto; gap: 15px; align-items: center; padding: 19px 20px; background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.13); border-radius: 16px; backdrop-filter: blur(8px); }.echelon-layers article:nth-child(2) { margin-left: 22px; }.echelon-layers article:nth-child(3) { margin-left: 44px; }.echelon-layers article:nth-child(4) { margin-left: 66px; background: linear-gradient(100deg, rgba(39,126,202,.34), rgba(137,79,177,.27)); }.echelon-layers article > span { width: 40px; height: 40px; display: grid; place-items: center; color: #ff9c91; background: rgba(255,255,255,.08); border-radius: 11px; font: 800 9px "Manrope", sans-serif; }.echelon-layers small, .echelon-layers strong, .echelon-layers p { display: block; margin: 0; }.echelon-layers small { color: #9fc4df; font-size: 7px; font-weight: 800; letter-spacing: .12em; }.echelon-layers strong { margin-top: 4px; font-size: 13px; }.echelon-layers p { margin-top: 4px; color: #bcd0de; font-size: 9px; }.echelon-layers article > b { padding: 7px 9px; color: #c7dbea; background: rgba(255,255,255,.07); border-radius: 8px; font-size: 7px; white-space: nowrap; }

.ai-briefing-card { padding: 25px; color: var(--navy-950); background: #f7fafc; border: 1px solid rgba(255,255,255,.4); border-radius: 25px; box-shadow: 0 28px 65px rgba(4,24,43,.3); user-select: none; }.ai-briefing-head { display: flex; justify-content: space-between; align-items: center; padding-bottom: 17px; border-bottom: 1px solid #dce6ed; }.ai-briefing-head span, .ai-briefing-head small, .ai-briefing-head strong { display: block; }.ai-briefing-head small { color: var(--blue-700); font-size: 7px; font-weight: 800; letter-spacing: .13em; }.ai-briefing-head strong { margin-top: 4px; font: 800 18px "Manrope", sans-serif; }.ai-briefing-head time { color: var(--slate-600); font: 800 10px "Manrope", sans-serif; }.ai-summary { display: flex; gap: 12px; align-items: flex-start; margin: 15px 0; padding: 14px; color: #d5e7f4; background: linear-gradient(115deg, #0f426d, #574986); border-radius: 13px; }.ai-summary i { width: 34px; height: 34px; display: grid; place-items: center; flex: 0 0 34px; color: white; background: rgba(255,255,255,.12); border-radius: 10px; font-size: 9px; font-style: normal; font-weight: 800; }.ai-summary p { margin: 0; font-size: 9px; line-height: 1.55; }
.ai-insight { display: grid; grid-template-columns: 32px 1fr; gap: 11px; padding: 14px 0; border-bottom: 1px solid #dfe8ee; }.ai-insight > span { width: 30px; height: 30px; display: grid; place-items: center; color: #b63a42; background: #ffeaeb; border-radius: 9px; font-size: 8px; font-weight: 800; }.ai-insight.warning > span { color: #9e6108; background: #fff0d8; }.ai-insight.calm > span { color: #08775e; background: #dff6ef; }.ai-insight small, .ai-insight strong, .ai-insight p, .ai-insight b { display: block; }.ai-insight small { color: var(--slate-600); font-size: 6px; font-weight: 800; letter-spacing: .1em; }.ai-insight strong { margin-top: 4px; font-size: 10px; }.ai-insight p { margin: 4px 0 0; color: var(--slate-600); font-size: 8px; line-height: 1.45; }.ai-insight b { margin-top: 5px; color: var(--blue-700); font-size: 8px; }.ai-human { display: flex; gap: 10px; align-items: center; margin-top: 15px; padding: 12px; background: #e5f5f0; border-radius: 12px; }.ai-human > span { width: 27px; height: 27px; display: grid; place-items: center; flex: 0 0 27px; color: #08775e; background: white; border-radius: 50%; font-size: 9px; font-weight: 800; }.ai-human p { margin: 0; color: #3e6a5e; font-size: 8px; line-height: 1.45; }.ai-human strong { color: #075d4b; }

.anywhere .centered-heading { margin-bottom: 50px; }.use-moments { display: grid; grid-template-columns: repeat(3,1fr); gap: 15px; }.use-moment { position: relative; min-height: 340px; padding: 28px; overflow: hidden; color: white; background: linear-gradient(145deg, #0e3c63, #196da6); border-radius: 22px; box-shadow: var(--shadow-sm); }.use-moment.station { background: linear-gradient(145deg, #164c5b, #198b70); }.use-moment.mobile { background: linear-gradient(145deg, #513b72, #8a4e92); }.use-moment > span { position: absolute; top: 25px; right: 25px; color: rgba(255,255,255,.48); font: 800 10px "Manrope", sans-serif; }.moment-icon { width: 51px; height: 51px; display: grid; place-items: center; margin-bottom: 60px; background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.17); border-radius: 15px; font: 800 17px "Manrope", sans-serif; }.use-moment > small { color: #bfe4fa; font-size: 7px; font-weight: 800; letter-spacing: .14em; }.use-moment h3 { margin: 7px 0 12px; font: 800 23px "Manrope", sans-serif; }.use-moment p { margin: 0; color: #d3e7f3; font-size: 11px; line-height: 1.65; }.use-moment > b { position: absolute; bottom: 26px; left: 28px; padding: 7px 9px; background: rgba(255,255,255,.11); border-radius: 8px; font-size: 8px; }.pwa-line { display: flex; justify-content: center; align-items: center; gap: 15px; margin-top: 18px; padding: 15px; color: var(--slate-600); background: #eef4f8; border: 1px solid #d7e3eb; border-radius: 13px; font-size: 9px; font-weight: 700; }.pwa-line i { width: 4px; height: 4px; flex: 0 0 4px; background: var(--red); border-radius: 50%; }

[data-protected] { position: relative; -webkit-user-drag: none; }
[data-protected]::after { content: ""; position: absolute; inset: 0; z-index: 20; background: transparent; }
.reveal { opacity: 1; transform: none; transition: opacity .7s ease, transform .7s ease; }
.js .reveal { opacity: 0; transform: translateY(24px); }
.js .reveal.visible { opacity: 1; transform: translateY(0); }
.delay-one { transition-delay: .1s; }.delay-two { transition-delay: .2s; }

@media (max-width: 1050px) {
  .main-nav { gap: 18px; }
  .hero-grid { grid-template-columns: 1fr; }
  .hero { padding-top: 150px; }
  .hero-copy { max-width: 760px; }
  .product-stage { width: min(720px, 100%); margin: 20px auto 0; }
  .proof-strip { grid-template-columns: 1fr 1fr; }.proof-strip > div:nth-child(2) { border-right: 0; }.proof-strip > div:nth-child(-n+2) { border-bottom: 1px solid rgba(255,255,255,.15); }
  .journey-grid, .modules-grid, .security-grid { grid-template-columns: 1fr 1fr; }
  .essential-grid, .intelligence-grid, .anywhere-grid, .deployment-grid { gap: 50px; }
  .footer-main { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 920px) {
  .shell { width: min(100% - 32px, 720px); }
  .section { padding: 80px 0; }
  .header-inner { min-height: 74px; }
  .brand-copy small { display: none; }
  .menu-toggle { display: block; }
  .menu-toggle[aria-expanded="true"] i:nth-of-type(1) { transform: translateY(7px) rotate(45deg); }.menu-toggle[aria-expanded="true"] i:nth-of-type(2) { opacity: 0; }.menu-toggle[aria-expanded="true"] i:nth-of-type(3) { transform: translateY(-7px) rotate(-45deg); }
  .main-nav { position: fixed; inset: 74px 0 auto; display: grid; gap: 0; padding: 16px; background: rgba(248,251,253,.98); border-bottom: 1px solid var(--slate-200); box-shadow: 0 20px 50px rgba(7,31,55,.16); transform: translateY(-130%); opacity: 0; pointer-events: none; transition: transform .25s, opacity .25s; }.main-nav.open { transform: translateY(0); opacity: 1; pointer-events: auto; }.main-nav > a { padding: 15px 12px; }.main-nav .nav-cta { margin-top: 8px; text-align: center; }
  .hero { min-height: auto; padding-top: 125px; }.hero-grid { gap: 30px; }.hero h1 { font-size: clamp(48px, 12vw, 70px); }.hero-lead { font-size: 16px; }.product-stage { min-height: 460px; transform: scale(.96); }.proof-strip { margin-top: 45px; }
  .split-heading, .security-heading, .essential-grid, .intelligence-grid, .anywhere-grid, .deployment-grid, .contact-card { grid-template-columns: 1fr; }.split-heading, .security-heading { gap: 24px; }.essential-copy, .deployment-copy { position: static; }.intelligence-grid { gap: 20px; }.ai-visual { min-height: 520px; max-width: 560px; }.anywhere-grid { gap: 45px; }.responsive-board { min-height: 400px; padding: 22px; }.contact-copy { padding: 42px 34px 24px; }.contact-form { margin: 12px; }
}

@media (max-width: 590px) {
  .shell { width: min(100% - 24px, 520px); }
  .hero { padding-top: 112px; }.hero h1 { font-size: 45px; }.hero-lead { font-size: 15px; }.hero-actions { display: grid; }.button { width: 100%; }.hero-trust { display: grid; gap: 10px; }
  .product-stage { min-height: 345px; transform: none; }.desktop-device { width: 96%; top: 15px; }.tablet-device { width: 33%; bottom: 5px; }.phone-device { width: 25%; right: 0; bottom: 0; }.stage-label { display: none; }
  .proof-strip, .journey-grid, .modules-grid, .security-grid { grid-template-columns: 1fr; }.proof-strip > div { min-height: 76px; border-right: 0; border-bottom: 1px solid rgba(255,255,255,.15); }.proof-strip > div:last-child { border-bottom: 0; }.journey-card { min-height: auto; }.journey-icon { margin-bottom: 35px; }
  .split-heading h2, .centered-heading h2, .anywhere h2, .deployment h2, .security-heading h2 { font-size: 41px; }.essential h2, .ai-copy h2 { font-size: 52px; }
  .essential-grid { gap: 45px; }.essential-features article { grid-template-columns: 45px 1fr; gap: 13px; }
  .ai-visual { min-height: 420px; transform: scale(.78); transform-origin: top left; width: 127%; margin-bottom: -75px; }.ai-signal { min-width: 190px; }.responsive-board { min-height: auto; grid-template-columns: 1fr; align-items: center; }.board-screen { max-width: 240px; }.tablet-mini { max-width: 170px; }.mobile-mini { max-width: 115px; }
  .security-disclaimer { align-items: flex-start; flex-direction: column; gap: 10px; }.deployment-steps li { grid-template-columns: 55px 1fr; gap: 15px; }.deployment-steps li > span { width: 47px; height: 47px; }
  .contact-copy { padding: 38px 24px 20px; }.contact-form { padding: 26px 18px; }.form-row { grid-template-columns: 1fr; }.form-heading { align-items: flex-start; gap: 10px; flex-direction: column; }
  .footer-main { grid-template-columns: 1fr; gap: 30px; }.footer-note { padding: 20px 0 0; border-left: 0; border-top: 1px solid rgba(255,255,255,.12); }.footer-bottom { flex-direction: column; }
  .legal-card { padding: 26px 20px; }
}

@media (max-width: 1050px) {
  .ecosystem-stage { max-width: 720px; margin: 10px auto 25px; }
  .attention-grid, .echelons-grid { grid-template-columns: 1fr; gap: 48px; }
  .attention-copy, .echelons-copy { max-width: 760px; }
  .notification-console { max-width: 760px; }
  .service-map { grid-template-columns: 1fr 1fr; }
  .use-moments { grid-template-columns: 1fr 1fr; }.use-moment:last-child { grid-column: 1 / -1; }
}

@media (max-width: 920px) {
  .ecosystem-stage { min-height: 540px; }
  .attention-copy h2, .echelons-copy h2 { font-size: 52px; }
  .service-map { grid-template-columns: 1fr; }.service-domain { min-height: 220px; }
  .echelon-layers article, .echelon-layers article:nth-child(2), .echelon-layers article:nth-child(3), .echelon-layers article:nth-child(4) { margin-left: 0; }
  .ai-briefing-card { max-width: 720px; }
  .use-moments { grid-template-columns: 1fr; }.use-moment:last-child { grid-column: auto; }.use-moment { min-height: 300px; }.moment-icon { margin-bottom: 42px; }
  .pwa-line { align-items: flex-start; flex-direction: column; }.pwa-line i { display: none; }
}

@media (max-width: 590px) {
  .ecosystem-stage { min-height: auto; padding: 14px; border-radius: 20px; }.ecosystem-stage-head { align-items: flex-start; gap: 9px; flex-direction: column; }.ecosystem-brief { padding: 14px; }.brief-line { grid-template-columns: 31px 1fr; }.brief-line em { display: none; }.brief-line small { line-height: 1.4; }.ecosystem-flow { grid-template-columns: 1fr; }.ecosystem-flow > b { display: none; }.ecosystem-flow article { min-height: 70px; }.ecosystem-flow strong { margin-top: 12px; }.ecosystem-toast { position: relative; right: auto; bottom: auto; left: auto; margin-top: 12px; }
  .information-source { grid-template-columns: 42px 1fr; }.information-source > span { grid-column: 2; justify-self: start; }.information-core { grid-template-columns: 43px 1fr; padding: 14px; }.information-core > span { width: 42px; height: 42px; }.information-routes { grid-template-columns: 1fr; }.information-proof { grid-template-columns: 1fr; }.information-proof span { display: flex; justify-content: space-between; align-items: center; text-align: left; }.information-proof b { display: inline; margin: 0; }
  .attention-copy h2, .echelons-copy h2 { font-size: 41px; }.notification-console { padding: 18px 14px; }.profile-switch { grid-template-columns: 1fr; }.profile-switch span:not(.active) { display: none; }.notification-feed article { grid-template-columns: 36px 1fr; }.notification-feed time { display: none; }.notification-feed p { font-size: 9px; }
  .replacement-workflow { grid-template-columns: 1fr; }.replacement-workflow em { display: none; }.replacement-workflow span { font-size: 8px; }
  .service-domain { min-height: 0; padding: 22px; }.domain-head { margin-bottom: 28px; }.service-map-note { align-items: flex-start; flex-direction: column; }
  .echelon-layers article { grid-template-columns: 38px 1fr; padding: 16px; }.echelon-layers article > span { width: 36px; height: 36px; }.echelon-layers article > b { display: none; }
  .ai-briefing-card { padding: 18px 14px; }.ai-briefing-head strong { font-size: 15px; }.ai-summary { padding: 12px; }.ai-insight strong { font-size: 11px; }.ai-insight p, .ai-insight b, .ai-human p { font-size: 9px; }
  .use-moment { min-height: 290px; padding: 24px; }.use-moment > b { left: 24px; }.moment-icon { margin-bottom: 36px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  .reveal { opacity: 1; transform: none; }
}

/* --- Preuve produit, parcours commercial et pages éditoriales --- */
.product-proof-section { overflow: hidden; background: linear-gradient(180deg, #f6fafe 0%, #edf4f9 100%); }
.product-proof-heading { display: grid; grid-template-columns: 1.15fr .85fr; gap: 70px; align-items: end; }
.product-proof-heading h2 { margin: 12px 0 0; font-size: clamp(44px, 5.4vw, 72px); line-height: 1.02; }
.product-proof-heading > p { margin: 0 0 7px; color: var(--slate-600); font-size: 16px; line-height: 1.75; }
.product-tabs { display: flex; gap: 8px; margin-top: 42px; padding: 7px; overflow-x: auto; background: rgba(255,255,255,.8); border: 1px solid var(--slate-200); border-radius: 16px; box-shadow: var(--shadow-sm); scrollbar-width: thin; }
.product-tabs button { flex: 1 0 auto; min-width: 130px; padding: 13px 16px; color: #557087; background: transparent; border: 0; border-radius: 11px; cursor: pointer; font: 800 11px "Manrope", sans-serif; transition: color .2s, background .2s, box-shadow .2s; }
.product-tabs button:hover { color: var(--navy-950); background: #edf5fb; }
.product-tabs button.active { color: white; background: linear-gradient(115deg, #1568c7, #704ab8); box-shadow: 0 10px 23px rgba(40,96,175,.24); }
.product-tabs button:focus-visible { outline: 3px solid rgba(35,121,223,.3); outline-offset: 2px; }
.product-showcase { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 0; align-items: stretch; margin-top: 18px; overflow: hidden; background: white; border: 1px solid #cedde8; border-radius: 28px; box-shadow: 0 28px 70px rgba(12,48,78,.14); }
.product-browser { min-width: 0; background: #dfeaf2; }
.product-browser-bar { min-height: 45px; display: flex; align-items: center; gap: 7px; padding: 0 17px; color: #748b9d; background: #f7fafc; border-bottom: 1px solid #d6e2eb; font-size: 8px; letter-spacing: .08em; text-transform: uppercase; }
.product-browser-bar span { width: 8px; height: 8px; background: #d5e1e9; border-radius: 50%; }
.product-browser-bar span:first-child { background: #ff7b76; }.product-browser-bar span:nth-child(2) { background: #f5bc53; }.product-browser-bar span:nth-child(3) { background: #4cc59a; }
.product-browser-bar b { margin-left: auto; font-weight: 800; }
.product-image-wrap { position: relative; min-height: 390px; overflow: hidden; background: #e9f1f6; }
.product-image-wrap img { width: 100%; height: 100%; display: block; object-fit: cover; object-position: top left; transition: opacity .18s ease; }
.product-image-wrap img.switching { opacity: .3; }
.product-watermark { position: absolute; right: 13px; bottom: 13px; z-index: 2; padding: 7px 9px; color: rgba(255,255,255,.92); background: rgba(8,34,60,.76); border: 1px solid rgba(255,255,255,.22); border-radius: 8px; font: 800 7px "Manrope", sans-serif; letter-spacing: .12em; backdrop-filter: blur(7px); }
.product-caption { display: flex; flex-direction: column; justify-content: center; padding: 35px 30px; color: white; background: linear-gradient(145deg, #092b4a, #164f7c 72%, #554b7b); }
.product-caption small { color: #8fd1ff; font: 800 8px "Manrope", sans-serif; letter-spacing: .14em; }
.product-caption h3 { margin: 14px 0; font: 800 27px/1.15 "Manrope", sans-serif; letter-spacing: -.04em; }
.product-caption p { margin: 0; color: #c8dbe8; font-size: 12px; line-height: 1.7; }
.product-caption a { margin-top: 28px; color: white; font-size: 11px; font-weight: 800; }
.product-caption a span { display: inline-grid; place-items: center; width: 27px; height: 27px; margin-left: 7px; background: rgba(255,255,255,.11); border-radius: 50%; }
.essential-cta { display: inline-flex; width: auto; margin-top: 20px; color: white; border-color: rgba(255,255,255,.28); }

.offers-section { background: white; }
.offer-path { display: grid; grid-template-columns: 1fr 62px 1fr 62px 1fr; gap: 10px; align-items: stretch; }
.offer-tier { min-height: 430px; padding: 30px; background: #f8fbfd; border: 1px solid #d5e2eb; border-radius: 23px; box-shadow: 0 18px 40px rgba(14,51,83,.07); }
.offer-tier header { display: flex; justify-content: space-between; align-items: center; }
.offer-tier header > span { width: 39px; height: 39px; display: grid; place-items: center; color: var(--blue-700); background: #e4f1ff; border-radius: 12px; font: 800 10px "Manrope", sans-serif; }
.offer-tier header small { color: #7c93a6; font: 800 7px "Manrope", sans-serif; letter-spacing: .13em; }
.offer-tier h3 { margin: 34px 0 13px; font: 800 26px "Manrope", sans-serif; letter-spacing: -.035em; }
.offer-tier > p { min-height: 80px; margin: 0; color: var(--slate-600); font-size: 12px; line-height: 1.7; }
.offer-tier ul { display: grid; gap: 12px; padding: 22px 0 0; margin: 22px 0 0; border-top: 1px solid #dbe6ed; list-style: none; }
.offer-tier li { position: relative; padding-left: 21px; color: var(--slate-800); font-size: 11px; font-weight: 700; line-height: 1.45; }
.offer-tier li::before { content: "✓"; position: absolute; left: 0; color: var(--green); font-weight: 900; }
.modules-tier { background: linear-gradient(145deg, #f7fbfe, #f7f2fc); border-color: #d7cae9; }
.full-tier { color: white; background: linear-gradient(145deg, #0b3153, #1b5c8d 68%, #61507f); border-color: transparent; }
.full-tier header > span { color: white; background: rgba(255,255,255,.12); }.full-tier header small { color: #bcd5e5; }.full-tier > p { color: #c7dce9; }.full-tier ul { border-color: rgba(255,255,255,.14); }.full-tier li { color: white; }.full-tier li::before { color: #7ee0c2; }
.module-tags { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 25px; }
.module-tags span { padding: 8px 10px; color: #6848a0; background: white; border: 1px solid #ded3ec; border-radius: 9px; font-size: 9px; font-weight: 800; }
.offer-link { display: grid; align-content: center; justify-items: center; gap: 7px; color: #728b9e; text-align: center; }
.offer-link span { width: 35px; height: 35px; display: grid; place-items: center; color: var(--blue-700); background: #e8f2fa; border-radius: 50%; font-weight: 800; }
.offer-link small { font: 800 7px "Manrope", sans-serif; text-transform: uppercase; letter-spacing: .08em; }
.offer-note { display: grid; grid-template-columns: auto 1fr auto; gap: 20px; align-items: center; margin-top: 18px; padding: 17px 20px; background: #eef5fa; border: 1px solid #d6e3ec; border-radius: 14px; }
.offer-note > span { padding: 7px 9px; color: #1b6a58; background: #ddf4ec; border-radius: 8px; font: 800 8px "Manrope", sans-serif; text-transform: uppercase; letter-spacing: .08em; }
.offer-note p { margin: 0; color: var(--slate-600); font-size: 10px; line-height: 1.55; }.offer-note a { color: var(--blue-700); font-size: 10px; font-weight: 800; white-space: nowrap; }

.difference-section { background: #f3f7fa; }
.difference-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.difference-grid article { position: relative; min-height: 305px; padding: 29px; background: white; border: 1px solid #d6e2eb; border-radius: 22px; box-shadow: var(--shadow-sm); }
.difference-grid article > span { position: absolute; top: 25px; right: 26px; color: #a5b7c5; font: 800 10px "Manrope", sans-serif; }
.difference-icon { width: 51px; height: 51px; display: grid; place-items: center; margin-bottom: 45px; color: white; background: linear-gradient(135deg, #176dcb, #704ab9); border-radius: 15px; font-size: 19px; font-weight: 800; box-shadow: 0 12px 25px rgba(43,100,181,.2); }
.difference-grid article:nth-child(2) .difference-icon { background: linear-gradient(135deg, #128f70, #43b99a); }.difference-grid article:nth-child(3) .difference-icon { background: linear-gradient(135deg, #e35559, #d47a61); }
.difference-grid h3 { margin: 0 0 13px; font: 800 21px/1.25 "Manrope", sans-serif; letter-spacing: -.03em; }
.difference-grid p { margin: 0; color: var(--slate-600); font-size: 12px; line-height: 1.7; }

.assist-card { overflow: hidden; color: var(--navy-950); background: #f8fbfd; border: 1px solid rgba(255,255,255,.35); border-radius: 25px; box-shadow: 0 30px 70px rgba(3,23,41,.28); }
.assist-card-head { display: flex; justify-content: space-between; align-items: center; gap: 20px; padding: 21px; background: white; border-bottom: 1px solid #d9e5ed; }
.assist-card-head > span { display: flex; align-items: center; gap: 12px; }.assist-card-head i { width: 39px; height: 39px; display: grid; place-items: center; color: white; background: linear-gradient(135deg, #247bd1, #8151bf); border-radius: 12px; font-style: normal; }.assist-card-head small, .assist-card-head strong { display: block; }.assist-card-head small { color: #58778e; font-size: 7px; letter-spacing: .14em; }.assist-card-head strong { margin-top: 4px; font-size: 13px; }.assist-card-head > b { padding: 8px 10px; color: #176c58; background: #e2f4ee; border-radius: 8px; font-size: 7px; }
.assist-examples { display: grid; gap: 9px; max-height: 430px; padding: 18px; overflow: hidden; }
.assist-examples article { justify-self: end; max-width: 82%; padding: 11px 13px; background: #e6f0f8; border-radius: 13px 13px 3px 13px; }.assist-examples article span { color: #668398; font-size: 7px; font-weight: 800; }.assist-examples article p, .assist-examples > div p { margin: 4px 0 0; font-size: 10px; line-height: 1.5; }
.assist-examples > div { position: relative; max-width: 90%; padding: 13px 13px 13px 45px; background: white; border: 1px solid #d5e2eb; border-radius: 3px 13px 13px 13px; box-shadow: 0 9px 20px rgba(12,48,78,.06); }.assist-examples > div > i { position: absolute; top: 12px; left: 12px; width: 24px; height: 24px; display: grid; place-items: center; color: #6546a1; background: #eee8f8; border-radius: 8px; font-style: normal; }.assist-examples button { margin-top: 9px; padding: 7px 9px; color: var(--blue-700); background: #e8f2fb; border: 0; border-radius: 8px; font-size: 8px; font-weight: 800; }
.assist-guard { display: flex; gap: 11px; align-items: flex-start; padding: 16px 19px; color: #d4e5f1; background: #0c3457; }.assist-guard > span { width: 25px; height: 25px; display: grid; place-items: center; flex: 0 0 25px; color: #7ee0c2; background: rgba(126,224,194,.12); border-radius: 8px; font-weight: 900; }.assist-guard p { margin: 0; font-size: 9px; line-height: 1.55; }.assist-guard strong { color: white; }

.integrations-section { background: white; }
.integrations-grid { display: grid; grid-template-columns: .8fr 1.2fr; gap: 80px; align-items: center; }
.integration-copy h2 { margin: 13px 0 22px; font-size: clamp(43px, 5vw, 67px); line-height: 1.03; }.integration-copy > p { color: var(--slate-600); font-size: 16px; line-height: 1.75; }.integration-button { display: inline-flex; width: auto; margin-top: 18px; color: var(--blue-700); background: #e8f2fb; }
.integration-cards { display: grid; gap: 10px; }
.integration-cards article { display: grid; grid-template-columns: 47px 1fr; gap: 16px; padding: 20px; background: #f7fafc; border: 1px solid #d8e4ec; border-radius: 16px; }
.integration-cards article > span { width: 40px; height: 40px; display: grid; place-items: center; color: var(--blue-700); background: white; border: 1px solid #d9e6ee; border-radius: 12px; font: 800 9px "Manrope", sans-serif; }.integration-cards h3 { margin: 0; font: 800 16px "Manrope", sans-serif; }.integration-cards p { margin: 6px 0 9px; color: var(--slate-600); font-size: 10px; line-height: 1.55; }.integration-cards small { color: #7a92a4; font: 800 7px "Manrope", sans-serif; letter-spacing: .12em; }

.home-security-grid { position: relative; display: grid; grid-template-columns: repeat(5, 1fr); gap: 11px; }
.home-security-grid article { min-height: 255px; padding: 24px 21px; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.12); border-radius: 18px; }
.home-security-grid article > span { width: 36px; height: 36px; display: grid; place-items: center; margin-bottom: 42px; color: #9cd9ff; background: rgba(82,164,225,.14); border-radius: 11px; font: 800 8px "Manrope", sans-serif; }
.home-security-grid h3 { margin: 0 0 11px; font: 700 16px/1.3 "Manrope", sans-serif; }.home-security-grid p { margin: 0; color: #b9cfdd; font-size: 10px; line-height: 1.65; }
.security-home-footer { position: relative; display: grid; grid-template-columns: 1fr auto; gap: 25px; align-items: center; margin-top: 17px; padding: 18px 21px; color: #bcd2e1; background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.1); border-radius: 14px; }.security-home-footer p { margin: 0; font-size: 10px; line-height: 1.55; }.security-home-footer strong { color: white; }.security-home-footer a { color: #9edaff; font-size: 10px; font-weight: 800; white-space: nowrap; }

.faq-section { background: #f7fafc; }
.faq-grid { display: grid; grid-template-columns: .72fr 1.28fr; gap: 80px; align-items: start; }.faq-heading { position: sticky; top: 120px; }.faq-heading h2 { margin: 13px 0 22px; font-size: clamp(43px, 5vw, 66px); line-height: 1.03; }.faq-heading > p { color: var(--slate-600); font-size: 15px; line-height: 1.7; }.faq-list { display: grid; border-top: 1px solid #cad9e4; }.faq-list details { border-bottom: 1px solid #cad9e4; }.faq-list summary { display: flex; justify-content: space-between; gap: 25px; align-items: center; padding: 22px 0; cursor: pointer; font: 800 14px/1.4 "Manrope", sans-serif; list-style: none; }.faq-list summary::-webkit-details-marker { display: none; }.faq-list summary span { width: 29px; height: 29px; display: grid; place-items: center; flex: 0 0 29px; color: var(--blue-700); background: #e5f0f9; border-radius: 9px; transition: transform .2s; }.faq-list details[open] summary span { transform: rotate(45deg); }.faq-list details p { margin: -5px 50px 22px 0; color: var(--slate-600); font-size: 12px; line-height: 1.7; }
.demo-expectations { display: grid; gap: 10px; margin-top: 28px; }.demo-expectations > div { display: grid; grid-template-columns: 34px 1fr; gap: 12px; align-items: start; padding: 13px; background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.11); border-radius: 12px; }.demo-expectations span { width: 30px; height: 30px; display: grid; place-items: center; color: #9edaff; background: rgba(91,172,231,.14); border-radius: 9px; font: 800 8px "Manrope", sans-serif; }.demo-expectations p { margin: 0; color: #bad0df; font-size: 9px; line-height: 1.5; }.demo-expectations strong { display: block; margin-bottom: 3px; color: white; font-size: 10px; }

/* Pages Sécurité et À propos */
.subpage-body { background: #f4f8fb; }
.subpage-hero { position: relative; overflow: hidden; padding: 170px 0 90px; color: white; background: linear-gradient(125deg, #082640 0%, #15517e 68%, #675080 130%); }
.subpage-hero::after { content: ""; position: absolute; width: 650px; height: 650px; right: -180px; top: -280px; border: 1px solid rgba(255,255,255,.1); border-radius: 50%; box-shadow: inset 0 0 0 85px rgba(255,255,255,.025), inset 0 0 0 175px rgba(255,255,255,.025); }
.subpage-hero .shell { position: relative; z-index: 1; }.subpage-hero h1 { max-width: 900px; margin: 18px 0 22px; font: 800 clamp(48px,7vw,88px)/.99 "Manrope", sans-serif; letter-spacing: -.06em; }.subpage-hero p { max-width: 750px; margin: 0; color: #c8dce9; font-size: 18px; line-height: 1.75; }.subpage-hero .hero-actions { margin-top: 32px; }
.subpage-section { padding: 90px 0; }.subpage-section.alt { background: white; }.subpage-intro { display: grid; grid-template-columns: .75fr 1.25fr; gap: 80px; align-items: start; }.subpage-intro h2 { margin: 13px 0 0; font-size: clamp(39px,4.7vw,62px); line-height: 1.05; }.subpage-copy > p { margin: 0 0 20px; color: var(--slate-600); font-size: 16px; line-height: 1.75; }
.trust-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; margin-top: 38px; }.trust-card { min-height: 245px; padding: 26px; background: white; border: 1px solid #d5e2eb; border-radius: 20px; box-shadow: var(--shadow-sm); }.subpage-section.alt .trust-card { background: #f7fafc; }.trust-card > span { display: inline-flex; padding: 7px 9px; color: var(--blue-700); background: #e7f2fb; border-radius: 8px; font: 800 8px "Manrope", sans-serif; letter-spacing: .09em; }.trust-card h3 { margin: 30px 0 11px; font: 800 21px/1.25 "Manrope", sans-serif; }.trust-card p { margin: 0; color: var(--slate-600); font-size: 12px; line-height: 1.7; }
.status-legend { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 28px; }.status-legend span { padding: 9px 11px; border-radius: 9px; font-size: 9px; font-weight: 800; }.status-live { color: #11745d; background: #e1f5ee; }.status-gate { color: #915c0f; background: #fff0d5; }
.security-roadmap { display: grid; gap: 11px; margin-top: 35px; }.security-roadmap article { display: grid; grid-template-columns: auto 1fr; gap: 17px; align-items: start; padding: 21px; background: #f7fafc; border: 1px solid #d8e4ec; border-radius: 16px; }.security-roadmap article > span { padding: 7px 9px; color: #8d590d; background: #fff0d4; border-radius: 8px; font: 800 7px "Manrope", sans-serif; letter-spacing: .08em; white-space: nowrap; }.security-roadmap h3 { margin: 1px 0 6px; font: 800 16px "Manrope", sans-serif; }.security-roadmap p { margin: 0; color: var(--slate-600); font-size: 11px; line-height: 1.65; }
.subpage-callout { display: grid; grid-template-columns: 1fr auto; gap: 25px; align-items: center; padding: 30px; color: white; background: linear-gradient(120deg, #0a3154, #1d6597 70%, #65517f); border-radius: 22px; box-shadow: var(--shadow-lg); }.subpage-callout h2 { margin: 0 0 8px; font-size: 29px; }.subpage-callout p { margin: 0; color: #c6dbe9; font-size: 12px; line-height: 1.65; }
.principles-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 15px; margin-top: 40px; }.principles-grid article { min-height: 250px; padding: 27px; background: white; border: 1px solid #d5e2eb; border-radius: 20px; }.principles-grid span { color: #df575d; font: 800 10px "Manrope", sans-serif; }.principles-grid h3 { margin: 45px 0 12px; font: 800 21px "Manrope", sans-serif; }.principles-grid p { color: var(--slate-600); font-size: 12px; line-height: 1.7; }

@media (max-width: 1050px) {
  .product-showcase { grid-template-columns: 1fr; }.product-caption { min-height: 240px; }.product-image-wrap { min-height: 0; aspect-ratio: 16 / 9; }
  .offer-path { grid-template-columns: 1fr; }.offer-link { grid-template-columns: auto auto; justify-content: center; padding: 5px 0; }.offer-link span { transform: rotate(90deg); }.offer-tier { min-height: 0; }.offer-tier > p { min-height: 0; }
  .home-security-grid { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 920px) {
  .product-proof-heading, .integrations-grid, .faq-grid, .subpage-intro { grid-template-columns: 1fr; gap: 28px; }.faq-heading { position: static; }.product-tabs { width: calc(100% - 32px); }
  .difference-grid, .principles-grid { grid-template-columns: 1fr; }.difference-grid article { min-height: 250px; }.home-security-grid { grid-template-columns: 1fr 1fr; }
  .integration-copy { max-width: 700px; }.offer-note { grid-template-columns: 1fr; }.security-home-footer, .subpage-callout { grid-template-columns: 1fr; }
  .subpage-hero { padding-top: 130px; }.trust-grid { grid-template-columns: 1fr; }
}

@media (max-width: 590px) {
  .product-proof-heading h2, .integration-copy h2, .faq-heading h2, .subpage-intro h2 { font-size: 40px; }.product-proof-heading > p { font-size: 14px; }
  .product-tabs { width: calc(100% - 24px); margin-top: 28px; }.product-tabs button { min-width: 115px; }.product-showcase { width: calc(100% - 24px); border-radius: 20px; }.product-browser-bar b { display: none; }.product-image-wrap { aspect-ratio: 16 / 10; }.product-caption { min-height: 270px; padding: 28px 23px; }.product-caption h3 { font-size: 23px; }
  .offer-tier { padding: 24px; }.offer-note { width: calc(100% - 24px); }.difference-grid article { min-height: 0; }.home-security-grid { grid-template-columns: 1fr; }.home-security-grid article { min-height: 220px; }.security-home-footer { width: calc(100% - 24px); }
  .assist-card-head { align-items: flex-start; flex-direction: column; }.assist-examples article { max-width: 92%; }.integrations-grid { gap: 45px; }.faq-list summary { font-size: 12px; }
  .subpage-hero h1 { font-size: 47px; }.subpage-hero p { font-size: 15px; }.subpage-section { padding: 70px 0; }.trust-card { min-height: 0; }.security-roadmap article { grid-template-columns: 1fr; }.subpage-callout { padding: 25px 21px; }
}

/* --- Écosystème des rôles --- */
.role-ecosystem { min-height: 570px; overflow: hidden; background: linear-gradient(145deg, rgba(249,252,254,.98), rgba(235,244,250,.97)); }
.role-network { position: relative; min-height: 425px; margin-top: 12px; }
.network-orbit { position: absolute; left: 50%; top: 50%; border: 1px solid rgba(32,112,181,.15); border-radius: 50%; transform: translate(-50%,-50%); }
.network-orbit.orbit-a { width: 385px; height: 385px; background: radial-gradient(circle, rgba(63,144,209,.12), transparent 68%); }
.network-orbit.orbit-b { width: 265px; height: 265px; border-style: dashed; }
.network-core { position: absolute; z-index: 4; left: 50%; top: 50%; width: 185px; height: 185px; display: grid; align-content: center; justify-items: center; padding: 22px; text-align: center; color: white; background: linear-gradient(145deg, #0b3b64 0%, #176da8 60%, #6b4d94 120%); border: 6px solid rgba(255,255,255,.88); border-radius: 50%; box-shadow: 0 24px 50px rgba(10,54,90,.27); transform: translate(-50%,-50%); }
.network-core > span { width: 47px; height: 47px; display: grid; place-items: center; margin-bottom: 8px; overflow: hidden; background: white; border-radius: 14px; box-shadow: 0 8px 20px rgba(2,18,32,.18); }.network-core img { width: 44px; height: 44px; object-fit: contain; }.network-core small { color: #a9daf7; font: 800 6px "Manrope", sans-serif; letter-spacing: .14em; }.network-core strong { margin: 4px 0; font: 800 18px/1.1 "Manrope", sans-serif; }.network-core p { margin: 0; color: #d0e3ef; font-size: 7px; line-height: 1.35; }
.role-node { position: absolute; z-index: 3; min-width: 188px; display: grid; grid-template-columns: 42px 1fr; gap: 11px; align-items: center; padding: 12px; background: white; border: 1px solid #d4e2eb; border-radius: 15px; box-shadow: 0 13px 28px rgba(12,48,78,.11); }
.role-node::after { content: ""; position: absolute; z-index: -1; height: 1px; background: linear-gradient(90deg, #5ea8dd, #a776ca); transform-origin: left center; }
.role-node > span { width: 40px; height: 40px; display: grid; place-items: center; color: white; background: linear-gradient(135deg, #2176c8, #714ab5); border-radius: 12px; font: 800 8px "Manrope", sans-serif; }.role-node small, .role-node strong, .role-node p { display: block; }.role-node small { color: #7890a3; font-size: 6px; font-weight: 800; letter-spacing: .12em; }.role-node strong { margin-top: 3px; font: 800 12px "Manrope", sans-serif; }.role-node p { margin: 3px 0 0; color: var(--slate-600); font-size: 7px; }
.role-agent { left: 1%; bottom: 17%; }.role-agent::after { width: 128px; right: -114px; top: 17px; transform: rotate(-27deg); }
.role-guard { left: 4%; top: 15%; }.role-guard::after { width: 105px; right: -92px; bottom: 6px; transform: rotate(24deg); }
.role-center { right: 1%; bottom: 17%; }.role-center::after { width: 128px; left: -112px; top: 17px; transform: rotate(207deg); }
.role-services { right: 4%; top: 15%; }.role-services::after { width: 105px; left: -90px; bottom: 6px; transform: rotate(156deg); }
.role-direction { left: 50%; top: 1%; transform: translateX(-50%); }.role-direction::after { width: 76px; left: 50%; bottom: -42px; transform: rotate(90deg); }
.role-guard > span { background: linear-gradient(135deg, #e79720, #efb246); }.role-center > span { background: linear-gradient(135deg, #178d71, #39b99a); }.role-services > span { background: linear-gradient(135deg, #8050bd, #b572d4); }.role-direction > span { background: linear-gradient(135deg, #d64f5b, #f27b72); }
.role-flow { display: grid; grid-template-columns: auto auto auto auto auto auto auto 1fr; gap: 9px; align-items: center; padding: 12px 14px; color: #638096; background: white; border: 1px solid #d6e3eb; border-radius: 13px; font-size: 7px; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; }.role-flow i { color: var(--blue-600); font-style: normal; }.role-flow b { justify-self: end; color: #176f59; font-size: 7px; }

/* --- Catalogue métier structuré --- */
.module-families { display: grid; gap: 10px; margin-top: 22px; }
.module-families section { padding: 12px; background: rgba(255,255,255,.78); border: 1px solid #ddd2ec; border-radius: 12px; }
.module-families section > small { display: block; margin-bottom: 8px; color: #7552a6; font: 800 7px "Manrope", sans-serif; letter-spacing: .11em; }
.module-families p { display: flex; flex-wrap: wrap; gap: 5px; min-height: 0; margin: 0; }
.module-families span { padding: 6px 8px; color: #354f64; background: #f5f8fb; border: 1px solid #d8e3eb; border-radius: 7px; font-size: 7px; font-weight: 800; }

/* --- Intelligence opérationnelle --- */
.ai-operations-board { overflow: hidden; color: var(--navy-950); background: #f5f9fc; border: 1px solid rgba(255,255,255,.4); border-radius: 25px; box-shadow: 0 30px 70px rgba(3,23,41,.3); }
.ai-board-head { display: flex; justify-content: space-between; align-items: center; gap: 20px; padding: 19px 20px; background: white; border-bottom: 1px solid #d9e5ed; }.ai-board-head > span { display: flex; gap: 11px; align-items: center; }.ai-board-head i { width: 39px; height: 39px; display: grid; place-items: center; color: white; background: linear-gradient(135deg,#277bd0,#8650bd); border-radius: 12px; font-style: normal; }.ai-board-head small, .ai-board-head strong { display: block; }.ai-board-head small { color: #6d879a; font-size: 6px; font-weight: 800; letter-spacing: .14em; }.ai-board-head strong { margin-top: 4px; font-size: 13px; }.ai-board-head > b { color: #4f7188; font-size: 7px; }
.ai-question-strip { display: flex; gap: 7px; padding: 11px 17px; background: #eaf2f8; border-bottom: 1px solid #d6e2ea; }.ai-question-strip span { padding: 7px 9px; color: #315b78; background: white; border: 1px solid #d4e1e9; border-radius: 999px; font-size: 7px; font-weight: 700; }
.ai-situation-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; padding: 13px; }
.ai-situation-grid article { min-height: 150px; padding: 14px; background: white; border: 1px solid #d6e3eb; border-radius: 14px; box-shadow: 0 8px 20px rgba(12,48,78,.05); }.ai-situation-grid header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 15px; }.ai-situation-grid header > span { color: #718a9d; font: 800 6px "Manrope", sans-serif; letter-spacing: .12em; }.ai-situation-grid header b { padding: 5px 7px; border-radius: 6px; font-size: 6px; }.ai-situation-grid article > strong { font: 800 16px "Manrope", sans-serif; }.ai-situation-grid article > p { margin: 5px 0 12px; color: var(--slate-600); font-size: 8px; line-height: 1.5; }
.coverage header b { color: #9d5f08; background: #fff0d3; }.coverage > div > span { height: 6px; display: block; overflow: hidden; background: #e5edf3; border-radius: 999px; }.coverage > div i { height: 100%; display: block; background: linear-gradient(90deg,#1d83c8,#48b69b); border-radius: 999px; }.coverage > div small { display: block; margin-top: 6px; color: #71899b; font-size: 6px; }
.skills header b { color: #ae4650; background: #fde5e8; }.skills > em { display: inline-block; padding: 6px 8px; color: #176e59; background: #e3f4ee; border-radius: 7px; font-size: 7px; font-style: normal; font-weight: 800; }
.fma-focus header b { color: #6746a0; background: #eee7f7; }.fma-focus ul { display: grid; gap: 8px; padding: 0; margin: 0; list-style: none; }.fma-focus li { display: grid; grid-template-columns: 25px 1fr; gap: 8px; align-items: center; }.fma-focus li > i { width: 24px; height: 24px; display: grid; place-items: center; color: #6a4aa2; background: #eee8f7; border-radius: 7px; font-size: 7px; font-style: normal; font-weight: 800; }.fma-focus li strong, .fma-focus li small { display: block; }.fma-focus li strong { font-size: 8px; }.fma-focus li small { margin-top: 3px; color: #718a9d; font-size: 6px; }
.daily-brief header b { color: #176e59; background: #e2f4ee; }.daily-brief > p { display: grid; grid-template-columns: 1fr; gap: 2px; margin: 0; padding: 6px 0; border-bottom: 1px solid #e2eaf0; }.daily-brief > p:last-child { border-bottom: 0; }.daily-brief p strong { font-size: 8px; }.daily-brief p span { color: #718a9d; font-size: 6px; }
.ai-recommendation { display: grid; grid-template-columns: 31px 1fr auto; gap: 11px; align-items: center; padding: 14px 15px; color: #d7e7f2; background: linear-gradient(110deg,#0d3a60,#205f8f 68%,#624f81); }.ai-recommendation > span { width: 30px; height: 30px; display: grid; place-items: center; background: rgba(255,255,255,.1); border-radius: 9px; }.ai-recommendation p { margin: 0; font-size: 7px; line-height: 1.5; }.ai-recommendation small, .ai-recommendation strong { display: block; }.ai-recommendation small { color: #98d4fa; font-size: 6px; font-weight: 800; letter-spacing: .12em; }.ai-recommendation strong { margin: 3px 0; color: white; font-size: 8px; }.ai-recommendation button { padding: 8px 9px; color: white; background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.18); border-radius: 8px; font-size: 7px; font-weight: 800; }

@media (max-width: 1050px) {
  .role-ecosystem { max-width: 760px; }
  .ai-operations-board { max-width: 720px; }
}

@media (max-width: 590px) {
  .role-ecosystem { min-height: auto; }.role-network { min-height: auto; display: grid; grid-template-columns: 1fr; gap: 8px; padding: 12px 0; }.network-orbit { display: none; }.network-core, .role-node { position: relative; inset: auto; width: auto; height: auto; min-width: 0; transform: none; }.network-core { grid-template-columns: 42px 1fr; justify-items: start; gap: 11px; align-items: center; padding: 13px; border: 0; border-radius: 15px; text-align: left; }.network-core > span { grid-row: 1 / 4; margin: 0; }.network-core small, .network-core strong, .network-core p { grid-column: 2; }.network-core strong { margin: -7px 0; }.role-node::after { display: none; }.role-direction { order: 5; }.role-agent { order: 1; }.role-guard { order: 2; }.role-center { order: 3; }.role-services { order: 4; }.role-flow { grid-template-columns: repeat(7, auto); justify-content: center; }.role-flow b { grid-column: 1 / -1; justify-self: center; }
  .ai-question-strip { overflow-x: auto; }.ai-question-strip span { flex: 0 0 auto; }.ai-situation-grid { grid-template-columns: 1fr; }.ai-board-head { align-items: flex-start; flex-direction: column; }.ai-recommendation { grid-template-columns: 31px 1fr; }.ai-recommendation button { grid-column: 2; justify-self: start; }
}

/* --- Synthèse de la chaîne Cismic --- */
.cismic-synthesis { min-height: 570px; display: grid; grid-template-rows: auto 1fr auto; gap: 12px; overflow: hidden; background: radial-gradient(circle at 50% 43%, rgba(74,159,218,.19), transparent 39%), linear-gradient(145deg, rgba(251,253,255,.99), rgba(231,242,249,.98)); }
.cismic-synthesis::before { content: ""; position: absolute; width: 470px; height: 470px; left: 50%; top: 53%; border: 1px solid rgba(45,124,189,.1); border-radius: 50%; box-shadow: inset 0 0 0 72px rgba(49,131,197,.025), inset 0 0 0 145px rgba(91,77,165,.025); transform: translate(-50%,-50%); }
.synthesis-heading { position: relative; z-index: 2; display: flex; justify-content: center; align-items: center; gap: 12px; padding-bottom: 10px; text-align: left; border-bottom: 1px solid #d5e2eb; }.synthesis-heading > img { width: 42px; height: 42px; object-fit: contain; }.synthesis-heading small, .synthesis-heading strong { display: block; }.synthesis-heading small { color: #6b88a0; font: 800 6px "Manrope", sans-serif; letter-spacing: .14em; }.synthesis-heading strong { margin-top: 3px; font: 800 20px "Manrope", sans-serif; letter-spacing: -.035em; }
.synthesis-map { position: relative; z-index: 2; min-height: 372px; display: grid; grid-template-columns: 66px minmax(0,1fr) 66px; gap: 10px; align-items: center; }
.hierarchy-stack { display: grid; justify-items: center; align-content: center; }
.hierarchy-stack article { width: 100%; display: grid; grid-template-columns: 44px 1fr; gap: 12px; align-items: center; padding: 8px 12px; background: rgba(255,255,255,.94); border: 1px solid #d3e1eb; border-radius: 13px; box-shadow: 0 9px 22px rgba(11,49,80,.09); }.hierarchy-stack article > span { width: 40px; height: 40px; display: grid; place-items: center; color: white; border-radius: 11px; font: 800 8px "Manrope", sans-serif; }.hierarchy-stack article small, .hierarchy-stack article strong, .hierarchy-stack article p { display: block; }.hierarchy-stack article small { color: #718ba0; font: 800 6px "Manrope", sans-serif; letter-spacing: .1em; }.hierarchy-stack article strong { margin-top: 2px; font: 800 12px "Manrope", sans-serif; }.hierarchy-stack article p { margin: 2px 0 0; color: var(--slate-600); font-size: 7px; }.hierarchy-stack > i { position: relative; z-index: 2; width: 24px; height: 17px; display: grid; place-items: center; margin: -1px 0; color: white; background: linear-gradient(180deg,#4a9ad3,#256da9); border-radius: 0 0 9px 9px; font-size: 11px; font-style: normal; font-weight: 900; box-shadow: 0 4px 10px rgba(34,105,162,.18); }
.level-direction { width: 82% !important; }.level-services { width: 91% !important; }.level-center { width: 96% !important; }.level-guard { width: 91% !important; }.level-agent { width: 82% !important; }
.level-direction > span { background: linear-gradient(135deg,#d64e5c,#f07974); }.level-services > span { background: linear-gradient(135deg,#7949b2,#b36bd1); }.level-center > span { background: linear-gradient(135deg,#11866b,#37b496); }.level-guard > span { background: linear-gradient(135deg,#e58a14,#f1b13e); }.level-agent > span { background: linear-gradient(135deg,#176dd0,#6b49ba); }
.flow-rail { position: relative; min-height: 285px; display: flex; align-items: center; flex-direction: column; justify-content: center; text-align: center; }.flow-rail::before { content: ""; position: absolute; top: 23px; bottom: 23px; width: 2px; background: linear-gradient(180deg,rgba(54,135,198,.08),#3d8dca,rgba(54,135,198,.08)); }.flow-rail > span { position: relative; z-index: 2; width: 34px; height: 34px; display: grid; place-items: center; margin-bottom: 10px; color: white; background: linear-gradient(135deg,#1675c8,#6550b9); border: 5px solid #e4f0f8; border-radius: 50%; box-shadow: 0 8px 18px rgba(37,105,163,.2); font-size: 14px; }.flow-rail strong, .flow-rail small { position: relative; z-index: 2; display: block; padding: 4px; background: rgba(241,247,251,.92); }.flow-rail strong { max-width: 65px; font: 800 8px/1.35 "Manrope", sans-serif; }.flow-rail small { max-width: 64px; color: #6f899d; font-size: 6px; line-height: 1.4; }.flow-rail.downward > span { background: linear-gradient(135deg,#148d71,#3bb599); }
.synthesis-foundation { position: relative; z-index: 2; display: grid; grid-template-columns: 48px 1fr; gap: 11px; align-items: center; padding: 12px 14px; color: white; background: linear-gradient(105deg,#083c67,#146aa2 67%,#594d83); border-radius: 15px; box-shadow: 0 14px 30px rgba(10,54,90,.19); }.synthesis-foundation > span { width: 44px; height: 44px; display: grid; place-items: center; grid-row: 1 / 3; background: white; border-radius: 12px; }.synthesis-foundation img { width: 41px; height: 41px; object-fit: contain; }.synthesis-foundation small, .synthesis-foundation strong, .synthesis-foundation p { display: block; }.synthesis-foundation small { color: #99d7fb; font: 800 6px "Manrope", sans-serif; letter-spacing: .14em; }.synthesis-foundation strong { margin-top: 2px; font: 800 10px "Manrope", sans-serif; }.synthesis-foundation p { margin: 2px 0 0; color: #c8ddeb; font-size: 7px; }.synthesis-foundation > b { grid-column: 1 / -1; padding-top: 8px; color: #b9d8eb; border-top: 1px solid rgba(255,255,255,.15); font: 800 6px "Manrope", sans-serif; text-align: center; text-transform: uppercase; letter-spacing: .08em; }

@media (max-width: 590px) {
  .cismic-synthesis { min-height: auto; padding: 14px; gap: 10px; }.synthesis-heading { justify-content: flex-start; }.synthesis-heading strong { font-size: 17px; }.synthesis-map { min-height: 360px; grid-template-columns: 1fr; }.flow-rail { display: none; }.hierarchy-stack { width: 100%; }.hierarchy-stack article, .level-direction, .level-services, .level-center, .level-guard, .level-agent { width: 100% !important; }.synthesis-foundation { grid-template-columns: 42px 1fr; }.synthesis-foundation > span { width: 40px; height: 40px; }.synthesis-foundation img { width: 37px; height: 37px; }
}

/* --- Anonymisation des écrans publics --- */
.public-redactions { position: absolute; inset: 0; z-index: 3; pointer-events: none; }
.public-redactions i { position: absolute; display: block; overflow: hidden; background: rgba(232,241,247,.66); border: 1px solid rgba(255,255,255,.72); border-radius: 7px; box-shadow: 0 2px 8px rgba(14,51,83,.08); backdrop-filter: blur(8px); }
.public-redactions .mask-account { left: 82.2%; top: 2.1%; width: 9.2%; height: 4.3%; background: rgba(232,241,247,.78); }
.guard-initial-replacement, .guard-name-replacement { position: absolute; display: none; }
.redaction-guard .guard-initial-replacement { left: 20.65%; top: 52%; width: 2.2%; height: 2.45%; display: grid; place-items: center; color: white; background: #0c3e69; border-radius: 5px; font: 800 clamp(4px,.48vw,7px) "Manrope",sans-serif; }
.redaction-guard .guard-name-replacement { display: block; min-width: 8%; padding: 1px 4px; color: #09243c; font: 700 clamp(4px,.48vw,7px) "DM Sans",sans-serif; line-height: 1.1; white-space: nowrap; }
.redaction-guard .guard-name-team { left: 22.55%; top: 52.38%; background: #f5faf8; }
.redaction-guard .guard-name-history { left: 40.55%; top: 93.72%; background: #fbfcfd; }

/* --- Workflows de bout en bout --- */
.workflow-section { overflow: hidden; background: linear-gradient(180deg,#f7fafc 0%,#edf4f8 100%); }
.workflow-heading { display: grid; grid-template-columns: 1.1fr .9fr; gap: 70px; align-items: end; }.workflow-heading h2 { margin: 13px 0 0; font-size: clamp(44px,5.2vw,70px); line-height: 1.03; }.workflow-heading > p { margin: 0 0 8px; color: var(--slate-600); font-size: 16px; line-height: 1.75; }
.workflow-tabs { display: grid; grid-template-columns: repeat(3,1fr); gap: 9px; margin-top: 42px; padding: 7px; background: white; border: 1px solid #d4e2eb; border-radius: 16px; box-shadow: var(--shadow-sm); }.workflow-tabs button { display: flex; align-items: center; gap: 11px; padding: 13px 15px; color: #557086; background: transparent; border: 0; border-radius: 11px; cursor: pointer; font: 800 10px "Manrope",sans-serif; text-align: left; }.workflow-tabs button > span { width: 29px; height: 29px; display: grid; place-items: center; flex: 0 0 29px; color: var(--blue-700); background: #e8f2fa; border-radius: 9px; font-size: 7px; }.workflow-tabs button.active { color: white; background: linear-gradient(115deg,#1265bf,#714bb4); box-shadow: 0 10px 23px rgba(40,96,175,.2); }.workflow-tabs button.active > span { color: white; background: rgba(255,255,255,.14); }.workflow-tabs button:focus-visible { outline: 3px solid rgba(35,121,223,.28); outline-offset: 2px; }
.workflow-stage { margin-top: 16px; }.workflow-panel { overflow: hidden; background: white; border: 1px solid #d3e1ea; border-radius: 25px; box-shadow: 0 24px 60px rgba(13,47,79,.11); }.workflow-panel[hidden] { display: none; }.workflow-panel > header { display: flex; justify-content: space-between; gap: 35px; align-items: center; padding: 26px 29px; color: white; background: linear-gradient(115deg,#082e50,#155985 68%,#5b4d7d); }.workflow-panel > header small { color: #9bd8fb; font: 800 7px "Manrope",sans-serif; letter-spacing: .13em; }.workflow-panel > header h3 { margin: 6px 0 0; font: 800 24px/1.2 "Manrope",sans-serif; letter-spacing: -.03em; }.workflow-panel > header > span { padding: 8px 10px; color: #c5dce9; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.13); border-radius: 9px; font-size: 8px; font-weight: 800; white-space: nowrap; }
.workflow-route { position: relative; display: grid; grid-template-columns: repeat(6,1fr); gap: 10px; padding: 30px 24px; }.workflow-route.five-steps { grid-template-columns: repeat(5,1fr); }.workflow-route::before { content: ""; position: absolute; left: 7%; right: 7%; top: 57px; height: 2px; background: linear-gradient(90deg,#438fc9,#8060b3,#2da084); }.workflow-route article { position: relative; z-index: 1; min-height: 245px; padding: 16px 14px; background: #f8fbfd; border: 1px solid #d6e3eb; border-radius: 16px; }.workflow-route article > b { position: absolute; top: -9px; right: 10px; width: 23px; height: 23px; display: grid; place-items: center; color: #5c7487; background: white; border: 1px solid #d6e2ea; border-radius: 50%; font: 800 7px "Manrope",sans-serif; box-shadow: 0 5px 12px rgba(13,47,79,.09); }.workflow-route article > i { width: 42px; height: 42px; display: grid; place-items: center; margin-bottom: 38px; color: white; border: 5px solid white; border-radius: 13px; box-shadow: 0 8px 20px rgba(24,81,128,.19); font: 800 8px "Manrope",sans-serif; font-style: normal; }.actor-agent { background: linear-gradient(135deg,#176dcc,#6549b2); }.actor-guard { background: linear-gradient(135deg,#e68b16,#f0b341); }.actor-center { background: linear-gradient(135deg,#11866b,#39b597); }.actor-service { background: linear-gradient(135deg,#7849b0,#ae68cd); }.actor-return { background: linear-gradient(135deg,#157a91,#28aa91); }.workflow-route article small { color: #6f899d; font: 800 6px "Manrope",sans-serif; letter-spacing: .11em; }.workflow-route article strong { display: block; margin: 8px 0 9px; font: 800 14px/1.25 "Manrope",sans-serif; }.workflow-route article p { margin: 0; color: var(--slate-600); font-size: 9px; line-height: 1.6; }
.workflow-panel > footer { display: flex; justify-content: space-between; gap: 24px; align-items: center; padding: 17px 22px; background: #eaf3f8; border-top: 1px solid #d4e1e9; }.workflow-panel > footer > div { display: flex; gap: 10px; align-items: center; }.workflow-panel > footer > div > span { width: 30px; height: 30px; display: grid; place-items: center; flex: 0 0 30px; color: #168066; background: #d9f1e9; border-radius: 9px; font-weight: 900; }.workflow-panel > footer p { margin: 0; color: var(--slate-600); font-size: 8px; line-height: 1.5; }.workflow-panel > footer p strong { display: block; color: var(--navy-950); font-size: 10px; }.workflow-panel > footer > b { color: var(--blue-700); font: 800 8px "Manrope",sans-serif; text-transform: uppercase; letter-spacing: .07em; white-space: nowrap; }
.workflow-more { display: grid; grid-template-columns: .8fr 1.2fr; gap: 28px; align-items: center; margin-top: 16px; padding: 20px 22px; background: rgba(255,255,255,.78); border: 1px solid #d3e1ea; border-radius: 18px; }.workflow-more small { display: block; margin-bottom: 5px; color: #6d889d; font: 800 7px "Manrope",sans-serif; letter-spacing: .12em; }.workflow-more strong { font: 800 14px "Manrope",sans-serif; }.workflow-more p { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 7px; margin: 0; }.workflow-more p span { padding: 8px 10px; color: #365b75; background: #edf5fa; border: 1px solid #d7e5ed; border-radius: 9px; font-size: 8px; font-weight: 800; }

@media (max-width: 1050px) {
  .workflow-route, .workflow-route.five-steps { grid-template-columns: repeat(3,1fr); }.workflow-route::before { display: none; }.workflow-route article { min-height: 220px; }
}

@media (max-width: 920px) {
  .workflow-heading { grid-template-columns: 1fr; gap: 25px; }.workflow-tabs { grid-template-columns: 1fr; }.workflow-panel > header { align-items: flex-start; flex-direction: column; }.workflow-panel > footer { align-items: flex-start; flex-direction: column; }.workflow-more { grid-template-columns: 1fr; }.workflow-more p { justify-content: flex-start; }
}

@media (max-width: 590px) {
  .workflow-heading h2 { font-size: 41px; }.workflow-tabs { width: calc(100% - 24px); }.workflow-stage { width: calc(100% - 24px); }.workflow-panel > header { padding: 22px 18px; }.workflow-panel > header h3 { font-size: 20px; }.workflow-panel > header > span { white-space: normal; }.workflow-route, .workflow-route.five-steps { grid-template-columns: 1fr; padding: 20px 15px; }.workflow-route article { min-height: 0; display: grid; grid-template-columns: 45px 1fr; column-gap: 12px; }.workflow-route article > i { grid-row: 1 / 4; margin: 0; }.workflow-route article > div { grid-column: 2; }.workflow-route article small, .workflow-route article strong, .workflow-route article p { grid-column: 2; }.workflow-route article strong { margin: 5px 0 7px; }.workflow-panel > footer > b { white-space: normal; line-height: 1.5; }.workflow-more { width: calc(100% - 24px); padding: 18px; }
}