:root{--accent:#ffb400;--link:#3498db;--link-hover:#1d6fa5;--primary-hover:#217dbb;--text:#333;--muted:#777;--dark:#111;--gray-bg:#ecf0f1;--line:rgb(0 0 0 / .1);--gutter:20px;--nav-height:80px;--radius:2px}@font-face{font-family:poppins;font-weight:300;font-display:swap;src:url(/assets/fonts/poppins-300.woff2)format('woff2')}@font-face{font-family:poppins;font-weight:400;font-display:swap;src:url(/assets/fonts/poppins-400.woff2)format('woff2')}@font-face{font-family:poppins;font-weight:500;font-display:swap;src:url(/assets/fonts/poppins-500.woff2)format('woff2')}@font-face{font-family:poppins;font-weight:600;font-display:swap;src:url(/assets/fonts/poppins-600.woff2)format('woff2')}@font-face{font-family:poppins;font-weight:700;font-display:swap;src:url(/assets/fonts/poppins-700.woff2)format('woff2')}*,*::before,*::after{box-sizing:border-box}html{background:var(--dark);-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:transparent;scroll-padding-top:77px;scrollbar-gutter:stable;&:has(dialog[open]) { overflow:hidden; }}body{position:relative;margin:0;background:var(--dark);color:var(--text);font:16px/1.5 poppins,helvetica neue,Helvetica,Arial,sans-serif}.no-anim *,.no-anim *::before,.no-anim *::after{transition:none!important;animation:none!important}.reveal{opacity:0}.revealed{animation:reveal 700ms cubic-bezier(.2,.7,.3,1)backwards;animation-delay:calc(var(--i,0) * 90ms)}@keyframes reveal{from{opacity:0;translate:0 24px}}h1,h2,h3,h4,h5{font-weight:500;line-height:1.1;& small { font-weight: normal; line-height: 1; color: var(--muted); }}h1,h2,h3{margin:24px 0 12px;& small { font-size: 65%; }}h4,h5{margin:12px 0;& small { font-size: 75%; }}h1{font-size:41px}h2{font-size:34px}h3{font-size:28px}h4{font-size:20px}h5{font-size:16px}p{margin:0 0 12px}ul{margin:0 0 12px;& ul { margin-bottom: 0; }}small{font-size:87%}hr{height:0;margin:48px 0;border:0;border-top:1px solid var(--line)}a{color:var(--link);text-decoration:none;&:hover,&:focus { color:var(--link-hover); text-decoration:underline; }}:focus:not(:focus-visible){outline:none}img{vertical-align:middle}button,input,textarea{margin:0;font:inherit;color:inherit}button{cursor:pointer}label{display:inline-block;max-width:100%;margin-bottom:5px;font-weight:500}.text-center{text-align:center}.text-right{text-align:right}.text-muted{color:var(--muted)}.img-responsive{display:block;max-width:100%;height:auto}.img-circle{border-radius:50%}.spacer{height:40px}@media(min-width:768px){.xs-only{display:none}}@media(min-width:992px){.lt-md{display:none}}@media(max-width:991px){.md-up{display:none}}.container{margin-inline:auto;padding-inline:var(--gutter);@media(min-width:768px){width: 760px;}@media(min-width:992px){width: 980px;}@media(min-width:1200px){width: 1180px;}}.row{display:flex;flex-wrap:wrap;margin-inline:calc(-1 * var(--gutter));& > * { flex: 0 0 100%; min-width: 0; } & > hr { margin-top: 36px; }}[class*=" col-"],[class^=col-]{position:relative;min-height:1px;padding-inline:var(--gutter)}.col-sm-2{--sm:2}.col-sm-4{--sm:4}.col-sm-6{--sm:6}.col-sm-8{--sm:8}.col-sm-10{--sm:10}.col-md-4{--md:4}.col-md-6{--md:6}.col-lg-12{--lg:12}@media(min-width:768px){.row>[class*=col-sm-]{flex-basis:calc(var(--sm)/12 * 100%)}.col-sm-offset-2{margin-left:calc(2/12 * 100%)}}@media(min-width:992px){.row>[class*=col-md-]{flex-basis:calc(var(--md)/12 * 100%)}}@media(min-width:1200px){.row>[class*=col-lg-]{flex-basis:calc(var(--lg)/12 * 100%)}}.btn{display:inline-block;min-width:180px;padding:8px 12px;border:1px solid transparent;border-radius:var(--radius);font-size:16px;font-weight:500;line-height:1.5;text-align:center;vertical-align:middle;white-space:nowrap;cursor:pointer;user-select:none;touch-action:manipulation;&:hover,&:focus { text-decoration:none; } & .fas { margin-left:5px; }}.btn-primary{color:#fff;background:var(--link);border-color:#258cd1;&:hover,&:focus,&:active { color:#fff; background:var(--primary-hover); border-color:#1c699d; } &:active { box-shadow:inset 0 3px 5px rgb(0 0 0/.125); }}.btn-outline{color:#fff;background:0 0;border:2px solid #fff;transition:all 75ms;&:hover,&:focus,&:active { color:var(--accent); border-color:var(--accent); } &:active { scale:.95; }}@media(max-width:767px){.sm-block{display:block;width:100%}}.form-group{margin-bottom:15px}.form-actions{display:flex;flex-wrap:wrap;align-items:center;gap:15px 30px;& p { flex: 1 1 0; margin: 0; } & button { margin-left: auto; } @media (max-width: 1199px) { & p { display: none; } } @media (max-width: 767px), (min-width: 1200px) { & .privacy-link { display: none; } }}.form-extra{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}.form-horizontal .form-group{display:flex;flex-wrap:wrap;margin-inline:calc(-1 * var(--gutter));& > * { flex: 0 0 100%; } @media (min-width: 768px) { & > [class*="col-sm-"] { flex-basis: calc(var(--sm) / 12 * 100%); } }}@media(min-width:768px){.form-horizontal .control-label{margin-bottom:0;padding-top:9px;text-align:right}}.form-control{display:block;width:100%;height:42px;padding:8px 12px;color:#555;background:#fff;border:1px solid #ccc;border-radius:var(--radius);box-shadow:inset 0 1px 1px rgb(0 0 0/.075);transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out;&:focus { border-color:#66afe9; outline:0; box-shadow:inset 0 1px 1px rgb(0 0 0/.075),0 0 8px rgb(102 175 233/.6); }}textarea.form-control{height:auto;overflow:auto}.navbar{--t:0;position:fixed;inset:0 0 auto;z-index:1030;min-height:var(--nav-height);margin-top:-3px;border-bottom:1px solid transparent;font-size:14px;font-weight:600;text-transform:uppercase;@media(min-width:768px){margin-top: calc(20px - var(--t) * 23px); &.solid{z-index:900;background:var(--dark);box-shadow:0 1px 5px rgb(17 17 17/.5)}}}.navbar-compact{--t:1}.navbar-header{display:flow-root;position:relative;z-index:2;.solid & { background: var(--dark); } @media (min-width: 768px) { float: left; }}.navbar .container>.navbar-header,.navbar .container>.navbar-collapse{margin-inline:calc(-1 * var(--gutter));@media(min-width:768px){margin-inline: 0;}}.navbar-brand{float:left;height:var(--nav-height);padding:28px 20px;line-height:24px;& > img { display: block; position: relative; top: -16px; margin-right: -50px; transform-origin: left center; scale: .8; } @media (min-width: 768px) { margin-left: -20px; & > img { scale: calc(1 - var(--t) * .2); } }}.navbar-toggle{position:relative;top:2px;float:right;margin:23px 20px 23px 0;padding:9px 10px;background:0 0;border:1px solid transparent;border-radius:var(--radius);&:hover,&:focus { background:rgb(255 255 255/.1); outline:0; } & .icon-bar { display:block; width:22px; height:2px; border-radius:1px; background:#fff; transition:all 300ms; & + .icon-bar { margin-top:4px; } } &[aria-expanded="true"] .icon-bar { &:nth-child(1) { position:relative; top:6px; rotate:45deg; } &:nth-child(2) { rotate:45deg; opacity:0; } &:nth-child(3) { position:relative; top:-6px; rotate:-45deg; } } @media (min-width:768px) { display:none; }}.navbar-collapse{position:relative;z-index:1;top:calc(-1 * var(--nav-height));margin-bottom:calc(-1 * var(--nav-height));padding-inline:var(--gutter);background:rgb(0 0 0/.66);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:all 300ms;& .fas { width: 18px; margin: 0 4px 0 5px; font-size: 16px; text-align: center; } @media (max-width: 767px) { display: grid; grid-template-rows: 0fr; overflow: hidden; & > ul { min-height: 0; } &.open { grid-template-rows: 1fr; max-height: 340px; overflow-y: auto; box-shadow: 0 1px 8px rgb(0 0 0 / .4); } } @media (min-width: 768px) { top: 2px; margin-bottom: 0; padding-inline: 0; background: transparent; -webkit-backdrop-filter: none; backdrop-filter: none; & .fas { display: none; } }}.navbar-nav{margin:0 -20px;padding:0;list-style:none;& > li > a { display: block; position: relative; padding: 14px 15px; line-height: 24px; color: rgb(255 255 255 / .66); border-top: 1px solid rgb(255 255 255 / .1); transition: all 100ms; &:hover, &:focus, &[aria-current] { color: #fff; text-decoration: none; } } @media (max-width: 767px) { & > li > a:hover, & > li > a:focus-visible { background: rgb(255 255 255 / .1); outline: 0; } } @media (min-width: 768px) { display: flex; float: right; margin: 0 -10px 0 0; & > li > a { padding-block: 28px; border-top-color: transparent; } }}.lang-menu{position:relative;border-top:1px solid rgb(255 255 255/.1);@media(max-width:767px){display: flex; & .lang-toggle{display:none}}@media(min-width:768px){display: flex; align-items: center; height: var(--nav-height); padding-inline: 15px; border-top: 0;}}.lang-toggle{display:inline-flex;align-items:center;gap:7px;padding:5px 13px;font:inherit;line-height:18px;text-transform:inherit;color:rgb(255 255 255/.66);background:0 0;border:1px solid rgb(255 255 255/.33);border-radius:999px;cursor:pointer;transition:all 100ms;&:hover,&:focus-visible,&[aria-expanded="true"] { color:#fff; border-color:rgb(255 255 255/.8); outline:0; } .navbar & .fas { display:inline-block; width:auto; margin:0; font-size:13px; } .navbar & .fa-chevron-down { font-size:10px; transition:rotate 200ms; } &[aria-expanded="true"] .fa-chevron-down { rotate:180deg; }}.lang-globe{flex:none;padding:14px 15px;line-height:24px;color:rgb(255 255 255/.66);@media(min-width:768px){display: none;}}#lang-list{margin:0;padding:0;list-style:none;text-transform:none;& a { display: block; color: rgb(255 255 255 / .66); &:hover, &:focus-visible { color: #fff; text-decoration: none; background: rgb(255 255 255 / .1); outline: 0; } } @media (max-width: 767px) { display: grid; flex: 1; grid-template-columns: repeat(3, 1fr); & li { border-left: 1px solid rgb(255 255 255 / .1); } & a { padding: 14px 5px; line-height: 24px; text-align: center; } } @media (min-width: 768px) { position: absolute; top: calc(50% + 22px); right: 15px; min-width: 140px; margin: 0; padding: 5px; background: var(--dark); border: 1px solid rgb(255 255 255 / .15); border-radius: 6px; box-shadow: 0 6px 16px rgb(0 0 0 / .4); & a { padding: 8px 15px; border-radius: var(--radius); &[aria-current] { color: #fff; background: rgb(255 255 255 / .1); } } }}.fix-01{height:var(--nav-height);@media(min-width:768px){display: none;}}.bg-gray,.bg-white{padding-block:50px}.bg-gray{background:var(--gray-bg)}.navbar-compact-offset{padding-top:128px}.bg-white{position:relative;z-index:2;background:#fff;box-shadow:0 1px 5px rgb(17 17 17/.1)}h4.section>.fa-play{color:var(--accent)}.cover{--p:1;position:relative;z-index:2;height:100svh;min-height:448px;overflow:hidden;opacity:var(--p);background:radial-gradient(125% 115% at 80% 16%,#1b1739 0%,#14112c 22%,#0c0a1c 45%,#07060f 72%,#040309 100%);& h1 { font-size: 2.75em; font-weight: 300; letter-spacing: -2px; & small { line-height: 20px; letter-spacing: -1px; color: #fff; font-weight: 300; } @media (max-width: 767px) { margin-top: 40px; font-size: 30px; } }}#plexus{position:absolute;inset:0;& canvas { position: absolute; will-change: transform; }}.cover-layer{position:relative;z-index:1;height:100%;background:rgb(0 0 0/.2)}.cover-content{position:absolute;top:50%;width:100%;opacity:var(--p);color:#fff;text-align:center;translate:0 -50%;& p { max-width: 720px; margin: 0 auto; } @media (min-width: 1200px) { font-size: 1.3em; & p { max-width: 960px; } }}hr.pm{width:64px;height:2px;margin:30px auto;border:none;background:var(--accent)}.offer{display:flex;gap:10px;& img { flex: none; }}.tech-container{padding-bottom:15px;background:#fff}.carousel{--per-view:1;container-type:inline-size;overflow:hidden;margin-inline:calc(-1 * var(--gutter));mask-image:linear-gradient(to right,transparent,#000 12%,#000 88%,transparent);& .carousel-track { display: flex; width: max-content; animation: carousel calc(var(--count) * 3s) linear infinite; } &:hover .carousel-track { animation-play-state: paused; } & .item { flex: 0 0 calc(100cqi / var(--per-view)); text-align: center; & img { width: 60%; margin: 0 auto 10px; } } @media (min-width: 480px) { --per-view: 2; } @media (min-width: 769px) { --per-view: 3; } @media (min-width: 980px) { --per-view: 4; } @media (min-width: 1200px) { --per-view: 5; } @media (prefers-reduced-motion: reduce) { overflow-x: auto; scrollbar-width: none; & .carousel-track { animation: none; } & .item[aria-hidden] { display: none; } }}@keyframes carousel{to{translate:-50%}}.works{user-select:none;&:has(+ .works) { padding-bottom:0; } & + .works { padding-top:30px; } & .item { position:relative; margin-bottom:40px; overflow:hidden; border-radius:var(--radius); box-shadow:0 1px 4px rgb(0 0 0/.5); cursor:pointer; transition:all 200ms; & img { transition:all 150ms; } & .desc { position:absolute; inset:0; padding:20px; color:#fff; background:rgb(0 0 0/.75); text-shadow:0 0 10px #000; translate:0 -100%; transition:all 200ms; & .text-muted { color:#fff; opacity:.65; } & .pill { position:absolute; right:20px; bottom:20px; padding:2px 10px; border:1px solid rgb(255 255 255/.6); border-radius:999px; color:rgb(255 255 255/.6); font-size:11px; letter-spacing:.1em; text-transform:uppercase; text-shadow:none; } } & a { color:#fff; text-decoration:none; &:hover { color:var(--accent); } } &.open { cursor:default; & img { filter:blur(4px); } & .desc { translate:0; } } }}.contact-card{display:flex;flex-wrap:wrap;& > * { flex: 0 0 100%; padding-inline: var(--gutter); } & strong { font-weight: 600; } @media (min-width: 768px) { & > * { flex-basis: calc(2 / 3 * 100%); } }}.contact-photo{max-width:220px;margin-inline:auto;@media(min-width:768px){flex-basis: calc(1 / 3 * 100%); margin-inline: 0;}}#ambi{background:url(/assets/img/ambigram.webp)50%/cover;transition:all 300ms;& img { transition: all 300ms; } &.open { animation: rot 4s infinite; & img { scale: 0; opacity: 0; } }}@keyframes rot{from,30%,70%{rotate:0}to{rotate:180deg}}#map{height:142px;border-radius:var(--radius);background:url(/assets/img/map-caen.webp)50% 0/cover}.contact-intro{margin-top:40px}#m{user-select:none;&::before { content:'arnaud'; }}.modal{width:auto;max-width:none;margin:10px;padding:0;overflow:visible;background:#fff;border:1px solid rgb(0 0 0/.2);border-radius:var(--radius);box-shadow:0 3px 9px rgb(0 0 0/.5);color:var(--text);&[open] { animation: modal-in .3s ease-out; } &::backdrop { background: rgb(0 0 0 / .5); animation: fade-in .15s linear; } @media (min-width: 768px) { width: 600px; margin: 30px auto auto; box-shadow: 0 5px 15px rgb(0 0 0 / .5); }}.modal-header,.modal-body,.modal-footer{padding:15px}.modal-header{overflow:hidden}.modal-body{padding-inline:20px}.modal-footer{text-align:center;& .btn { min-width: 80px; margin-bottom: 24px; }}.close{float:right;margin-top:-2px;padding:0;font-size:24px;font-weight:700;line-height:1;color:#000;text-shadow:0 1px 0 #fff;background:0 0;border:0;opacity:.2;&:hover,&:focus { opacity:.5; }}@keyframes modal-in{from{translate:0 -25%;opacity:0}}@keyframes fade-in{from{opacity:0}}.site-footer{line-height:1.7;color:#888;& p, & ul { margin: 0; padding: 0; list-style: none; } & li { margin-bottom: 4px; } & a { color: rgb(255 255 255 / .6); transition: color 100ms; &:hover, &:focus-visible { color: #fff; text-decoration: none; } } & .fas, & .fab { width: 16px; margin-right: 4px; text-align: center; }}.site-footer-main{display:grid;gap:18px 40px;padding-block:30px 22px;@media(min-width:768px){grid-template-columns: repeat(3,auto); justify-content: space-between;}}.site-footer-bottom{padding-block:14px;background:#000;border-top:1px solid #333;text-align:center}.page{padding-block:40px;background:#fff}