:root {
  --ink:#0b1118;
  --paper:#fff;
  --soft:#eef3f7;
  --warm:#f6f4f0;
  --line:#d8e0e7;
  --muted:#5c6876;
  --blue:#1769ff;
  --green:#18a66f;
  --shadow:0 24px 70px rgba(11,17,24,.14);
  font-family:"Segoe UI",Arial,Helvetica,sans-serif;--content-max:1280px;
}

* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--paper); line-height:1.58; overflow-x:hidden; }
a { color:inherit; text-decoration:none; }
button,input,select,textarea { font:inherit; }
button { cursor:pointer; }
img { display:block; max-width:100%; }
h1,h2,h3,p { margin-top:0; }
h1,h2,h3 { letter-spacing:0; }
h1 { max-width:980px; margin-bottom:26px; color:#fff; font-size:5.25rem; line-height:.94; }
h2 { margin-bottom:24px; font-size:4rem; line-height:1; }
h3 { margin-bottom:10px; font-size:1.45rem; line-height:1.15; }
p { color:var(--muted); }

.career-hero {
  position:relative;
  min-height:760px;
  display:flex;
  align-items:flex-end;
  overflow:hidden;
  color:#fff;
  background:#111820;
}

.career-hero-media {
  position:absolute;
  inset:0;
  background-image:linear-gradient(90deg,rgba(5,9,13,.82),rgba(5,9,13,.46)),url("../assets/vp-ads-equipe.jpg");
  background-size:cover;
  background-position:center;
}

.career-hero-content {
  position:relative;
  z-index:1;
  width:min(calc(100% - 40px),var(--content-max));
  margin-inline:auto;
  padding:150px 0 112px;
}

.eyebrow {
  margin-bottom:18px;
  color:var(--blue);
  font-size:.76rem;
  font-weight:900;
  text-transform:uppercase;
}

.career-hero .eyebrow { color:#d9e8ff; }
.career-hero p:not(.eyebrow) { max-width:720px; color:rgba(255,255,255,.82); font-size:1.16rem; }
.hero-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:32px; }
.btn {
  display:inline-flex;
  min-height:50px;
  align-items:center;
  justify-content:center;
  gap:9px;
  padding:0 18px;
  border:1px solid transparent;
  border-radius:8px;
  font-weight:850;
  transition:transform 240ms cubic-bezier(.22,1,.36,1),background-color 240ms ease,border-color 240ms ease,box-shadow 240ms ease;
}
.btn:hover { transform:translateY(-3px); }
.btn svg { width:18px; height:18px; }
.primary { color:#fff; background:var(--blue); box-shadow:0 14px 36px rgba(23,105,255,.28); }
.primary:hover { background:#0d58e7; }
.ghost { color:#fff; border-color:rgba(255,255,255,.48); background:rgba(8,13,19,.22); }
.ghost:hover { background:rgba(8,13,19,.48); border-color:#fff; }

.career-intro,.apply-section { padding:104px max(20px,calc((100vw - var(--content-max))/2)); }
.section-label {
  display:flex;
  align-items:center;
  gap:14px;
  margin-bottom:66px;
  color:var(--muted);
  font-size:.75rem;
  font-weight:900;
  text-transform:uppercase;
}
.section-label span {
  display:grid;
  width:34px;
  height:34px;
  place-items:center;
  border:1px solid var(--line);
  border-radius:50%;
  color:var(--ink);
}
.section-label p { margin:0; color:inherit; font:inherit; }
.section-label.light { color:rgba(255,255,255,.54); }
.section-label.light span { color:#fff; border-color:rgba(255,255,255,.24); }

.intro-grid,.apply-section {
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(360px,.78fr);
  gap:8%;
  align-items:start;
}
.intro-copy p { font-size:1.08rem; line-height:1.78; }

.talent-section {
  padding:104px max(20px,calc((100vw - var(--content-max))/2));
  color:#fff;
  background:var(--ink);
}
.talent-grid {
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  border-top:1px solid rgba(255,255,255,.18);
  border-bottom:1px solid rgba(255,255,255,.18);
}
.talent-grid article {
  min-height:300px;
  padding:28px 22px;
  border-right:1px solid rgba(255,255,255,.16);
}
.talent-grid article:last-child { border-right:0; }
.talent-grid svg { width:32px; height:32px; margin-bottom:68px; color:#72e0b2; }
.talent-grid h3 { color:#fff; }
.talent-grid p { margin:0; color:rgba(255,255,255,.62); }

.apply-section { background:var(--warm); }
.apply-copy p:not(.eyebrow) { max-width:620px; font-size:1.08rem; }
.career-form {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px;
  padding:30px;
  border:1px solid var(--line);
  border-radius:8px;
  background:#fff;
  box-shadow:var(--shadow);
}
label { display:grid; gap:8px; color:var(--ink); font-size:.84rem; font-weight:850; }
input,select,textarea {
  width:100%;
  min-height:50px;
  padding:0 13px;
  color:var(--ink);
  border:1px solid var(--line);
  border-radius:6px;
  background:#fff;
  transition:border-color 220ms ease,box-shadow 220ms ease;
}
textarea { min-height:130px; padding-top:13px; resize:vertical; }
input[type="file"] { padding:13px; }
.file-help { display:block; margin-top:8px; color:var(--muted); font-size:.78rem; line-height:1.45; }
input:focus,select:focus,textarea:focus { outline:0; border-color:var(--blue); box-shadow:0 0 0 4px rgba(23,105,255,.12); }
.full { grid-column:1 / -1; }
.form-note { grid-column:1 / -1; margin:0; font-size:.78rem; }
.form-note.is-error { color:#c2410c; font-weight:800; }
.form-note.is-success { color:var(--green); font-weight:800; }
.career-form .btn { position:relative; }
.career-form .btn.is-loading { color:transparent; pointer-events:none; }
.career-form .btn.is-loading::after {
  position:absolute;
  width:22px;
  height:22px;
  content:"";
  border:2px solid rgba(255,255,255,.45);
  border-top-color:#fff;
  border-radius:50%;
  animation:career-spin .8s linear infinite;
}
@keyframes career-spin { to { transform:rotate(360deg); } }

.footer {
  display:grid;
  grid-template-columns:auto minmax(240px,1fr) auto;
  gap:34px;
  align-items:center;
  padding:36px max(20px,calc((100vw - var(--content-max))/2));
  color:#fff;
  background:var(--ink);
  border-top:1px solid rgba(255,255,255,.12);
}
.footer-brand { width:82px; overflow:visible; border-radius:0; }
.footer p { max-width:620px; margin:0; color:rgba(255,255,255,.58); }
.footer nav { display:flex; flex-wrap:wrap; gap:18px; color:rgba(255,255,255,.76); font-size:.85rem; font-weight:750; }
.footer nav a:hover { color:#fff; }

@media (max-width:1120px) {
  h1 { font-size:4.2rem; }
  h2 { font-size:3.35rem; }
  .talent-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .talent-grid article { border-bottom:1px solid rgba(255,255,255,.16); }
}

@media (max-width:860px) {
  h1 { font-size:3.45rem; }
  h2 { font-size:2.85rem; }
  .career-hero { min-height:680px; }
  .career-hero-content {
    width:calc(100% - 40px);
    padding:126px 0 74px;
  }
  .career-intro,.talent-section,.apply-section { padding:78px 20px; }
  .intro-grid,.apply-section { grid-template-columns:1fr; gap:38px; }
  .section-label { margin-bottom:46px; }
  .footer { grid-template-columns:1fr; }
}

@media (max-width:560px) {
  h1 { font-size:2.65rem; line-height:.98; }
  h2 { font-size:2.35rem; }
  .hero-actions,.btn { width:100%; }
  .talent-grid { grid-template-columns:1fr; }
  .talent-grid article { min-height:auto; border-right:0; }
  .talent-grid svg { margin-bottom:34px; }
  .career-form { grid-template-columns:1fr; padding:20px; }
}
.footer-brand img{width:100%;height:auto;object-fit:contain;filter:drop-shadow(0 8px 18px rgba(0,0,0,.28));}
