
/* Layout: light, editorial, centered 1120px column. Hero = founder + group in one screen. Company pages are sections reached from a sticky tab bar; each opens with a full-width image band. Light-first, dark supported. */
:root{
 --bg:#F4F6F8; --bg2:#FFFFFF; --fg:#0F1A24; --muted:#5B6B78; --line:#DCE3E9;
 --a1:#009FE3; --a2:#009BA4; --a3:#4C9C3C; --ink:#06090C; --inkfg:#E6EDF3; --inkmuted:#9FB2C4;
 --display:"Archivo",system-ui,sans-serif; --serif:"Newsreader",Georgia,serif;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--bg:#0B1218;--bg2:#121C25;--fg:#E6EDF3;--muted:#9FB2C4;--line:#22303A;color-scheme:dark}}
:root[data-theme="dark"]{--bg:#0B1218;--bg2:#121C25;--fg:#E6EDF3;--muted:#9FB2C4;--line:#22303A;color-scheme:dark}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--fg);font-family:var(--display);font-size:16px;line-height:1.55;font-variation-settings:"wdth" 100}
img{max-width:100%}
.wrap{max-width:1120px;margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:10;background:var(--ink)}
header{position:sticky;top:env(safe-area-inset-top,0px);z-index:5;background:var(--ink);color:var(--inkfg)}
.nav{display:flex;align-items:center;gap:6px;height:60px;overflow-x:auto;scrollbar-width:none}
.nav::-webkit-scrollbar{display:none}
.nav img{height:26px;margin-right:18px;flex:none}
.nav a{color:var(--inkmuted);text-decoration:none;font-size:14px;font-weight:500;padding:8px 12px;border-radius:999px;white-space:nowrap}
.nav a.on,.nav a:hover{color:#fff;background:rgba(255,255,255,.08)}
.nav .sp{flex:1}
.nav a.cta{color:#fff;background:linear-gradient(90deg,var(--a1),var(--a2))}
.band{height:5px;background:linear-gradient(90deg,var(--a1),var(--a2),var(--a3))}

/* hero */
.hero{background:var(--ink);color:var(--inkfg);padding-block:56px 48px}
.hero .wrap{display:grid;grid-template-columns:1.25fr .9fr;gap:48px;align-items:center}
.hero .wrap>div{min-width:0}
.eyebrow{font-size:12px;letter-spacing:3px;text-transform:uppercase;color:#7FD3F3;font-weight:600}
h1{font-size:clamp(34px,4.6vw,54px);line-height:1.04;margin:12px 0 16px;font-weight:800;letter-spacing:-.02em;text-wrap:balance;font-variation-settings:"wdth" 96}
h1 em{font-style:normal;background:linear-gradient(90deg,var(--a1),var(--a3));-webkit-background-clip:text;color:transparent}
.hero p.lead{font-family:var(--serif);font-size:20px;line-height:1.45;color:#C7D3DF;max-width:56ch;margin:0 0 22px}
.btns{display:flex;gap:10px;flex-wrap:wrap}
.btn{display:inline-block;padding:11px 18px;border-radius:999px;font-weight:600;text-decoration:none;font-size:14px;border:1px solid var(--line);color:var(--fg);background:var(--bg2)}
.hero .btn{border-color:rgba(255,255,255,.2);color:#fff;background:transparent}
.btn.p,.hero .btn.p{background:linear-gradient(90deg,var(--a1),var(--a2));border:0;color:#fff}
.fcard{background:#111C26;border:1px solid rgba(255,255,255,.1);border-radius:14px;padding:22px;display:grid;grid-template-columns:96px 1fr;gap:18px;align-items:start}
.fcard img{width:96px;height:96px;border-radius:50%;object-fit:cover;border:3px solid var(--a1)}
.fcard b{display:block;font-size:20px;margin-bottom:2px}
.fcard .r{color:#7FD3F3;font-size:13px;font-weight:600;margin-bottom:8px}
.fcard p{font-size:14px;color:#C7D3DF;margin:0 0 12px}
.chips{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 12px;padding:0;list-style:none}
.chips li{font-size:12px;border:1px solid rgba(255,255,255,.18);border-radius:999px;padding:3px 10px;color:#D6E6F2}
.fcard .btns .btn{padding:8px 13px;font-size:13px}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:40px;padding-top:28px;border-top:1px solid rgba(255,255,255,.12)}
.stats div{min-width:0}.stats b{display:block;font-size:30px;font-weight:800;letter-spacing:-.02em}
.stats span{font-size:13px;color:var(--inkmuted)}

/* sections */
section{padding-block:64px}
h2{font-size:clamp(26px,3.2vw,36px);margin:0 0 8px;letter-spacing:-.02em;font-weight:800;text-wrap:balance;font-variation-settings:"wdth" 96}
.sub{font-family:var(--serif);font-size:19px;color:var(--muted);margin:0 0 32px;max-width:60ch}
h3{font-size:12px;letter-spacing:3px;text-transform:uppercase;color:var(--a2);margin:0 0 14px;font-weight:700}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:18px}
.tile{display:block;position:relative;border-radius:14px;overflow:hidden;min-height:300px;text-decoration:none;color:#fff;background:var(--ink)}
.tile .im{position:absolute;inset:0;background-size:cover;background-position:center;transition:transform .5s}
.tile:hover .im{transform:scale(1.04)}
.tile .v{position:absolute;inset:0;background:linear-gradient(180deg,rgba(6,9,12,.05) 25%,rgba(6,9,12,.9) 100%)}
.tile .t{position:absolute;left:0;right:0;bottom:0;padding:20px}
.tile .t small{display:block;font-size:12px;letter-spacing:2px;text-transform:uppercase;color:#7FD3F3;font-weight:600;margin-bottom:6px}
.tile .t b{display:block;font-size:22px;letter-spacing:-.01em;margin-bottom:4px}
.tile .t span{font-size:14px;color:#C7D3DF}
.tile.wide{grid-column:span 2}
@media (max-width:700px){.tile.wide{grid-column:auto}}
@media (prefers-reduced-motion:reduce){.tile .im{transition:none}.tile:hover .im{transform:none}}

/* company page */
.cpage{display:none}.cpage.on{display:block}
.cband{position:relative;min-height:380px;display:flex;align-items:flex-end;background:var(--ink);color:#fff}
.cband .im{position:absolute;inset:0;background-size:cover;background-position:center}
.cband .v{position:absolute;inset:0;background:linear-gradient(180deg,rgba(6,9,12,.25),rgba(6,9,12,.85))}
.cband .wrap{position:relative;padding-block:40px;width:100%}
.cband h1{max-width:18ch}
.cband p.lead{font-family:var(--serif);font-size:19px;color:#C7D3DF;max-width:58ch;margin:0}
.two{display:grid;grid-template-columns:1.2fr .8fr;gap:48px}
.two>div{min-width:0}
.prose{font-size:17px;max-width:62ch}
.prose p{margin:0 0 16px}
.facts{display:grid;gap:0;border-top:1px solid var(--line)}
.fact{display:grid;grid-template-columns:140px 1fr;gap:14px;padding:12px 0;border-bottom:1px solid var(--line);font-size:15px}
.fact b{color:var(--muted);font-weight:500}
.engs{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:14px;margin-top:8px}
.eng{background:var(--bg2);border:1px solid var(--line);border-radius:12px;padding:18px}
.eng b{display:block;font-size:16px;margin-bottom:6px}
.eng p{font-size:14px;color:var(--muted);margin:0}
.founder{background:var(--bg2);border:1px solid var(--line);border-radius:14px;padding:24px;display:grid;grid-template-columns:110px 1fr;gap:22px;margin-top:40px}
.founder img{width:110px;height:110px;border-radius:50%;object-fit:cover;border:3px solid var(--a1)}
.founder b.n{display:block;font-size:22px;margin-bottom:2px}
.founder .r{color:var(--a2);font-size:13px;font-weight:600;margin-bottom:10px}
.founder p{font-size:15px;margin:0 0 12px}
.founder .chips li{border-color:var(--line);color:var(--fg)}
.shots{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px;margin-top:18px}
.shots figure{margin:0}
.shots img{width:100%;aspect-ratio:3/2;object-fit:cover;object-position:top;border-radius:8px;border:1px solid var(--line);display:block}
.shots figcaption{font-size:12px;color:var(--muted);margin-top:6px;line-height:1.35}
.pcards{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.pcard{background:var(--bg2);border:1px solid var(--line);border-radius:14px;overflow:hidden;display:grid;grid-template-rows:200px 1fr}
.pcard .im{background-size:cover;background-position:top;border-bottom:1px solid var(--line)}
.pcard div.b{padding:20px}
.pcard .live{font-size:11px;letter-spacing:2px;color:var(--a3);font-weight:700}
.pcard b.n{display:block;font-size:22px;margin:4px 0 6px}
.pcard p{font-size:15px;color:var(--muted);margin:0 0 14px}
.note{font-size:12px;color:var(--muted);margin-top:8px}
.timeline{border-left:2px solid var(--line);padding-left:22px;display:grid;gap:18px}
.ti{position:relative}.ti:before{content:"";position:absolute;left:-29px;top:6px;width:12px;height:12px;border-radius:50%;background:var(--a1);border:2px solid var(--bg)}
.ti b{display:block;font-size:16px}.ti small{color:var(--muted);font-size:13px;display:block;margin-bottom:4px}.ti p{margin:0;font-size:14px}
form{display:grid;gap:12px;max-width:560px}
input,select,textarea{padding:12px;border-radius:8px;border:1px solid var(--line);background:var(--bg2);color:var(--fg);font:inherit}
footer{background:var(--ink);color:var(--inkmuted);font-size:14px;padding-block:32px;margin-top:40px}
footer .wrap{display:flex;flex-wrap:wrap;gap:16px 32px;justify-content:space-between;align-items:center}
footer>span,footer .wrap>span{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
footer img{height:22px}
@media (max-width:860px){.hero .wrap,.two,.pcards{grid-template-columns:1fr}.stats{grid-template-columns:1fr 1fr}.fact{grid-template-columns:1fr;gap:4px}.founder,.fcard{grid-template-columns:1fr}.founder img,.fcard img{width:84px;height:84px}}

/* formulaire (contact.php) */
.champ{display:grid;gap:6px}.champ label{font-size:13px;color:var(--muted);font-weight:500}
.piege{position:absolute;left:-9999px}
.retour{font-size:14px;margin:4px 0 0;color:var(--a2)}.retour.err{color:#C0392B}
.wrap-nav{display:flex;align-items:center;gap:6px;height:60px}
.fiches{display:grid;gap:10px;font-size:14px;align-content:start}
.fiches div{display:grid;grid-template-columns:150px 1fr;gap:12px;padding:8px 0;border-bottom:1px solid var(--line)}
.fiches span{color:var(--muted)}.fiches a{color:var(--fg)}
.duo{display:grid;grid-template-columns:1fr 1fr;gap:48px}@media(max-width:860px){.duo{grid-template-columns:1fr}}
.shots.one{grid-template-columns:1fr}
.hero .fphoto{text-align:center}.hero .fphoto img{width:220px;height:220px;border-radius:50%;object-fit:cover;border:4px solid var(--a1)}
footer a{color:#7FD3F3;text-decoration:none}footer a:hover{text-decoration:underline}
footer img{height:22px;vertical-align:middle}

/* galerie Selected work */
.works{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.work{background:var(--bg);border:1px solid var(--line);border-radius:14px;overflow:hidden}
.work .im{aspect-ratio:16/10;background-size:cover;background-position:top center;border-bottom:1px solid var(--line)}
.work .b{padding:18px}
.work small{display:block;font-size:11px;letter-spacing:2px;text-transform:uppercase;color:var(--a2);font-weight:700;margin-bottom:6px}
.work b{display:block;font-size:18px;letter-spacing:-.01em;margin-bottom:6px}
.work p{font-size:14px;color:var(--muted);margin:0}
@media (max-width:900px){.works{grid-template-columns:1fr}}
