:root {
  --forest: #073f2d;
  --forest-2: #0b563b;
  --leaf: #4d9a45;
  --teal: #08798a;
  --navy: #102e44;
  --cream: #f7f6ef;
  --mist: #edf2ec;
  --white: #fff;
  --ink: #172620;
​
/* Bandeau cookies compact — 2026-07
/* EXPERTISES PREMIUM VISIBLE */
#services .service-grid-premium{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:24px!important}
#services .service-card{--a:#df6b44;--s:#fff0e8;display:flex!important;flex-direction:column!important;min-height:560px!important;padding:0!important;border:1px solid color-mix(in srgb,var(--a) 45%,#ddd)!important;border-radius:28px!important;background:#fff!important;overflow:hidden!important;box-shadow:0 18px 50px rgba(20,42,34,.11)!important;transition:.28s!important}
#services .service-card:hover{transform:translateY(-8px)!important;box-shadow:0 28px 65px color-mix(in srgb,var(--a) 22%,transparent)!important}
#services .service-card--seo{--a:#16a58e;--s:#e2faf4}#services .service-card--ai{--a:#7558d6;--s:#f0ebff}#services .service-card--automation{--a:#dc9540;--s:#fff4dc}#services .service-card--security{--a:#dd596b;--s:#ffeaee}#services .service-card--maintenance{--a:#3586d3;--s:#e8f3ff}#services .service-card--hosting{--a:#4e72bd;--s:#edf2ff}#services .service-card--training{--a:#9861c4;--s:#f6edff}
#services .service-card-top{position:relative!important;display:block!important;height:220px!important;min-height:220px!important;background:radial-gradient(circle at 50% 28%,#fff 0 8%,var(--s) 62%,color-mix(in srgb,var(--a) 18%,#fff))!important;border-bottom:1px solid color-mix(in srgb,var(--a) 22%,#eee)!important;overflow:hidden!important}
#services .service-number{position:absolute!important;z-index:9;top:18px!important;left:18px!important;width:44px!important;height:44px!important;display:grid!important;place-items:center!important;border-radius:50%!important;background:var(--a)!important;color:#fff!important;font:800 13px/1 system-ui!important}
#services .service-visual{position:absolute!important;inset:30px!important;display:grid!important;place-items:center!important;transform:perspective(700px) rotateX(5deg) rotateY(-5deg)!important;filter:drop-shadow(0 18px 16px rgba(25,42,36,.2))!important}
#services .service-visual>*{position:absolute!important;display:block!important}
#services .visual-browser,#services .visual-window,#services .visual-chart,#services .visual-brain,#services .visual-gear,#services .visual-shield,#services .visual-cloud,#services .visual-cap{width:165px!important;height:120px!important;display:grid!important;place-items:center!important;border:9px solid #fff!important;border-radius:22px!important;background:linear-gradient(145deg,color-mix(in srgb,var(--a) 58%,#fff),var(--a))!important;color:#fff!important;font-size:52px!important;box-shadow:0 14px 0 color-mix(in srgb,var(--a) 60%,#263c35),0 22px 30px rgba(20,40,33,.2)!important}
#services .visual-chart{display:flex!important;align-items:flex-end!important;justify-content:center!important;gap:12px!important;padding:20px!important}
#services .visual-chart i{position:static!important;width:26px!important;border-radius:7px!important;background:#fff!important}#services .visual-chart i:nth-child(1){height:35px}#services .visual-chart i:nth-child(2){height:60px}#services .visual-chart i:nth-child(3){height:82px}
#services .visual-shield{clip-path:polygon(50% 0,95% 18%,85% 73%,50% 100%,15% 73%,5% 18%);border-radius:0!important}
#services .visual-orb,#services .visual-search,#services .visual-spark,#services .visual-flow,#services .visual-ring,#services .visual-check,#services .visual-server,#services .visual-book{z-index:3;right:16px!important;bottom:-4px!important;width:60px!important;height:60px!important;display:grid!important;place-items:center!important;border:9px solid #fff!important;border-radius:50%!important;background:var(--a)!important;color:#fff!important;box-shadow:0 10px 16px rgba(0,0,0,.16)!important}
#services .service-content{display:flex!important;flex:1!important;flex-direction:column!important;padding:25px 27px 28px!important}
#services .service-kicker{color:var(--a)!important;text-transform:uppercase!important;letter-spacing:.12em!important;font-weight:800!important}
#services .service-content h3{color:#17372e!important;font-size:26px!important}
#services .service-content li:before{color:var(--a)!important}#services .service-content>p:last-child{margin-top:auto!important}#services .service-content a{color:var(--a)!important;font-weight:800!important}
@media(max-width:1050px){#services .service-grid-premium{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media(max-width:680px){#services .service-grid-premium{grid-template-columns:1fr!important}#services .service-card{min-height:520px!important}.site-header .main-nav{left:12px!important;right:12px!important;width:auto!important;max-width:calc(100vw - 24px)!important;overflow-y:auto!important}}
-27 */
/* EXPERTISES PREMIUM V4 */
#services .service-grid-premium{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:24px!important}
#services .service-card{--a:#df6b44;--s:#fff0e8;display:flex!important;flex-direction:column!important;min-height:560px!important;padding:0!important;border:1px solid var(--a)!important;border-radius:28px!important;background:#fff!important;overflow:hidden!important;box-shadow:0 18px 48px #17372e1c!important;transition:.28s!important}
#services .service-card:hover{transform:translateY(-8px)!important;box-shadow:0 28px 65px #17372e2b!important}
#services .service-card--seo{--a:#16a58e;--s:#e2faf4}#services .service-card--ai{--a:#7558d6;--s:#f0ebff}#services .service-card--automation{--a:#dc9540;--s:#fff4dc}#services .service-card--security{--a:#dd596b;--s:#ffeaee}#services .service-card--maintenance{--a:#3586d3;--s:#e8f3ff}#services .service-card--hosting{--a:#4e72bd;--s:#edf2ff}#services .service-card--training{--a:#9861c4;--s:#f6edff}
#services .service-card-top{position:relative!important;display:block!important;height:220px!important;min-height:220px!important;background:radial-gradient(circle at 50% 25%,#fff,var(--s))!important;border-bottom:1px solid var(--a)!important;overflow:hidden!important}
#services .service-number{position:absolute!important;z-index:9;top:18px!important;left:18px!important;width:44px!important;height:44px!important;display:grid!important;place-items:center!important;border-radius:50%!important;background:var(--a)!important;color:#fff!important;font-weight:800!important}
#services .service-visual{position:absolute!important;inset:28px!important;display:grid!important;place-items:center!important;transform:perspective(700px) rotateX(5deg) rotateY(-5deg)!important;filter:drop-shadow(0 18px 16px #192a2433)!important}
#services .service-visual>*{position:absolute!important;display:grid!important;place-items:center!important}
#services .visual-browser,#services .visual-window,#services .visual-chart,#services .visual-brain,#services .visual-gear,#services .visual-shield,#services .visual-cloud,#services .visual-cap{width:165px!important;height:120px!important;border:9px solid #fff!important;border-radius:22px!important;background:linear-gradient(145deg,var(--s),var(--a))!important;color:#fff!important;font-size:52px!important;box-shadow:0 14px 0 var(--a),0 23px 30px #1428212e!important}
#services .visual-chart{display:flex!important;align-items:flex-end!important;justify-content:center!important;gap:12px!important;padding:20px!important}
#services .visual-chart i{position:static!important;width:26px!important;border-radius:7px!important;background:#fff!important}#services .visual-chart i:nth-child(1){height:35px}#services .visual-chart i:nth-child(2){height:60px}#services .visual-chart i:nth-child(3){height:82px}
#services .visual-shield{clip-path:polygon(50% 0,95% 18%,85% 73%,50% 100%,15% 73%,5% 18%);border-radius:0!important}
#services .visual-orb,#services .visual-search,#services .visual-spark,#services .visual-flow,#services .visual-ring,#services .visual-check,#services .visual-server,#services .visual-book{z-index:3;right:15px!important;bottom:-4px!important;width:60px!important;height:60px!important;border:9px solid #fff!important;border-radius:50%!important;background:var(--a)!important;color:#fff!important}
#services .service-content{display:flex!important;flex:1!important;flex-direction:column!important;padding:25px 27px 28px!important}#services .service-kicker,#services .service-content a{color:var(--a)!important;font-weight:800!important}#services .service-content>p:last-child{margin-top:auto!important}
@media(max-width:1050px){#services .service-grid-premium{grid-template-columns:repeat(2,minmax(0,1fr))!important}}@media(max-width:680px){#services .service-grid-premium{grid-template-columns:1fr!important}#services .service-card{min-height:520px!important}.site-header .main-nav{left:12px!important;right:12px!important;width:auto!important;max-width:calc(100vw - 24px)!important;overflow-y:auto!important}}

.cookieadmin_law_container.cookieadmin_box{left:12px!important;right:auto!important;bottom:12px!important;width:calc(100vw - 24px)!important;max-width:360px!important;margin:0!important}
.cookieadmin_law_container .cookieadmin_consent_inside{padding:14px!important;border-radius:14px!important;box-shadow:0 10px 30px rgba(0,29,57,.18)!important}
.cookieadmin_law_container #cookieadmin_notice_title{margin:0 0 6px!important;font-size:15px!important;line-height:1.25!important}
.cookieadmin_law_container #cookieadmin_notice{margin:0!important;font-size:12px!important;line-height:1.35!important}
.cookieadmin_law_container .cookieadmin_notice_con{margin:0 0 10px!important}
.cookieadmin_law_container .cookieadmin_consent_btns{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:6px!important}
.cookieadmin_law_container .cookieadmin_consent_btns .cookieadmin_btn{grid-column:auto!important;min-width:0!important;min-height:34px!important;margin:0!important;padding:6px 4px!important;border-radius:8px!important;font-size:11px!important;line-height:1.15!important;font-weight:600!important}
.cookieadmin_law_container .cookieadmin-poweredby{margin:7px 0 0!important;font-size:9px!important;line-height:1!important;opacity:.55!important;transform:none!important}
@media(max-width:380px){.cookieadmin_law_container.cookieadmin_box{left:7px!important;bottom:7px!important;width:calc(100vw - 14px)!important}.cookieadmin_law_container .cookieadmin_consent_inside{padding:12px!important}.cookieadmin_law_container .cookieadmin_consent_btns .cookieadmin_btn{font-size:10px!important}}
​
  --muted: #65736c;
  --line: rgba(7, 63, 45, .13);
  --shadow: 0 24px 70px rgba(9, 47, 34, .13);
  --radius: 24px;
  --container: 1180px;
}
​
* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 90px; }
body { margin: 0; color: var(--ink); background: var(--white); font-family: "DM Sans", sans-serif; font-size: 16px; line-height: 1.65; -webkit-font-smoothing: antialiased; }
body.menu-open { overflow: hidden; }
img { display: block; max-width: 100%; height: auto; }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; }
.container { width: min(calc(100% - 40px), var(--container)); margin-inline: auto; }
.narrow { max-width: 820px; }
.screen-reader-text { 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; left: 20px; top: -100px; background: var(--white); padding: 12px 18px; z-index: 1000; border-radius: 8px; box-shadow: var(--shadow); }
.skip-link:focus { top: 20px; }
​
h1, h2, h3 { margin: 0; color: var(--forest); font-family: "Manrope", sans-serif; line-height: 1.08; letter-spacing: -.045em; }
h1 { font-size: clamp(3rem, 6vw, 5.5rem); font-weight: 700; }
h2 { font-size: clamp(2.35rem, 4.5vw, 4rem); font-weight: 700; }
h3 { font-size: 1.35rem; }
h1 em, h2 em { color: var(--teal); font-family: Georgia, serif; font-weight: 400; }
.eyebrow { display: flex; align-items: center; gap: 10px; margin: 0 0 22px; color: var(--forest); font-size: .73rem; font-weight: 700; letter-spacing: .17em; text-transform: uppercase; }
.eyebrow span { width: 34px; height: 2px; background: var(--leaf); }
.eyebrow.light { color: #c7e1d5; }
.eyebrow.light span { background: #75b66b; }
.button { display: inline-flex; align-items: center; justify-content: center; gap: 12px; min-height: 54px; padding: 0 25px; color: var(--white); background: var(--forest); border: 1px solid var(--forest); border-radius: 100px; font-weight: 700; white-space: nowrap; cursor: pointer; transition: transform .25s, background .25s, box-shadow .25s; }
.button:hover, .button:focus-visible { transform: translateY(-2px); background: var(--teal); border-color: var(--teal); box-shadow: 0 12px 30px rgba(8,121,138,.2); }
.button-small { min-height: 44px; padding: 0 19px; font-size: .88rem; }
.button-light { color: var(--forest); background: var(--white); border-color: var(--white); }
.button-full { width: 100%; border: 0; }
.section { padding: 120px 0; }
.section-heading { display: grid; grid-template-columns: 1.4fr .6fr; align-items: end; gap: 60px; margin-bottom: 58px; }
.section-heading > p { max-width: 430px; margin: 0 0 5px; color: var(--muted); font-size: 1.06rem; }
​
.site-header { position: fixed; inset: 0 0 auto; z-index: 100; transition: background .3s, box-shadow .3s; }
.site-header.scrolled { background: rgba(255,255,255,.92); box-shadow: 0 8px 30px rgba(13,50,38,.08); backdrop-filter: blur(14px); }
.header-inner { display: flex; align-items: center; justify-content: space-between; min-height: 88px; }
.brand { position: relative; z-index: 2; display: flex; flex-direction: column; align-items: flex-start; flex: 0 0 auto; min-width: 248px; }
.brand-name { color: var(--navy); font-family: Georgia, serif; font-size: 1.78rem; line-height: 1; letter-spacing: -.035em; white-space: nowrap; }
.brand-name strong { position: relative; color: var(--forest); font-weight: 400; }
.brand-name strong::after { position: absolute; content: ""; left: 0; right: 0; bottom: -7px; height: 1px; background: var(--leaf); }
.brand-tagline { margin-top: 10px; color: var(--forest); font-size: .48rem; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; white-space: nowrap; }
.main-nav { display: flex; align-items: center; gap: 34px; }
.menu { display: flex; align-items: center; gap: 30px; margin: 0; padding: 0; list-style: none; }
.menu a { position: relative; color: #30473d; font-size: .92rem; font-weight: 600; }
.menu a::after { position: absolute; content: ""; left: 0; right: 100%; bottom: -6px; height: 2px; background: var(--leaf); transition: right .25s; }
.menu a:hover::after, .menu a:focus-visible::after { right: 0; }
.menu-toggle { display: none; width: 44px; height: 44px; padding: 11px 9px; border: 0; background: transparent; }
.menu-toggle > span:not(.screen-reader-text) { display: block; width: 26px; height: 2px; margin: 5px 0; background: var(--forest); transition: .25s; }
​
.hero { position: relative; min-height: 100vh; padding: 155px 0 0; overflow: hidden; background: linear-gradient(135deg, #fbfcf8 0%, #f2f6ef 56%, #eaf3f2 100%); }
.hero::before { position: absolute; content: ""; inset: 0; background-image: radial-gradient(rgba(6,61,43,.08) 1px, transparent 1px); background-size: 23px 23px; mask-image: linear-gradient(90deg, transparent 5%, #000 55%, transparent 95%); opacity: .45; }
.hero-grid { position: relative; display: grid; grid-template-columns: 1.04fr .96fr; align-items: center; gap: 70px; min-height: 600px; }
.hero-copy { position: relative; z-index: 2; }
.hero-copy h1 { max-width: 720px; }
.hero-lead { max-width: 620px; margin: 28px 0 32px; color: #52665c; font-size: 1.14rem; line-height: 1.7; }
.hero-actions { display: flex; align-items: center; gap: 26px; }
.text-link { color: var(--forest); font-weight: 700; }
.text-link span { margin-left: 5px; color: var(--teal); }
.hero-proof { display: flex; align-items: center; gap: 15px; margin-top: 48px; color: var(--muted); font-size: .79rem; line-height: 1.45; }
.hero-proof p { margin: 0; }
.hero-proof strong { color: var(--forest); }
.avatars { display: flex; padding-left: 8px; }
.avatars span { display: grid; place-items: center; width: 37px; height: 37px; margin-left: -8px; color: white; border: 3px solid #f5f8f3; border-radius: 50%; background: var(--teal); font-size: .63rem; font-weight: 700; }
.avatars span:nth-child(2) { background: var(--leaf); }.avatars span:nth-child(3) { background: var(--navy); }
.hero-visual { position: relative; min-height: 520px; }
.visual-card { position: absolute; top: 40px; right: 0; width: 88%; padding: 10px; background: rgba(255,255,255,.72); border: 1px solid rgba(255,255,255,.75); border-radius: 28px; box-shadow: var(--shadow); transform: rotate(2deg); backdrop-filter: blur(12px); }
.visual-top { display: flex; align-items: center; gap: 6px; padding: 10px 13px 17px; }
.visual-top > span { width: 8px; height: 8px; border-radius: 50%; background: #c8d8d0; }
.visual-top small { margin-left: auto; color: #829087; font-size: .65rem; }
.visual-body { min-height: 390px; padding: 42px; color: white; background: linear-gradient(145deg, var(--forest), #0c664e); border-radius: 21px; overflow: hidden; }
.visual-label { color: #cce2d8; font-size: .75rem; letter-spacing: .14em; text-transform: uppercase; }
.chart { display: flex; align-items: end; gap: 12px; height: 190px; margin: 28px 0 35px; padding: 0 5px 20px; border-bottom: 1px solid rgba(255,255,255,.25); }
.chart i { flex: 1; height: 25%; border-radius: 8px 8px 3px 3px; background: linear-gradient(#86c97d, #3f9c69); box-shadow: inset 0 1px rgba(255,255,255,.3); }
.chart i:nth-child(2) { height: 38%; }.chart i:nth-child(3) { height: 34%; }.chart i:nth-child(4) { height: 59%; }.chart i:nth-child(5) { height: 76%; }.chart i:nth-child(6) { height: 96%; background: linear-gradient(#79d4d6, var(--teal)); }
.visual-stats { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.visual-stats div { padding: 17px; background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.12); border-radius: 14px; }
.visual-stats strong, .visual-stats span { display: block; }.visual-stats strong { font-size: 1.5rem; }.visual-stats span { color: #bfd6ca; font-size: .72rem; }
.float-card { position: absolute; z-index: 3; display: flex; align-items: center; gap: 12px; padding: 14px 17px; background: white; border: 1px solid var(--line); border-radius: 15px; box-shadow: 0 18px 40px rgba(11,57,41,.16); }
.float-card div { display: flex; flex-direction: column; }.float-card strong { color: var(--forest); font-size: .84rem; }.float-card small { color: var(--muted); font-size: .67rem; }
.float-card-one { left: 0; bottom: 90px; }.float-card-two { right: -25px; top: 15px; }
.float-icon { display: grid; place-items: center; width: 33px; height: 33px; color: white; background: var(--leaf); border-radius: 50%; font-weight: 700; }
.pulse { width: 12px; height: 12px; border-radius: 50%; background: var(--teal); box-shadow: 0 0 0 7px rgba(8,121,138,.12); }
.hero-orb { position: absolute; border-radius: 50%; filter: blur(2px); }.hero-orb-one { top: 22%; right: -110px; width: 420px; height: 420px; background: rgba(8,121,138,.07); }.hero-orb-two { left: -150px; bottom: 10%; width: 330px; height: 330px; background: rgba(77,154,69,.08); }
.trust-row { position: relative; display: flex; align-items: center; justify-content: space-between; gap: 35px; margin-top: 45px; padding: 25px 0; border-top: 1px solid var(--line); }
.trust-row p { margin: 0; color: var(--muted); font-size: .76rem; }.trust-row div { display: flex; gap: 45px; color: #6f8177; font-size: .68rem; font-weight: 700; letter-spacing: .12em; }
​
.services { background: var(--white); }
.service-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.service-card { position: relative; min-height: 475px; padding: 36px 32px; border: 1px solid var(--line); border-radius: var(--radius); transition: transform .3s, box-shadow .3s; }
.service-card:hover { transform: translateY(-6px); box-shadow: var(--shadow); }
.service-card.featured { background: var(--forest); border-color: var(--forest); box-shadow: 0 24px 50px rgba(7,63,45,.18); }
.service-number { position: absolute; top: 28px; right: 30px; color: #93a39a; font-family: "Manrope"; font-size: .75rem; font-weight: 700; }
.service-icon { display: grid; place-items: center; width: 64px; height: 64px; margin-bottom: 50px; color: var(--teal); background: var(--mist); border-radius: 18px; font-size: 2rem; }
.service-card h3 { font-size: 1.55rem; }.service-card > p { min-height: 100px; color: var(--muted); font-size: .95rem; }
.service-card ul { margin: 25px 0 0; padding: 22px 0 0; border-top: 1px solid var(--line); list-style: none; }
.service-card li { position: relative; margin: 9px 0; padding-left: 20px; color: #44574d; font-size: .85rem; }.service-card li::before { position: absolute; content: "↗"; left: 0; color: var(--leaf); }
.service-card.featured h3, .service-card.featured li { color: white; }.service-card.featured > p { color: #bad0c5; }.service-card.featured .service-icon { color: white; background: rgba(255,255,255,.12); }.service-card.featured ul { border-color: rgba(255,255,255,.16); }.service-card.featured .service-number { color: #8eb0a1; }
​
.method { color: white; background: var(--forest); }
.method-grid { display: grid; grid-template-columns: .82fr 1.18fr; gap: 105px; align-items: start; }
.method h2 { color: white; }.method h2 em { color: #80c976; }.method-intro > p:not(.eyebrow) { max-width: 430px; margin: 28px 0 35px; color: #b6cfc3; }
.steps { margin: 0; padding: 0; list-style: none; counter-reset: item; }
.steps li { display: grid; grid-template-columns: 65px 1fr; gap: 26px; padding: 26px 0; border-top: 1px solid rgba(255,255,255,.14); }
.steps li:last-child { border-bottom: 1px solid rgba(255,255,255,.14); }.steps > li > span { display: grid; place-items: center; width: 48px; height: 48px; color: #90c78b; border: 1px solid rgba(144,199,139,.4); border-radius: 50%; font-size: .74rem; font-weight: 700; }
.steps h3 { color: white; font-size: 1.32rem; }.steps p { margin: 7px 0 0; color: #a9c1b5; font-size: .9rem; }
​
.projects { background: var(--cream); }
.project-grid { display: grid; grid-template-columns: 1.15fr .85fr; gap: 28px; align-items: start; }
.project-card { display: block; overflow: hidden; background: white; border-radius: var(--radius); box-shadow: 0 18px 50px rgba(25,53,41,.08); transition: transform .3s, box-shadow .3s; }
.project-card:hover, .project-card:focus-visible { transform: translateY(-6px); box-shadow: 0 28px 65px rgba(25,53,41,.15); outline: none; }
.project-mockup { display: grid; place-items: center; min-height: 420px; padding: 55px; overflow: hidden; }
.project-elegance .project-mockup { background: linear-gradient(145deg, #efe3e4, #cdaeb2); }.project-fo .project-mockup { min-height: 360px; background: linear-gradient(145deg, #e8e1db, #d79b76); }
.mock-window { width: 100%; min-height: 280px; padding: 18px; background: #fff9f7; border-radius: 13px; box-shadow: 0 25px 45px rgba(70,35,42,.2); transform: rotate(-4deg); }
.mock-window > span { display: block; width: 28%; height: 8px; background: #6d2537; border-radius: 6px; }.mock-hero { margin-top: 25px; padding: 44px 35px; color: #fff7f3; background: linear-gradient(rgba(73,22,37,.25), rgba(73,22,37,.25)), #8e5262; border-radius: 8px; font-family: Georgia,serif; font-size: 2.2rem; line-height: 1.05; }
.phone { width: 190px; height: 340px; padding: 10px; background: #173c4e; border-radius: 28px; box-shadow: 0 25px 50px rgba(16,46,68,.28); transform: rotate(5deg); }.phone-screen { height: 100%; padding: 45px 18px; background: #f7faf9; border-radius: 20px; }.phone-screen span,.phone-screen strong { display: block; }.phone-screen span { color: #6e7d78; font-size: .6rem; }.phone-screen strong { margin: 7px 0 25px; color: var(--navy); font-size: 1.3rem; }.phone-screen i { display: block; height: 42px; margin: 9px 0; background: #dce9e8; border-radius: 8px; }.phone-screen i:nth-child(3) { background: linear-gradient(90deg, var(--teal) 72%, #dce9e8 72%); }
.project-meta { display: flex; align-items: center; justify-content: space-between; padding: 25px 28px 28px; }.project-meta span { color: var(--teal); font-size: .67rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }.project-meta h3 { margin-top: 6px; font-size: 1.5rem; }.project-meta > strong { display: grid; place-items: center; width: 45px; height: 45px; color: var(--forest); border: 1px solid var(--line); border-radius: 50%; }
.projects-note { margin: 42px 0 0; text-align: center; color: var(--muted); }.projects-note a { color: var(--teal); font-weight: 700; }
​
.about-grid { display: grid; grid-template-columns: .9fr 1.1fr; gap: 100px; align-items: center; }
.about-visual { position: relative; display: grid; place-items: center; min-height: 540px; background: radial-gradient(circle at 50% 40%, white 0 28%, transparent 29%), linear-gradient(145deg, #edf3e9, #dceae1); border-radius: 50% 50% 28px 28px; overflow: hidden; }
.about-visual::before, .about-visual::after { position: absolute; content: ""; border: 1px solid rgba(7,63,45,.12); border-radius: 50%; }.about-visual::before { width: 440px; height: 440px; }.about-visual::after { width: 350px; height: 350px; }
.about-visual img { position: relative; z-index: 2; width: 74%; mix-blend-mode: multiply; }
.about-badge { position: absolute; z-index: 3; right: 24px; bottom: 25px; display: grid; place-items: center; width: 110px; height: 110px; color: white; background: var(--teal); border: 6px solid white; border-radius: 50%; text-align: center; font-size: .73rem; font-weight: 700; line-height: 1.3; transform: rotate(7deg); }
.about-lead { color: var(--forest)!important; font-size: 1.2rem!important; font-weight: 600; }.about-copy > p:not(.eyebrow) { color: var(--muted); }
.values { margin-top: 35px; border-top: 1px solid var(--line); }.values > div { display: grid; grid-template-columns: 120px 1fr; gap: 20px; padding: 17px 0; border-bottom: 1px solid var(--line); }.values strong { color: var(--forest); }.values span { color: var(--muted); font-size: .9rem; }
​
.testimonial { padding: 100px 0; color: white; background: linear-gradient(120deg, var(--navy), #0a5a61); text-align: center; }.testimonial .container { max-width: 900px; }.quote-mark { display: block; height: 50px; color: #72beb1; font-family: Georgia,serif; font-size: 5rem; line-height: 1; }.testimonial blockquote { margin: 20px 0 28px; font-family: Georgia,serif; font-size: clamp(1.55rem, 3vw, 2.35rem); line-height: 1.45; }.quote-author { display: flex; justify-content: center; align-items: center; gap: 12px; }.quote-author > span { display: grid; place-items: center; width: 42px; height: 42px; color: var(--navy); background: #a8d6c5; border-radius: 50%; font-size: .7rem; font-weight: 700; }.quote-author p { margin: 0; color: #b9d2d1; font-size: .76rem; text-align: left; }.quote-author strong { color: white; }
​
.faq { background: #fbfcf9; }.faq-grid { display: grid; grid-template-columns: .7fr 1.3fr; gap: 110px; }.faq-grid > div:first-child > p:last-child { max-width: 350px; color: var(--muted); }.accordion details { border-top: 1px solid var(--line); }.accordion details:last-child { border-bottom: 1px solid var(--line); }.accordion summary { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 24px 0; color: var(--forest); cursor: pointer; list-style: none; font-size: 1.05rem; font-weight: 700; }.accordion summary::-webkit-details-marker { display: none; }.accordion summary span { font-size: 1.5rem; font-weight: 400; transition: transform .25s; }.accordion details[open] summary span { transform: rotate(45deg); }.accordion details p { margin: -5px 50px 24px 0; color: var(--muted); font-size: .92rem; }
​
.contact { padding: 115px 0; color: white; background: var(--forest); }.contact-grid { display: grid; grid-template-columns: .85fr 1.15fr; gap: 100px; align-items: start; }.contact h2 { color: white; }.contact h2 em { color: #81c67b; }.contact-copy > p:not(.eyebrow) { max-width: 460px; margin: 25px 0 38px; color: #b6cfc3; }.contact-detail { display: flex; align-items: center; gap: 16px; margin: 18px 0; }.contact-detail > span { display: grid; place-items: center; width: 42px; height: 42px; color: #9bd296; background: rgba(255,255,255,.08); border-radius: 50%; }.contact-detail div { display: flex; flex-direction: column; }.contact-detail small { color: #8da99c; }.contact-detail a,.contact-detail p { margin: 0; color: white; font-weight: 600; }
.contact-form { padding: 38px; color: var(--ink); background: white; border-radius: var(--radius); box-shadow: 0 30px 70px rgba(0,0,0,.2); }.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }.contact-form label { display: block; margin-bottom: 18px; color: #345044; font-size: .78rem; font-weight: 700; }.contact-form input,.contact-form select,.contact-form textarea { display: block; width: 100%; margin-top: 7px; padding: 13px 14px; color: var(--ink); background: #f6f8f5; border: 1px solid #dce5df; border-radius: 9px; outline: none; transition: border .2s, box-shadow .2s; }.contact-form input:focus,.contact-form select:focus,.contact-form textarea:focus { border-color: var(--teal); box-shadow: 0 0 0 3px rgba(8,121,138,.1); }.contact-form textarea { resize: vertical; }.honeypot { position: absolute!important; left: -9999px!important; }.form-privacy { margin: 11px 0 0; color: #819087; font-size: .66rem; text-align: center; }.form-notice { padding: 12px 15px; border-radius: 8px; font-size: .84rem; }.form-notice.success { color: #145e3d; background: #e5f5e9; }.form-notice.error { color: #8b2f2f; background: #fce9e9; }
​
.site-footer { padding: 70px 0 25px; background: #f3f5f0; }.footer-grid { display: grid; grid-template-columns: 1.5fr repeat(3, 1fr); gap: 55px; }.footer-brand img { width: 190px; height: 105px; object-fit: cover; object-position: top; }.footer-brand p { color: var(--muted); font-size: .82rem; }.footer-title { margin: 0 0 15px!important; color: var(--forest)!important; font-size: .78rem!important; font-weight: 700; text-transform: uppercase; letter-spacing: .12em; }.footer-grid > div:not(.footer-brand) { display: flex; flex-direction: column; align-items: flex-start; }.footer-grid a,.footer-grid p:not(.footer-title) { margin: 5px 0; color: var(--muted); font-size: .82rem; }.footer-grid a:hover { color: var(--teal); }.footer-bottom { display: flex; justify-content: space-between; margin-top: 50px; padding-top: 22px; color: #849087; border-top: 1px solid var(--line); font-size: .73rem; }
​
.content-page, .error-page { min-height: 70vh; padding: 160px 0 100px; }.content-page h1,.error-page h1 { margin-bottom: 35px; font-size: clamp(2.7rem,5vw,4.7rem); }.entry-content { color: #45574f; }.entry-content h2 { margin: 2.2em 0 .6em; font-size: 2rem; }.entry-content a { color: var(--teal); text-decoration: underline; }.error-page { display: grid; place-items: center; text-align: center; }.error-page p:not(.eyebrow) { color: var(--muted); }.error-page .eyebrow { justify-content: center; }
​
.reveal { opacity: 0; transform: translateY(24px); transition: opacity .7s ease, transform .7s ease; }.reveal.visible { opacity: 1; transform: translateY(0); }.reveal-delay { transition-delay: .15s; }
​
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } *,*::before,*::after { animation-duration: .01ms!important; transition-duration: .01ms!important; } .reveal { opacity: 1; transform: none; } }
​
@media (max-width: 980px) {
  .section { padding: 90px 0; }.menu-toggle { position: relative; z-index: 102; display: block; cursor: pointer; }.menu-toggle[aria-expanded="true"] > span:nth-child(1) { transform: translateY(7px) rotate(45deg); }.menu-toggle[aria-expanded="true"] > span:nth-child(2) { opacity: 0; }.menu-toggle[aria-expanded="true"] > span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
  .main-nav { position: fixed; inset: 0; display: flex; flex-direction: column; justify-content: center; padding: 90px 30px 40px; background: rgba(248,250,246,.98); opacity: 0; visibility: hidden; transform: translateY(-15px); transition: .25s; }.main-nav.is-open { opacity: 1; visibility: visible; transform: translateY(0); }.main-nav .menu { flex-direction: column; gap: 24px; }.main-nav .menu a { font-family: Manrope,sans-serif; font-size: 1.45rem; }
  .hero { padding-top: 125px; }.hero-grid { grid-template-columns: 1fr; gap: 10px; }.hero-copy { max-width: 700px; }.hero-visual { min-height: 500px; }.visual-card { width: min(520px,88%); right: 8%; }.trust-row { margin-top: 10px; }.trust-row div { gap: 20px; }
  .section-heading { grid-template-columns: 1fr; gap: 22px; }.service-grid { grid-template-columns: 1fr 1fr; }.service-card:last-child { grid-column: 1/-1; min-height: 380px; }.method-grid,.about-grid,.faq-grid,.contact-grid { grid-template-columns: 1fr; gap: 60px; }.method-intro { max-width: 650px; }.project-grid { grid-template-columns: 1fr; }.project-card:nth-child(2) { max-width: 78%; margin-left: auto; }.about-visual { max-width: 650px; width: 100%; margin-inline: auto; }.footer-grid { grid-template-columns: 1.4fr 1fr 1fr; }.footer-grid > div:last-child { grid-column: 2; }
}
​
@media (max-width: 680px) {
  .container { width: min(calc(100% - 30px), var(--container)); }.header-inner { min-height: 76px; }.brand { min-width: 0; }.brand-name { font-size: 1.38rem; }.brand-tagline { display: none; }.hero { padding-top: 115px; }.hero-grid { min-height: auto; }.hero-actions { align-items: flex-start; flex-direction: column; gap: 17px; }.hero-proof { margin-top: 35px; }.hero-visual { min-height: 400px; }.visual-card { top: 35px; right: 0; width: 96%; }.visual-body { min-height: 315px; padding: 28px; }.chart { height: 140px; }.float-card-one { left: -5px; bottom: 32px; }.float-card-two { right: -5px; top: 8px; }.trust-row { align-items: flex-start; flex-direction: column; }.trust-row div { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 30px; }.section { padding: 75px 0; }.section-heading { margin-bottom: 38px; }.service-grid { grid-template-columns: 1fr; }.service-card,.service-card:last-child { min-height: auto; grid-column: auto; }.service-card > p { min-height: auto; }.method-grid { gap: 45px; }.steps li { grid-template-columns: 52px 1fr; gap: 15px; }.project-mockup { min-height: 310px; padding: 32px; }.project-blue .project-mockup { min-height: 330px; }.project-card:nth-child(2) { max-width: 100%; }.about-grid { gap: 45px; }.about-visual { min-height: 400px; }.about-badge { width: 90px; height: 90px; }.values > div { grid-template-columns: 1fr; gap: 4px; }.testimonial { padding: 75px 0; }.faq-grid,.contact-grid { gap: 40px; }.contact { padding: 75px 0; }.contact-form { padding: 25px 20px; }.form-row { grid-template-columns: 1fr; gap: 0; }.footer-grid { grid-template-columns: 1fr 1fr; gap: 35px; }.footer-brand { grid-column: 1/-1; }.footer-grid > div:last-child { grid-column: auto; }.footer-bottom { align-items: flex-start; flex-direction: column; gap: 6px; }.content-page,.error-page { padding-top: 130px; }
}

/* Nos expertises — cartes premium 3D, 2026-07-28 */
body.home #services{position:relative;overflow:hidden;background:linear-gradient(180deg,#f5fbf9 0%,#fff 48%,#f3faf8 100%)}
body.home #services::before{content:"";position:absolute;width:520px;height:520px;right:-230px;top:20px;border-radius:50%;background:radial-gradient(circle,rgba(16,185,129,.13),transparent 68%);pointer-events:none}
body.home #services .service-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:24px!important}
body.home #services .service-card{--accent:#087f5b;--soft:#d9f7ea;position:relative!important;display:block!important;min-height:405px!important;padding:32px 32px 30px 206px!important;border:1px solid color-mix(in srgb,var(--accent) 16%,transparent)!important;border-radius:28px!important;background:linear-gradient(135deg,var(--soft),#fff 43%,#fff)!important;box-shadow:0 18px 52px rgba(15,54,49,.1),inset 0 1px 0 #fff!important;overflow:hidden!important;transition:transform .35s ease,box-shadow .35s ease!important}
body.home #services .service-card:nth-child(1){--accent:#087f5b;--soft:#ddf8ed}body.home #services .service-card:nth-child(2){--accent:#2563eb;--soft:#e5edff}body.home #services .service-card:nth-child(3){--accent:#7c3aed;--soft:#efe8ff}body.home #services .service-card:nth-child(4){--accent:#ea580c;--soft:#ffecdf}body.home #services .service-card:nth-child(5){--accent:#dc2626;--soft:#ffe6e6}body.home #services .service-card:nth-child(6){--accent:#0891b2;--soft:#e0f8fc}body.home #services .service-card:nth-child(7){--accent:#4f46e5;--soft:#e8e7ff}body.home #services .service-card:nth-child(8){--accent:#ca8a04;--soft:#fff4d2}
body.home #services .service-card:hover{transform:translateY(-9px)!important;box-shadow:0 28px 72px rgba(15,54,49,.17)!important}
body.home #services .service-card::before{content:"";position:absolute;left:25px;top:75px;width:150px;height:165px;border-radius:34px;background:linear-gradient(145deg,#fff,var(--soft));box-shadow:17px 20px 30px rgba(25,62,58,.14),inset -8px -8px 16px rgba(255,255,255,.7),inset 7px 7px 17px rgba(255,255,255,.9);transform:perspective(500px) rotateY(9deg) rotateX(3deg);transition:transform .35s ease;z-index:0}
body.home #services .service-card:hover::before{transform:perspective(500px) rotateY(0) rotateX(0) translateY(-4px)}
body.home #services .service-card::after{content:"";position:absolute;left:52px;top:107px;width:82px;height:82px;border-radius:24px;background:linear-gradient(145deg,color-mix(in srgb,var(--accent) 58%,white),var(--accent));box-shadow:10px 13px 20px color-mix(in srgb,var(--accent) 30%,transparent);transform:rotate(-6deg);z-index:1}
body.home #services .service-number{position:absolute!important;left:25px!important;top:27px!important;right:auto!important;display:inline-flex!important;align-items:center;justify-content:center;width:46px;height:30px;border-radius:999px;background:var(--soft);color:var(--accent)!important;font-size:.75rem!important;font-weight:850;letter-spacing:.12em}
body.home #services .service-icon{position:absolute!important;left:52px!important;top:107px!important;width:82px!important;height:82px!important;margin:0!important;display:grid!important;place-items:center;color:#fff!important;font-size:38px!important;font-weight:800;line-height:1!important;z-index:2!important;filter:drop-shadow(0 6px 9px color-mix(in srgb,var(--accent) 35%,transparent));transform:rotate(-6deg)}
body.home #services h3{margin:0 0 14px!important;font-size:clamp(1.42rem,2vw,1.85rem)!important;line-height:1.12!important;color:#102a27!important}
body.home #services .service-card>p{min-height:0!important;color:#49625e!important;line-height:1.65!important}
body.home #services ul{display:flex!important;flex-wrap:wrap;gap:8px;margin:20px 0 24px!important;padding:0!important;list-style:none!important}
body.home #services li{margin:0!important;padding:7px 11px!important;border:1px solid color-mix(in srgb,var(--accent) 17%,transparent);border-radius:999px;background:rgba(255,255,255,.78);color:#38524e;font-size:.76rem;font-weight:650}
body.home #services li::before{display:none!important}
body.home #services a{color:var(--accent)!important;font-weight:800!important;text-decoration:none!important}
@media(max-width:1000px){body.home #services .service-card{padding-left:178px!important}body.home #services .service-card::before{left:20px;width:128px}body.home #services .service-card::after,body.home #services .service-icon{left:43px!important}}
@media(max-width:760px){body.home #services .service-grid{grid-template-columns:1fr!important}body.home #services .service-card{min-height:360px!important}}
@media(max-width:520px){body.home #services .service-card{padding:142px 22px 24px!important;min-height:0!important;border-radius:22px!important}body.home #services .service-number{left:22px!important;top:20px!important}body.home #services .service-card::before{left:auto;right:20px;top:21px;width:104px;height:104px;border-radius:25px}body.home #services .service-card::after,body.home #services .service-icon{left:auto!important;right:41px!important;top:41px!important;width:62px!important;height:62px!important;font-size:28px!important}}