/* BeeDigital – styles du site */

body{margin:0;min-width:1200px}a{color:#1673d6;text-decoration:none}
.page{display:none}.page.on{display:block;animation:pagein .5s ease}
@keyframes pagein{from{opacity:0}to{opacity:1}}
/* fonds animés */
.blob{position:absolute;border-radius:50%;filter:blur(60px);z-index:-1;animation:drift 14s ease-in-out infinite alternate}
.blob2{animation-duration:18s;animation-direction:alternate-reverse}
@keyframes drift{0%{transform:translate(0,0) scale(1)}50%{transform:translate(-40px,30px) scale(1.1)}100%{transform:translate(30px,-20px) scale(.95)}}
/* illustrations */
.anim-float{animation:float 4s ease-in-out infinite}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
.anim-bob{animation:float 3.5s ease-in-out infinite}
.anim-code{transform-box:fill-box;transform-origin:left center;animation:type 4s ease-in-out infinite}
@keyframes type{0%{transform:scaleX(0)}35%,85%{transform:scaleX(1);opacity:1}100%{transform:scaleX(1);opacity:0}}
.anim-wave{transform-box:view-box;transform-origin:308px 168px;animation:wave 2.4s ease-in-out infinite}
@keyframes wave{0%,100%{transform:rotate(0)}50%{transform:rotate(-12deg)}}
.anim-glow{animation:glow 2.6s ease-in-out infinite}
@keyframes glow{0%,100%{opacity:.55}50%{opacity:1}}
.anim-flow{stroke-dasharray:7 9;animation:flow 1s linear infinite}
@keyframes flow{to{stroke-dashoffset:-32}}
.anim-pulse{transform-box:fill-box;transform-origin:center;animation:pulse 2.2s ease-in-out infinite}
@keyframes pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.14)}}
.anim-bar{transform-box:fill-box;transform-origin:center bottom;animation:bar 3.5s ease-out infinite}
@keyframes bar{0%{transform:scaleY(.08)}40%,100%{transform:scaleY(1)}}
.anim-spin{animation:spin 20s linear infinite;transform-box:view-box}
@keyframes spin{to{transform:rotate(360deg)}}
.stack-grid,.proj-grid,.m-grid,.tech-grid,.svc-grid,.cert-grid{display:grid!important}
@media(max-width:1250px){.cert-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important}}@media(max-width:1000px){.cert-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}}@media(max-width:800px){.cert-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}}@media(max-width:560px){.cert-grid{grid-template-columns:1fr!important}}
@media(max-width:1100px){.svc-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}}@media(max-width:620px){.svc-grid{grid-template-columns:1fr!important}}
.tech-tile{transition:transform .25s,box-shadow .25s,background .25s}.tech-tile:hover{transform:translateY(-4px);background:#ffffff!important;box-shadow:0 10px 22px rgba(15,40,80,.10)}
.m-step:hover>div:first-child{transform:scale(1.08)}.m-step>div:first-child{transition:transform .3s}
@media(max-width:1000px){.proj-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}.m-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}.m-line{display:none}}
@media(max-width:760px){.stack-grid,.proj-grid{grid-template-columns:1fr!important}.tech-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}.m-grid{grid-template-columns:1fr!important}}
.cat-grid{display:grid!important;grid-template-columns:repeat(auto-fill,minmax(330px,1fr))}.cat-grid[style*="display: none"]{display:none!important}
@media(max-width:720px){.cat-grid{grid-template-columns:1fr}}
.dom-tile{transition:transform .25s ease,box-shadow .25s ease,border-color .25s}
.dom-tile:hover{transform:translateY(-6px);box-shadow:0 16px 32px rgba(15,40,80,.12)!important;border-color:#9cc9f5!important}
.dom-tile .dom-ico{transition:transform .35s ease,background .25s}
.dom-tile:hover .dom-ico{transform:rotate(-8deg) scale(1.1);background:#d8ebff!important}
.dom-tile:hover .dom-ico svg{animation:float 1.6s ease-in-out infinite}
.ai-tile{transition:transform .3s ease,box-shadow .3s ease,border-color .3s}
.ai-tile:hover{transform:translateY(-8px);box-shadow:0 20px 40px rgba(0,0,0,.35);border-color:#7cc4ff!important}
.ai-tile:hover svg{filter:brightness(1.15)}
.anim-scan{animation:scan 2.6s ease-in-out infinite}
@keyframes scan{0%,100%{transform:translateY(0)}50%{transform:translateY(130px)}}
.anim-blink{animation:blink 3s ease infinite}
@keyframes drive{0%,100%{transform:translateX(-10px)}50%{transform:translateX(14px)}}
.anim-drive{animation:drive 4s ease-in-out infinite}
@keyframes blink{0%,15%{opacity:.25}30%,100%{opacity:1}}
.anim-bounce{transform-box:fill-box;transform-origin:center bottom;animation:bounce 1.8s ease-in-out infinite}
@keyframes bounce{0%,100%{transform:translateY(0)}50%{transform:translateY(-12px)}}
.anim-ring{transform-box:fill-box;transform-origin:center;animation:ring 2s ease-out infinite}
@keyframes ring{0%{transform:scale(.5);opacity:.6}100%{transform:scale(1.7);opacity:0}}
/* interactions */
.page main div[style*="box-shadow: 0 6px 18px"],.page main article{transition:transform .25s ease,box-shadow .25s ease}
.page main div[style*="box-shadow: 0 6px 18px"]:hover,.page main article:hover{transform:translateY(-6px);box-shadow:0 18px 36px rgba(15,40,80,.14)!important}
.page main div[style*="box-shadow: 0 6px 18px"]:hover svg,.page main article:hover svg{animation-play-state:running}
.page a[style*="border-radius: 10px"],.page button{transition:transform .2s ease,box-shadow .2s ease,filter .2s}
.page a[style*="border-radius: 10px"]:hover,.page button:hover{transform:translateY(-2px);box-shadow:0 8px 18px rgba(22,115,214,.25);filter:brightness(1.05)}
.navlink:hover{color:#1673d6!important;border-bottom-color:#9cc9f5!important}
.page main div[style*="border-radius: 12px; background: #"] svg,.page main div[style*="border-radius: 32px"] svg{transition:transform .3s}
.page main div:hover > div[style*="border-radius: 12px; background: #"] svg{transform:rotate(-8deg) scale(1.12)}
/* apparition au défilement */
.photo-zoom img{transition:transform 6s ease}.photo-zoom:hover img{transform:scale(1.06)}
.reveal{opacity:0;transform:translateY(28px);transition:opacity .7s ease,transform .7s ease}
.reveal.in{opacity:1;transform:none}

.net{position:absolute;inset:0;width:100%;height:100%;z-index:-1;pointer-events:none}
.caret{display:inline-block;width:4px;height:.9em;background:#1673d6;margin-left:6px;vertical-align:-.08em;animation:caret 1s steps(1) infinite}
@keyframes caret{50%{opacity:0}}
.mq{mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.mq-track{display:flex;gap:14px;width:max-content;animation:mq 40s linear infinite}
.mq:hover .mq-track{animation-play-state:paused}
@keyframes mq{to{transform:translateX(-50%)}}
.mq-partner{display:inline-flex;align-items:center;justify-content:center;width:170px;height:84px;background:#ffffff;border-radius:14px;padding:12px 18px;box-sizing:border-box;box-shadow:0 6px 18px rgba(0,0,0,.18);transition:transform .25s}
.mq-partner:hover{transform:translateY(-4px) scale(1.04)}
.mq-partner img{max-width:100%;max-height:58px;display:block}
.partner-tile img{transition:transform .3s,filter .3s}.partner-tile:hover img{transform:scale(1.08)}
.mq-item{display:inline-flex;align-items:center;gap:10px;white-space:nowrap;color:#e2ecf8;font:600 15px Inter,sans-serif;padding:10px 18px;border:1px solid #23466f;border-radius:999px;background:rgba(255,255,255,.04)}
.mq-logo{min-width:34px;height:34px;padding:0 6px;box-sizing:border-box;border-radius:9px;display:inline-flex;align-items:center;justify-content:center;color:#fff;font:800 12px Inter,sans-serif;box-shadow:0 4px 12px rgba(0,0,0,.25),inset 0 0 0 1px rgba(255,255,255,.25)}
.mq-item{padding:7px 18px 7px 7px!important}
#progress{position:fixed;top:0;left:0;height:3px;width:0;background:linear-gradient(90deg,#1673d6,#16a3c9);z-index:50}
#totop{position:fixed;right:24px;bottom:24px;width:48px;height:48px;border-radius:24px;border:0;background:#1673d6;color:#fff;font:700 20px Inter,sans-serif;cursor:pointer;box-shadow:0 10px 24px rgba(22,115,214,.35);opacity:0;transform:translateY(20px);transition:opacity .3s,transform .3s;z-index:50}
#totop.show{opacity:1;transform:none}

.langbtn{min-height:30px;padding:0 14px;margin-inline-start:16px;border-radius:999px;border:1px solid #3a6290;background:rgba(255,255,255,.08);color:#ffffff;font:600 13px Cairo,Inter,sans-serif;cursor:pointer;display:inline-flex;align-items:center}
.langbtn:hover{background:#1673d6;border-color:#1673d6}
.langbtn{margin-inline-start:auto!important}
.lb-ar{display:none;font-family:Inter,sans-serif}html[lang=ar] .lb-ar{display:inline}html[lang=ar] .lb-fr{display:none}
html[dir=rtl] body,html[dir=rtl] .page *:not(svg):not(svg *){font-family:'Cairo',Inter,sans-serif!important;letter-spacing:0!important}
html[dir=rtl] [style*="text-align: left"]{text-align:right!important}
html[dir=rtl] th{text-align:right!important}
html[dir=rtl] .mq{direction:ltr}
html[dir=rtl] svg{direction:ltr}
html[dir=rtl] article span[style*="top: 14px; left: 14px"]{left:auto!important;right:14px}
html[dir=rtl] div[style*="left: 14px; top: 15px"]{left:auto!important;right:14px}
html[dir=rtl] input[type=search]{padding:0 42px 0 14px!important}
html[dir=rtl] .caret{margin-left:0;margin-right:6px}
html[dir=rtl] h1{line-height:1.35!important}
@media (prefers-reduced-motion: reduce){*,*::before,*::after{animation:none!important;transition:none!important}.reveal{opacity:1;transform:none}.net{display:none}}

/* Assistant de discussion */

#bee-chat{position:fixed;right:24px;bottom:24px;z-index:60;font-family:Inter,Cairo,sans-serif}
#totop{bottom:100px!important}
#bc-launch{width:62px;height:62px;border-radius:31px;border:0;background:linear-gradient(135deg,#1673d6,#16a3c9);box-shadow:0 12px 30px rgba(22,115,214,.45);cursor:pointer;display:flex;align-items:center;justify-content:center;position:relative;animation:bcpop .5s ease}
#bc-launch::before{content:"";position:absolute;inset:-6px;border-radius:50%;border:2px solid #16a3c9;animation:bcring 2.2s ease-out infinite}
#bc-launch:hover{transform:scale(1.06)}
@keyframes bcring{0%{transform:scale(.85);opacity:.8}100%{transform:scale(1.35);opacity:0}}
@keyframes bcpop{from{transform:scale(0)}to{transform:scale(1)}}
#bc-badge{position:absolute;top:-2px;right:-2px;min-width:20px;height:20px;border-radius:10px;background:#ef4444;color:#fff;font:700 11px Inter,sans-serif;display:flex;align-items:center;justify-content:center;border:2px solid #fff}
#bc-hint{position:absolute;right:76px;bottom:12px;background:#fff;color:#0b2545;font:600 14px Inter,Cairo,sans-serif;padding:10px 14px;border-radius:14px 14px 4px 14px;box-shadow:0 10px 26px rgba(15,40,80,.18);white-space:nowrap;animation:bcpop .4s ease 1.2s both}
#bc-hint.off{display:none}
#bc-panel{position:absolute;right:0;bottom:78px;width:370px;height:540px;max-height:calc(100vh - 120px);background:#fff;border-radius:20px;box-shadow:0 24px 60px rgba(11,37,69,.28);display:flex;flex-direction:column;overflow:hidden;transform-origin:bottom right;animation:bcopen .28s ease}
#bc-panel[hidden]{display:none}
@keyframes bcopen{from{opacity:0;transform:translateY(16px) scale(.96)}to{opacity:1;transform:none}}
#bc-head{background:linear-gradient(120deg,#0b2545,#1366c2);color:#fff;padding:16px 16px;display:flex;gap:12px;align-items:center}
#bc-avatar{width:44px;height:44px;border-radius:22px;background:#fff;display:flex;align-items:center;justify-content:center;flex-shrink:0;box-shadow:0 4px 12px rgba(0,0,0,.18);position:relative}#bc-avatar img{width:34px;height:34px;display:block}#bc-avatar::after{content:'';position:absolute;right:0;bottom:1px;width:11px;height:11px;border-radius:6px;background:#22c55e;border:2px solid #fff}
.bc-row{display:flex;gap:8px;align-items:flex-end;align-self:flex-start;max-width:90%}.bc-row .bc-msg{max-width:none}.bc-row>img{width:28px;height:28px;flex-shrink:0;border-radius:14px;background:#fff;box-shadow:0 2px 6px rgba(15,40,80,.15)}
#bc-title{font-weight:700;font-size:16px}
#bc-status{font-size:12px;color:#cfe3f7;display:flex;align-items:center;gap:6px}
#bc-status span{width:8px;height:8px;border-radius:4px;background:#4ade80;box-shadow:0 0 8px #4ade80}
#bc-status b{font-weight:500}
#bc-close{width:36px;height:36px;border-radius:18px;border:0;background:rgba(255,255,255,.15);color:#fff;font-size:16px;cursor:pointer}
#bc-body{flex:1;overflow-y:auto;padding:16px;background:#f6f9fc;display:flex;flex-direction:column;gap:10px}
.bc-msg{max-width:84%;padding:10px 14px;border-radius:16px;font-size:14px;line-height:21px;animation:bcmsg .25s ease;white-space:pre-line}
@keyframes bcmsg{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.bc-bot{background:#fff;color:#1f2a37;border:1px solid #e3eaf3;align-self:flex-start;border-bottom-left-radius:4px}
.bc-user{background:#1673d6;color:#fff;align-self:flex-end;border-bottom-right-radius:4px}
.bc-links{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.bc-links a{font-size:13px;font-weight:600;color:#1673d6;background:#e7f2ff;padding:6px 10px;border-radius:8px}
.bc-links a.wa{background:#dcfce7;color:#15803d}
.bc-typing{display:flex;gap:4px;padding:14px}
.bc-typing i{width:7px;height:7px;border-radius:4px;background:#94a3b8;animation:bcdot 1s infinite}
.bc-typing i:nth-child(2){animation-delay:.15s}.bc-typing i:nth-child(3){animation-delay:.3s}
@keyframes bcdot{0%,60%,100%{transform:translateY(0);opacity:.5}30%{transform:translateY(-5px);opacity:1}}
#bc-quick{display:flex;gap:6px;overflow-x:auto;padding:10px 12px;background:#fff;border-top:1px solid #eef2f7}
#bc-quick button{flex-shrink:0;border:1px solid #cfd8e3;background:#fff;color:#0b2545;border-radius:999px;padding:7px 12px;font:600 12.5px Inter,Cairo,sans-serif;cursor:pointer}
#bc-quick button:hover{border-color:#1673d6;color:#1673d6}
#bc-form{display:flex;gap:8px;padding:12px;border-top:1px solid #eef2f7;background:#fff}
#bc-input{flex:1;min-width:0;height:44px;border:1px solid #c5d0dc;border-radius:22px;padding:0 16px;font:400 14px Inter,Cairo,sans-serif}
#bc-input:focus{outline:2px solid #9cc9f5;border-color:#1673d6}
#bc-send{width:44px;height:44px;border-radius:22px;border:0;background:#1673d6;cursor:pointer;display:flex;align-items:center;justify-content:center}
.bc-sr{position:absolute;left:-9999px}
html[dir=rtl] #bc-panel{direction:rtl}
html[dir=rtl] #bc-panel *{font-family:Cairo,Inter,sans-serif!important}
html[dir=rtl] #bc-send svg{transform:scaleX(-1)}
html[dir=rtl] .bc-bot{border-bottom-left-radius:16px;border-bottom-right-radius:4px}
html[dir=rtl] .bc-user{border-bottom-right-radius:16px;border-bottom-left-radius:4px}