@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@400;500;600;700;800;900&family=Inter:wght@400;500;600;700&display=swap');

:root { --orange:#f58218; --orange2:#ffad45; --ink:#070707; --panel:#111; --panel2:#171717; --line:#292929; --text:#f7f4ef; --muted:#aaa49d; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:#080808; color:var(--text); font-family:Inter,Arial,sans-serif; }
a { color:inherit; text-decoration:none; }
button,input,select,textarea { font:inherit; }
.site { --radius:0px; --surface:#111; min-height:100vh; overflow:hidden; background:var(--ink); color:var(--text); transition:.4s ease; }
.section { width:min(1180px,90%); margin:0 auto; padding:105px 0; }
.kicker { display:flex; align-items:center; gap:12px; margin:0 0 12px; color:var(--orange); font:700 13px/1 Inter; letter-spacing:.19em; text-transform:uppercase; }
.kicker span { width:35px; height:2px; background:var(--orange); }
.section-heading h2 { max-width:900px; margin:0 0 38px; font:700 clamp(42px,6vw,76px)/.94 "Barlow Condensed",sans-serif; letter-spacing:-.02em; text-transform:uppercase; }
.section-heading h2 em { color:var(--orange); font-style:normal; }
.button { display:inline-flex; align-items:center; justify-content:center; gap:28px; min-height:54px; padding:0 25px; border:1px solid var(--orange); border-radius:var(--radius); font:700 14px/1 Inter; letter-spacing:.05em; text-transform:uppercase; transition:.2s; }
.button:hover { transform:translateY(-2px); }
.button.primary { color:#111; background:var(--orange); }
.button.ghost { color:#fff; border-color:#777; background:rgba(8,8,8,.34); backdrop-filter:blur(8px); }

.header { position:absolute; z-index:20; top:0; left:0; display:flex; align-items:center; width:100%; height:100px; padding:0 4%; border-bottom:1px solid rgba(255,255,255,.14); }
.brand { display:flex; align-items:center; gap:12px; min-width:270px; }
.brand img { width:73px; height:73px; object-fit:contain; filter:drop-shadow(0 8px 12px #000); }
.brand span,.brand strong,.brand small { display:block; }
.brand strong { font:800 21px/.9 "Barlow Condensed"; text-transform:uppercase; }
.brand small { margin-top:5px; color:#aaa; font-size:10px; letter-spacing:.12em; text-transform:uppercase; }
.nav { display:flex; align-items:center; justify-content:center; flex:1; gap:25px; }
.nav a { color:#d5d5d5; font:600 12px Inter; text-transform:uppercase; transition:.2s; }
.nav a:hover { color:var(--orange); }
.header-cta { padding:13px 18px; color:#111; background:var(--orange); font-size:12px; font-weight:800; text-transform:uppercase; }
.menu-toggle { display:none; color:#fff; background:none; border:0; font-size:27px; }

.hero { position:relative; display:flex; align-items:center; min-height:820px; padding:155px 7% 90px; overflow:hidden; }
.hero-media { position:absolute; inset:-4%; z-index:0; background:url('assets/banniere.png') center/cover no-repeat; animation:drift 18s ease-in-out infinite alternate; }
.hero::after { content:""; position:absolute; inset:0; z-index:1; background:linear-gradient(90deg,rgba(0,0,0,.94) 4%,rgba(0,0,0,.67) 48%,rgba(0,0,0,.2)),linear-gradient(0deg,#080808 0%,transparent 28%); }
@keyframes drift { from{transform:scale(1.03) translateX(-.5%)} to{transform:scale(1.11) translateX(1.5%)} }
.hero-content { position:relative; z-index:2; max-width:790px; }
.hero-label { display:flex; gap:12px; margin:0 0 25px; }
.hero-label span { padding:7px 10px; color:#ddd; border:1px solid #696969; font-size:10px; font-weight:700; letter-spacing:.13em; text-transform:uppercase; }
.hero-label span:first-child { color:#111; background:var(--orange); border-color:var(--orange); }
.hero h1 { margin:0; font:800 clamp(75px,10vw,145px)/.76 "Barlow Condensed",sans-serif; letter-spacing:-.035em; text-transform:uppercase; text-shadow:0 7px 30px #000; }
.hero h1 em { color:var(--orange); font-style:normal; }
.hero-lead { max-width:650px; margin:32px 0 0; color:#d5d2ce; font-size:18px; line-height:1.65; }
.hero-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:32px; }
.hero-status { display:flex; align-items:center; gap:9px; margin-top:30px; color:#aaa; font-size:11px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; }
.hero-status i { width:7px; height:7px; background:#65d58a; border-radius:50%; box-shadow:0 0 15px #65d58a; }
.route-marker { position:absolute; right:6%; bottom:120px; z-index:2; display:flex; align-items:center; gap:15px; }
.route-marker span { display:grid; place-items:center; width:58px; height:58px; color:#fff; background:#155193; border:4px solid #fff; border-radius:12px; font:700 20px Inter; box-shadow:0 8px 25px #000; }
.route-marker small { color:#ddd; font-size:10px; line-height:1.5; letter-spacing:.12em; text-transform:uppercase; }

.values-strip { position:relative; z-index:4; display:grid; grid-template-columns:repeat(5,1fr); width:min(1280px,94%); margin:-40px auto 0; background:#111; border:1px solid var(--line); box-shadow:0 22px 80px #000; }
.values-strip article { display:flex; gap:14px; padding:27px 20px; border-right:1px solid var(--line); }
.values-strip article:last-child { border-right:0; }
.values-strip article>span { color:#5c5c5c; font:700 12px "Barlow Condensed"; }
.values-strip h3 { margin:0 0 6px; color:var(--orange); font:700 17px "Barlow Condensed"; text-transform:uppercase; }
.values-strip p { margin:0; color:#8e8e8e; font-size:11px; line-height:1.5; }

.about-section { display:grid; grid-template-columns:1.15fr .85fr; align-items:center; gap:80px; }
.about-copy>p { color:var(--muted); font-size:16px; line-height:1.8; }
.about-copy .lead { color:#d7d3cd; font-size:18px; }
.about-copy strong { color:#fff; }
.facts { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-top:35px; }
.facts span { padding:16px; color:#999; background:var(--surface); border:1px solid var(--line); font-size:11px; text-transform:uppercase; }
.facts b { display:block; margin-bottom:6px; color:var(--orange); font:800 28px "Barlow Condensed"; }
.about-visual { text-align:center; }
.logo-halo { position:relative; display:grid; place-items:center; width:390px; max-width:90%; aspect-ratio:1; margin:auto; background:radial-gradient(circle,#302013 0%,#13100d 42%,transparent 68%); }
.logo-halo::before,.logo-halo::after { content:""; position:absolute; inset:10%; border:1px solid #513118; border-radius:50%; }
.logo-halo::after { inset:0; border-style:dashed; opacity:.45; animation:spin 28s linear infinite; }
@keyframes spin { to{transform:rotate(360deg)} }
.logo-halo img { position:relative; z-index:1; width:72%; filter:drop-shadow(0 20px 30px #000); }
.about-visual p { color:#777; font:600 11px Inter; letter-spacing:.15em; text-transform:uppercase; }

.team-section { border-top:1px solid #1d1d1d; }
.staff-grid { display:grid; grid-template-columns:1.25fr .75fr; gap:18px; }
.staff-group { padding:28px; background:var(--surface); border:1px solid var(--line); }
.staff-role { display:flex; align-items:center; gap:12px; padding-bottom:20px; border-bottom:1px solid var(--line); }
.staff-role span { display:grid; place-items:center; width:36px; height:36px; color:#111; background:var(--orange); }
.staff-role h3 { margin:0; font:700 25px "Barlow Condensed"; text-transform:uppercase; }
.staff-names { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; padding-top:18px; }
.staff-names div { padding:16px; background:#0b0b0b; border-left:2px solid var(--orange); }
.staff-names b,.staff-names small { display:block; }
.staff-names b { font:700 19px "Barlow Condensed"; }
.staff-names small { margin-top:4px; color:#777; font-size:10px; text-transform:uppercase; }
.staff-group:nth-child(2) .staff-names { grid-template-columns:repeat(2,1fr); }
.staff-group:nth-child(3) { grid-column:1/-1; }
.staff-group:nth-child(3) .staff-names { grid-template-columns:1fr; }

.reasons-section .section-intro { max-width:680px; margin:-18px 0 40px; color:var(--muted); font-size:17px; line-height:1.7; }
.reasons-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }
.reasons-grid article { min-height:270px; padding:28px; background:var(--surface); border:1px solid var(--line); transition:.25s; }
.reasons-grid article:hover { transform:translateY(-6px); border-color:var(--orange); }
.reasons-grid article>span { display:inline-block; padding:6px 9px; color:var(--orange); border:1px solid #6a401f; font:700 11px Inter; text-transform:uppercase; }
.reasons-grid h3 { margin:60px 0 12px; font:700 24px/1 "Barlow Condensed"; text-transform:uppercase; }
.reasons-grid p { margin:0; color:#888; font-size:13px; line-height:1.6; }
blockquote { margin:35px 0 0; padding:30px; color:#bcbcbc; background:#0d0d0d; border-left:3px solid var(--orange); font:500 19px/1.6 "Barlow Condensed"; text-align:center; text-transform:uppercase; }
blockquote strong { color:var(--orange); }

.convoy-section { position:relative; background:#101010 url('assets/convoi-04.png') center/cover fixed; }
.convoy-section::before { content:""; position:absolute; inset:0; background:rgba(4,4,4,.88); }
.convoy-inner { position:relative; }
.convoy-card { display:grid; grid-template-columns:150px 1.25fr 1fr; gap:30px; padding:35px; background:rgba(14,14,14,.94); border:1px solid #3b3b3b; box-shadow:0 25px 80px #000; }
.convoy-date { display:flex; flex-direction:column; justify-content:center; padding-right:25px; border-right:1px solid #444; }
.convoy-date strong { color:var(--orange); font:800 85px/.8 "Barlow Condensed"; }
.convoy-date span,.convoy-date small { display:block; font-weight:700; text-transform:uppercase; }
.convoy-date span { margin-top:12px; font-size:14px; }
.convoy-date small { margin-top:4px; color:#777; font-size:10px; }
.convoy-route p { margin:0 0 3px; color:#777; font-size:9px; letter-spacing:.15em; text-transform:uppercase; }
.convoy-route h3 { margin:0; font:700 29px "Barlow Condensed"; text-transform:uppercase; }
.convoy-route h3 small { color:#777; font-size:13px; }
.route-line { display:flex; align-items:center; gap:10px; margin:15px 0; color:var(--orange); font-size:10px; font-weight:700; }
.route-line i { flex:1; height:1px; background:#5d3b20; }
.convoy-meta { display:grid; grid-template-columns:repeat(2,1fr); gap:13px; }
.convoy-meta span { color:#777; font-size:10px; text-transform:uppercase; }
.convoy-meta b { display:block; margin-bottom:3px; color:#eee; font-size:12px; text-transform:none; }
.convoy-meta p { grid-column:1/-1; margin:0; color:var(--orange2); font-size:11px; }
.convoy-actions { grid-column:1/-1; display:flex; justify-content:flex-end; gap:10px; padding-top:25px; border-top:1px solid #333; }

.gallery-grid { display:grid; grid-template-columns:repeat(12,1fr); grid-auto-rows:210px; gap:14px; }
.gallery-grid button { position:relative; grid-column:span 5; padding:0; overflow:hidden; background:#111; border:0; cursor:pointer; }
.gallery-grid button:nth-child(2),.gallery-grid button:nth-child(3) { grid-column:span 7; }
.gallery-grid img { width:100%; height:100%; object-fit:cover; filter:saturate(.8); transition:.35s; }
.gallery-grid button:hover img { transform:scale(1.04); filter:saturate(1.1); }
.gallery-grid span { position:absolute; left:18px; bottom:15px; padding:7px 10px; color:#fff; background:rgba(0,0,0,.7); font-size:10px; letter-spacing:.1em; text-transform:uppercase; }

.recruit-section { position:relative; background:linear-gradient(120deg,#17100b,#0a0a0a 65%); border-block:1px solid #302013; }
.recruit-inner { display:grid; grid-template-columns:.8fr 1.2fr; gap:90px; align-items:start; }
.recruit-inner>div:first-child>p { max-width:450px; color:#aaa; font-size:17px; line-height:1.7; }
.recruit-inner>div:first-child>.button { margin-top:20px; }
.requirements { padding:35px; background:#0d0d0d; border:1px solid #333; }
.requirements h3 { margin:0 0 20px; font:700 25px "Barlow Condensed"; text-transform:uppercase; }
.requirements ul { display:grid; grid-template-columns:repeat(2,1fr); gap:13px 28px; padding:0; list-style:none; }
.requirements li { color:#b4b4b4; font-size:13px; }
.requirements li::before { content:"✓"; margin-right:9px; color:var(--orange); font-weight:800; }
.trial { display:flex; gap:18px; margin-top:25px; padding-top:25px; border-top:1px solid #333; }
.trial>b { color:var(--orange); font:800 40px "Barlow Condensed"; }
.trial p,.trial strong { display:block; margin:0; }
.trial p { color:#777; font-size:12px; line-height:1.6; }
.trial strong { color:#fff; font:700 17px "Barlow Condensed"; text-transform:uppercase; }

.social-intro { max-width:650px; margin:-18px 0 30px; color:#8e8a85; font-size:15px; line-height:1.7; }
.social-links { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }
.social-links a { position:relative; display:grid; grid-template-columns:58px 1fr auto; grid-template-rows:auto auto; align-items:center; min-width:0; padding:22px; overflow:hidden; background:var(--surface); border:1px solid var(--line); transition:.25s ease; }
.social-links a::before { content:""; position:absolute; inset:0 auto 0 0; width:4px; background:var(--social-color,var(--orange)); }
.social-links a:hover { transform:translateY(-5px); border-color:var(--social-color,var(--orange)); box-shadow:0 16px 35px rgba(0,0,0,.28); }
.social-links img { grid-row:1/3; width:42px; height:42px; object-fit:contain; border-radius:10px; }
.social-links span { min-width:0; font:700 24px "Barlow Condensed"; text-transform:uppercase; }
.social-links small { grid-column:2; overflow:hidden; color:#777; font-size:10px; white-space:nowrap; text-overflow:ellipsis; }
.social-links b { grid-column:3; grid-row:1/3; align-self:center; color:var(--social-color,var(--orange)); font-size:23px; }
.social-links .facebook { --social-color:#1877f2; }
.social-links .tiktok { --social-color:#25f4ee; }
.social-links .trucksbook { --social-color:#5bbad5; }
.social-links .truckersmp { --social-color:#b92025; }
.discord-banner { display:flex; align-items:center; justify-content:space-between; gap:25px; margin-top:14px; padding:25px 28px; background:linear-gradient(110deg,#17120e,#0e0d0c); border:1px solid #413124; border-radius:var(--radius); }
.discord-banner strong,.discord-banner span { display:block; }
.discord-banner strong { font:700 24px "Barlow Condensed"; text-transform:uppercase; }
.discord-banner span { margin-top:5px; color:#817d78; font-size:11px; }
.contact-form-wrap { display:grid; grid-template-columns:.7fr 1.3fr; gap:60px; margin-top:18px; padding:40px; background:var(--surface); border:1px solid var(--line); border-top:3px solid var(--orange); }
.contact-form-wrap h3 { margin:0 0 12px; font:700 36px "Barlow Condensed"; text-transform:uppercase; }
.contact-form-wrap>div>p:last-child { color:#888; font-size:13px; line-height:1.7; }
.contact-form-wrap form { display:grid; grid-template-columns:repeat(2,1fr); gap:17px; }
.contact-form-wrap label { color:#ddd; font-size:11px; font-weight:700; text-transform:uppercase; }
.contact-form-wrap input,.contact-form-wrap select,.contact-form-wrap textarea { width:100%; margin-top:8px; padding:14px; color:#fff; background:#090909; border:1px solid #393939; border-radius:var(--radius); outline:0; text-transform:none; }
.contact-form-wrap input:focus,.contact-form-wrap select:focus,.contact-form-wrap textarea:focus { border-color:var(--orange); }
.contact-form-wrap .full { grid-column:1/-1; }

footer { display:flex; align-items:center; gap:18px; padding:55px 5%; color:#777; border-top:1px solid #222; }
footer img { width:75px; }
footer strong,footer span { display:block; }
footer strong { color:#eee; font:700 19px "Barlow Condensed"; text-transform:uppercase; }
footer span { margin-top:3px; font-size:10px; }
footer p { margin-left:auto; font-size:10px; text-transform:uppercase; }
.lightbox { position:fixed; z-index:200; inset:0; display:grid; place-items:center; padding:5vw; background:rgba(0,0,0,.96); }
.lightbox[hidden] { display:none!important; }
.lightbox img { max-width:100%; max-height:88vh; box-shadow:0 20px 100px #000; }
.lightbox button { position:absolute; top:25px; right:30px; color:#fff; background:none; border:0; font-size:45px; cursor:pointer; }
#contact-status { margin:0; color:var(--orange2); font-size:12px; line-height:1.6; }

/* Proposition 01 — Route premium */
.concept-premium { --orange:#d97720; --orange2:#f3a25d; --surface:#121416; --line:#2b2e31; --radius:2px; background:#0a0b0c; }
.concept-premium .hero::after { background:linear-gradient(90deg,#080a0beF 4%,rgba(8,10,11,.62) 55%,rgba(8,10,11,.15)),linear-gradient(0deg,#0a0b0c,transparent 32%); }
.concept-premium .hero h1 { font-weight:600; letter-spacing:-.02em; }
.concept-premium .values-strip,.concept-premium .staff-group,.concept-premium .reasons-grid article { background:#121416; }

/* Proposition 02 — Communauté moderne */
.concept-community { --orange:#ff8a21; --orange2:#ffc078; --surface:#181613; --line:#38312a; --radius:16px; background:#0c0b0a; }
.concept-community .header-cta,.concept-community .button,.concept-community .hero-label span,.concept-community .staff-role span { border-radius:999px; }
.concept-community .hero::after { background:linear-gradient(90deg,rgba(19,11,5,.93),rgba(25,14,7,.55),rgba(0,0,0,.18)),linear-gradient(0deg,#0c0b0a,transparent 35%); }
.concept-community .hero h1,.concept-community .section-heading h2 { text-transform:none; }
.concept-community .values-strip,.concept-community .staff-group,.concept-community .reasons-grid article,.concept-community .contact-form-wrap,.concept-community .social-links a,.concept-community .requirements { border-radius:20px; }
.concept-community .values-strip { gap:8px; padding:8px; background:#15120f; }
.concept-community .values-strip article { border:0; border-radius:14px; }
.concept-community .reasons-grid article>span { border-radius:999px; }

/* Proposition 03 — Convoi cinématique */
.concept-cinematic { --orange:#f58218; --surface:#101010; --radius:0px; }
.concept-cinematic .hero h1 { text-shadow:5px 6px 0 #000,0 18px 50px #000; }
.concept-cinematic .hero h1 em { -webkit-text-stroke:1px var(--orange); color:transparent; }
.concept-cinematic .section-heading h2 em { -webkit-text-stroke:1px var(--orange); color:transparent; }
.concept-cinematic .gallery-grid button:first-child,.concept-cinematic .gallery-grid button:last-child { transform:translateY(14px); }

@media (max-width:1100px) {
  .nav { gap:14px; }.nav a { font-size:10px; }.brand { min-width:210px; }.brand span { display:none; }
  .reasons-grid { grid-template-columns:repeat(2,1fr); }.convoy-card { grid-template-columns:120px 1fr; }.convoy-meta { grid-column:1/-1; }.staff-grid { grid-template-columns:1fr; }
}
@media (max-width:800px) {
  .section { padding:78px 0; }
  .header { position:absolute; height:82px; padding:0 5%; }.brand img { width:62px;height:62px }.header-cta { display:none; }.menu-toggle { display:block; margin-left:auto; }
  .nav { position:absolute; top:82px; left:4%; right:4%; display:none; padding:20px; background:#101010; border:1px solid #333; }.nav.open { display:grid; }.nav a { padding:9px; font-size:12px; }
  .hero { min-height:750px; padding:125px 6% 90px; }.hero h1 { font-size:80px; }.hero-lead { font-size:15px; }.route-marker { display:none; }.hero-label span:nth-child(2) { display:none; }
  .values-strip { grid-template-columns:1fr; width:88%; margin:-25px auto 0; }.values-strip article { border-right:0; border-bottom:1px solid var(--line); }.values-strip article:nth-child(n+4) { display:none; }
  .about-section,.recruit-inner,.contact-form-wrap { grid-template-columns:1fr; gap:45px; }.about-visual { grid-row:1; }.logo-halo { width:280px; }.facts { grid-template-columns:1fr; }
  .staff-names { grid-template-columns:1fr!important; }.reasons-grid { grid-template-columns:1fr; }.reasons-grid article { min-height:220px; }.reasons-grid h3 { margin-top:38px; }
  .convoy-card { grid-template-columns:1fr; padding:24px; }.convoy-date { flex-direction:row; align-items:center; gap:15px; padding:0 0 20px; border-right:0; border-bottom:1px solid #333; }.convoy-date strong { font-size:65px; }.convoy-meta { grid-column:auto; }.convoy-actions { flex-direction:column; }.convoy-actions .button { width:100%; }
  .gallery-grid { grid-template-columns:1fr; grid-auto-rows:220px; }.gallery-grid button,.gallery-grid button:nth-child(2),.gallery-grid button:nth-child(3) { grid-column:auto; transform:none!important; }
  .requirements ul,.contact-form-wrap form { grid-template-columns:1fr; }.social-links { grid-template-columns:repeat(2,1fr); }.contact-form-wrap .full { grid-column:auto; }.contact-form-wrap { padding:25px; }.social-links a { min-width:0; }.discord-banner { align-items:flex-start; flex-direction:column; }.discord-banner .button { width:100%; }
  footer { align-items:flex-start; }footer p { display:none; }
}
@media (max-width:520px) { .social-links { grid-template-columns:1fr; } }
@media (prefers-reduced-motion:reduce) { * { scroll-behavior:auto!important; animation:none!important; transition:none!important; } }