
:root{--bg:#0e1522;--panel:#141f36;--panel2:#18274a;--line:#2a3a5c;--or:#10a0e0;--pri:#0070b0;--tx:#f2f5fa;--mu:#9aa7bd;--bl:#3d6fd1;color-scheme:dark}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--tx);font:15px/1.5 Inter,system-ui,sans-serif;padding-bottom:env(safe-area-inset-bottom)}
a{color:inherit}img{max-width:100%}
.wrap{max-width:1080px;margin:0 auto;padding:0 20px}
.stripe{height:10px;background:repeating-linear-gradient(115deg,#0070b0 0 26px,#05080f 26px 44px);margin-top:env(safe-area-inset-top)}
.top{position:sticky;top:0;z-index:50;background:#0e1522f2;backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.bar{display:flex;justify-content:space-between;align-items:center;gap:12px;padding-top:12px;padding-bottom:12px}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none}
.brand img{height:40px;background:#fff;padding:3px}
.bt{font:700 17px Oswald,Impact,sans-serif;text-transform:uppercase;letter-spacing:.02em;line-height:1.1}
.bt small{display:block;font:400 10px 'JetBrains Mono',monospace;color:var(--mu);letter-spacing:.2em}
.lang{display:flex;gap:2px}.lang button{background:none;border:0;color:var(--mu);font:500 12px 'JetBrains Mono',monospace;padding:8px 10px;cursor:pointer}
.lang .on{background:var(--pri);color:#fff}
.menu{border-top:1px solid var(--line)}
.menu ul{list-style:none;margin:0 auto;padding:0 20px;display:flex;justify-content:space-between;align-items:center}
.menu a{display:block;text-decoration:none;color:var(--tx);font:500 15px Oswald,Impact,sans-serif;text-transform:uppercase;letter-spacing:.04em;padding:12px 2px;border-bottom:3px solid transparent;white-space:nowrap}
.menu a:hover{color:var(--or)}.menu a.on{color:var(--or);border-bottom-color:var(--or)}
.kick{font:500 12px 'JetBrains Mono',monospace;letter-spacing:.3em;color:var(--or);text-transform:uppercase}
h1{font:700 clamp(28px,4.8vw,46px)/1.08 Oswald,Impact,sans-serif;text-transform:uppercase;margin:8px 0 0}
h2{font:700 22px Oswald,Impact,sans-serif;text-transform:uppercase;margin:0 0 8px}
h3{margin:0 0 4px;font:700 17px Oswald,Impact,sans-serif;text-transform:uppercase}
.lead{color:var(--mu);font-size:16px;max-width:760px}
main>.wrap:first-child{padding-top:36px}
.vhero{position:relative;min-height:min(70vh,560px);display:flex;align-items:center;overflow:hidden;background:#101a2e}
.vhero video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.shade{position:absolute;inset:0;background:linear-gradient(90deg,#0e1522ee 0%,#0e1522aa 55%,#0e152255 100%)}
.vin{position:relative;padding-top:60px;padding-bottom:60px}
.phero{position:relative;min-height:300px;display:flex;align-items:center;padding:40px 0;border-bottom:1px solid var(--line);
 background:linear-gradient(90deg,#0e1522f0 0%,#0e1522bb 50%,#0e152233 100%),var(--img),linear-gradient(135deg,#1b2d52,#0e1522);background-size:cover;background-position:var(--pos,center)}
.phero::before{content:"";position:absolute;inset:0;backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);-webkit-mask-image:linear-gradient(90deg,#000 0%,transparent 60%);mask-image:linear-gradient(90deg,#000 0%,transparent 60%)}
.phero .wrap{position:relative;width:100%}.phero .lead{max-width:560px;color:#d3dbe8}
.btns{display:flex;flex-wrap:wrap;gap:12px;margin:22px 0}
.btn{display:inline-flex;flex-direction:column;gap:2px;padding:11px 18px;border:1px solid var(--line);text-decoration:none;font:500 14px Oswald,Impact,sans-serif;text-transform:uppercase;letter-spacing:.05em;cursor:pointer;background:transparent;color:var(--tx)}
.btn span:not(.l){font:400 13px 'JetBrains Mono',monospace;text-transform:none;color:var(--mu)}
.btn.pri{background:var(--pri);border-color:var(--pri);color:#fff;flex-direction:row;align-items:center}
.btn.wa{border-color:#25a05a}.btn:hover{border-color:var(--or)}.btn.pri:hover{filter:brightness(1.1)}
.ctb{padding-top:48px;padding-bottom:20px}
.quality{margin:36px 0;padding:18px;border-left:3px solid var(--or);background:var(--panel);color:var(--mu)}.quality b{color:var(--tx)}
.tabs{display:flex;flex-wrap:wrap;gap:8px;margin:32px 0 8px}
.tabs button{background:none;color:var(--mu);border:1px solid var(--line);padding:8px 16px;font:500 13px Oswald,Impact,sans-serif;text-transform:uppercase;letter-spacing:.05em;cursor:pointer}
.tabs button[aria-pressed=true]{background:var(--pri);border-color:var(--pri);color:#fff}
.block{margin-top:30px}.sub{margin:0 0 14px;color:var(--mu);font-size:15px}
.table{border:1px solid var(--line);background:var(--panel);margin:22px 0}
.row{display:grid;grid-template-columns:64px 1fr;gap:12px;padding:14px 14px;border-top:1px solid var(--line)}
.row.head{border-top:0;background:var(--panel2);font:500 12px 'JetBrains Mono',monospace;letter-spacing:.15em;color:var(--mu);text-transform:uppercase;padding:12px 16px}
.row.head b{font:700 18px Oswald,Impact,sans-serif;color:var(--tx);letter-spacing:.02em}
.ref{font:500 13px 'JetBrains Mono',monospace;color:var(--or);padding-top:4px}
.row p{margin:0;color:var(--mu);font-size:14px}
.thumb{margin:12px 0 0;max-width:420px}.thumb img{display:block;width:100%;border:1px solid var(--line)}.thumb figcaption{font-size:13px;color:var(--mu);padding-top:6px}
.frame{border:2px solid var(--bl);margin:24px 0;aspect-ratio:3/2;max-height:560px;overflow:hidden}.frame img{width:100%;height:100%;object-fit:cover;display:block}
.wide{width:100%;border:1px solid var(--line);margin-top:8px}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px;margin:22px 0}
.card{background:var(--panel2);border:1px solid var(--line);padding:22px}.card p{margin:0;color:var(--mu)}
.coords .row{grid-template-columns:90px 1fr}.coords a{text-decoration:none}.coords a:hover{color:var(--or)}
.form{display:grid;gap:14px;max-width:640px;margin:36px 0}
.form label{display:grid;gap:6px;font:500 13px 'JetBrains Mono',monospace;color:var(--mu);letter-spacing:.08em;text-transform:uppercase}
.form input,.form select,.form textarea{background:var(--panel);border:1px solid var(--line);color:var(--tx);padding:12px;font:16px Inter,sans-serif}
.form .btn{align-self:start}.hint{font-size:13px;color:var(--mu);margin:0}
.foot{border-top:1px solid var(--line);padding:22px 0;color:var(--mu);font-size:14px;margin-top:40px}
.fab{position:fixed;right:16px;bottom:calc(16px + env(safe-area-inset-bottom));width:50px;height:50px;border-radius:50%;background:#25a05a;display:grid;place-items:center;box-shadow:0 4px 16px #0009;z-index:60}
[hidden]{display:none!important}
.vin{width:100%}.bt small{white-space:nowrap}
.row.head b{white-space:nowrap}
.lr,.tr{position:absolute;opacity:0;pointer-events:none;width:0;height:0}
.l{display:none}
#l-fr:checked ~ * .l.fr,#l-en:checked ~ * .l.en,#l-it:checked ~ * .l.it{display:inline}
.lang label{color:var(--mu);font:500 12px 'JetBrains Mono',monospace;padding:8px 10px;cursor:pointer}
#l-fr:checked ~ header .lang label[for=l-fr],#l-en:checked ~ header .lang label[for=l-en],#l-it:checked ~ header .lang label[for=l-it]{background:var(--pri);color:#fff}
.tabs{flex-wrap:nowrap!important;gap:6px!important}
.tabs label{flex:0 1 auto;white-space:nowrap;background:none;color:var(--mu);border:1px solid var(--line);padding:8px clamp(6px,2.2vw,16px);font:500 clamp(9px,2.9vw,13px) Oswald,Impact,sans-serif;text-transform:uppercase;letter-spacing:.03em;cursor:pointer}
[data-s]{display:none}
#t-ind:checked ~ [data-s=ind],#t-mar:checked ~ [data-s=mar],#t-it:checked ~ [data-s=it]{display:block}
#t-ind:checked ~ .tabs label[for=t-ind],#t-mar:checked ~ .tabs label[for=t-mar],#t-it:checked ~ .tabs label[for=t-it]{background:var(--pri);border-color:var(--pri);color:#fff}
.slogan em{font-style:normal;color:var(--or)}.vin .kick{margin-bottom:6px}.vin h1.slogan{max-width:820px;font-size:clamp(30px,5.4vw,56px)}
.slg{color:var(--tx)!important;font-weight:500;margin-top:12px!important}
img.av{object-fit:cover;background:var(--panel2)}
.avbtn{margin:26px 0 8px}
.fab{background:var(--pri)!important}
.phero.pb{min-height:440px;align-items:flex-end;padding:50px 0 34px;background:linear-gradient(180deg,#0e152266 0%,#0e1522cc 55%,#0e1522f2 100%),var(--img),linear-gradient(135deg,#1b2d52,#0e1522);background-size:cover;background-position:var(--pos,center)}
.phero.pb::before{display:none}.phero.pb h1{font-size:clamp(24px,5.6vw,44px)}
.kk{display:flex;align-items:center;gap:10px;margin-bottom:6px}.kk .ic{color:var(--or)}
.sol{padding-top:44px;padding-bottom:10px}.sol h2{padding-bottom:16px;border-bottom:1px solid var(--line);margin-bottom:24px}
.stack{border:1px solid var(--line);background:var(--panel2)}
.si{padding:20px 20px;border-top:1px solid var(--line)}.si:first-child{border-top:0}
.si .ic{color:var(--or);display:block;margin-bottom:12px;width:28px;height:28px}.si h3{font-size:20px;margin-bottom:8px}.si p{margin:0;color:var(--mu)}
.playbtn{position:absolute;z-index:5;left:50%;bottom:28px;transform:translateX(-50%);background:var(--pri);color:#fff;border:0;padding:12px 22px;font:500 15px Oswald,sans-serif;text-transform:uppercase;letter-spacing:.06em;cursor:pointer}
.vhero{position:relative}
.card{padding:0;overflow:hidden}.card img{display:block;width:100%;aspect-ratio:3/2;object-fit:cover}.cb{padding:18px 20px 22px}
.people{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr));gap:18px;margin:26px 0}
.person{background:var(--panel);border:1px solid var(--line);padding:24px;display:flex;flex-direction:column;gap:6px}
.av{width:46px;height:46px;border-radius:50%;background:var(--pri);display:grid;place-items:center;font:700 18px Oswald,sans-serif;margin-bottom:8px;flex:none}
.role{margin:0 0 8px;color:var(--mu);font-size:14px;min-height:42px}
.person a.ph,.person a.ml{text-decoration:none;font:400 13px 'JetBrains Mono',monospace;overflow-wrap:anywhere}.person a:hover{color:var(--or)}
.person .btns{margin:14px 0 0}.person .btn{padding:10px 16px}
.fg{display:grid;grid-template-columns:1.4fr 1fr 1.2fr;gap:30px;padding-top:10px}
.foot h4{margin:0 0 10px;font:500 13px 'JetBrains Mono',monospace;letter-spacing:.2em;color:var(--or);text-transform:uppercase}
.foot p{color:var(--mu);margin:10px 0 0}.fl,.fc{display:flex;flex-direction:column;gap:6px;margin:0}.fl a,.fc a{text-decoration:none;color:var(--mu)}.fl a:hover,.fc a:hover{color:var(--or)}
.fb{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;border-top:1px solid var(--line);margin-top:24px;padding-top:16px;font-size:13px}
@media(max-width:768px){.fg{grid-template-columns:1fr}}
@media(max-width:768px){
 .wrap{padding-left:14px;padding-right:14px}.menu ul{padding-left:6px;padding-right:6px}
 .bt{font-size:15px}.brand img{height:34px}.bt small{font-size:8.5px;letter-spacing:.12em}.row.head b{font-size:15px}
 .menu a{font-size:clamp(7px,2.3vw,15px);letter-spacing:0;padding:14px 0}
 h1{font-size:clamp(22px,6.2vw,32px);overflow-wrap:anywhere}.phero{min-height:240px}.phero.pb{min-height:400px}.row{grid-template-columns:60px 1fr;gap:10px}
}

/* ===== Échelle de texte alignée sur le site Lovable ===== */
body{font-size:15.5px}
.bt{font-size:18px}.bt small{font-size:8.5px;letter-spacing:.18em}
.brand img{height:40px;width:40px;object-fit:contain;padding:3px;background:#fff}
h1{font-size:clamp(26px,7.4vw,34px)}
h2{font-size:clamp(24px,7.6vw,32px)}
h3{font-size:19px}
.lead{font-size:16px;line-height:1.5}
.row{padding:18px 16px}.row p{font-size:15px}.row.head b{font-size:16px}
.si{padding:24px 22px}.si h3{font-size:24px}.si p{font-size:16px}.si .ic{width:32px;height:32px}
.phero.pb{min-height:440px}.phero.pb h1{font-size:clamp(30px,10vw,42px)}
@media(min-width:769px){
 body{font-size:16px}.bt{font-size:20px}.brand img{height:44px;width:44px}
 h1{font-size:clamp(44px,4.4vw,60px)}h2{font-size:36px}h3{font-size:21px}
 .lead{font-size:18px}.row p{font-size:16px}.row.head b{font-size:18px}
 .menu a{font-size:16px}.si h3{font-size:28px}.si p{font-size:17px}
 .phero.pb{min-height:540px}.phero.pb h1{font-size:clamp(44px,6vw,76px)}
 .vin h1.slogan{font-size:clamp(40px,5vw,64px)}
}
.row>div{min-width:0}.row h3,.row p,.si h3,.si p,.person h3{overflow-wrap:anywhere;hyphens:auto}
@media(max-width:360px){
 .bt{font-size:15px}.brand{gap:8px}.brand img{height:34px;width:34px}.lang label{padding:7px 6px}
 .bar{gap:6px}.row{padding:16px 12px}.row h3{font-size:17px}.si h3{font-size:21px}
}

/* Maritime : bandeau image sans texte, même format qu'Approvisionnement */
.phero.pn{min-height:440px;padding:0;background:var(--img),linear-gradient(135deg,#1b2d52,#0e1522);background-size:cover;background-position:var(--pos,center);border-bottom:1px solid var(--line)}
.phero.pn::before{display:none}
.phero.pn+.wrap{padding-top:36px}
@media(min-width:769px){.phero.pn{min-height:540px}}
/* Accueil : boutons Services / Nous contacter et bloc Contact */
.vin .btns{margin-top:26px}
.vin .btn{padding:14px 26px;font-size:16px;align-items:center;justify-content:center;text-align:center}
.vin .btn.ghost{border-color:#ffffff66;background:#0e152255}
@media(max-width:768px){.vin .btns{flex-direction:column}.vin .btn{width:100%;padding:16px 20px}}
.hct{padding-top:46px;padding-bottom:10px}
.cbtns{display:flex;flex-direction:column;gap:14px;margin-top:22px;max-width:760px}
.cbtn{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:18px 22px;border:1px solid var(--line);text-decoration:none;color:var(--tx);font:500 19px/1.15 Oswald,Impact,sans-serif;text-transform:uppercase;letter-spacing:.02em}
.cbtn>span:not(.l){font:500 14px 'JetBrains Mono',monospace;color:var(--or);text-transform:none;letter-spacing:.06em;white-space:nowrap}
.cwa{background:var(--pri);border-color:var(--pri)}.cwa>span:not(.l){color:#fff}
.cbtn:hover{border-color:var(--or)}
@media(max-width:480px){.cbtn{padding:16px 16px;font-size:16px}.cbtn>span:not(.l){font-size:12px}}
