/* ==========================================================
   Heavy's — styles partagés des pages secondaires
   (connexion, administration, confidentialité, franchise, recrutement)
   Même charte que la page d'accueil : noir, rouge, moutarde.
   ========================================================== */

@font-face{font-family:"Archivo";font-style:normal;font-weight:400 800;font-display:swap;src:url("/fonts/archivo.woff2") format("woff2")}
@font-face{font-family:"Big Shoulders Display";font-style:normal;font-weight:800 900;font-display:swap;src:url("/fonts/big-shoulders-display.woff2") format("woff2")}
@font-face{font-family:"Yellowtail";font-style:normal;font-weight:400;font-display:swap;src:url("/fonts/yellowtail.woff2") format("woff2")}

:root{
  --red:#D7262E;--red-d:#A9161D;--mus:#F4B400;--mus-d:#B98600;
  --ink:#0D0D0D;--ink2:#171514;--ink3:#211E1C;--off:#F5F0E6;--mute:#B9B1A4;
  --line:rgba(245,240,230,.12);--ok:#3FB950;
  --disp:"Big Shoulders Display","Arial Narrow",Impact,sans-serif;
}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{scrollbar-color:var(--red) var(--ink)}
body{margin:0;min-height:100vh;background:var(--ink);color:var(--off);font:500 17px/1.55 Archivo,"Helvetica Neue",sans-serif;-webkit-font-smoothing:antialiased}
::selection{background:var(--mus);color:var(--ink)}
a{color:var(--off)}
a:hover{color:var(--mus)}
:focus-visible{outline:3px solid var(--mus);outline-offset:3px}

.disp{font-family:var(--disp);font-weight:900;text-transform:uppercase;letter-spacing:-.01em;line-height:.9;margin:0}
.kicker{font-family:Yellowtail,cursive;color:var(--red);font-size:30px;line-height:1;margin:0 0 4px;display:inline-block;transform:rotate(-4deg)}
.muted{color:var(--mute)}
.wrap{max-width:1180px;margin:0 auto;padding:0 24px}

/* ---------- Barre du haut ---------- */
.topbar{position:sticky;top:0;z-index:20;background:rgba(13,13,13,.97);border-bottom:1px solid var(--line)}
.topbar-in{display:flex;align-items:center;gap:16px;min-height:68px}
.brand{display:flex;align-items:baseline;gap:10px;text-decoration:none;margin-right:auto;padding:6px 0}
.brand img{height:34px;width:auto;display:block}
.brand span{font-family:var(--disp);font-weight:800;font-size:13px;letter-spacing:.18em;text-transform:uppercase;color:var(--mute)}

/* ---------- Boutons ---------- */
.btn{white-space:nowrap;display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:50px;padding:0 24px;border:0;border-radius:999px;font-family:var(--disp);font-weight:900;font-size:21px;letter-spacing:.04em;text-transform:uppercase;text-decoration:none;cursor:pointer;transition:transform .15s cubic-bezier(.3,1.6,.5,1),background .15s,box-shadow .15s,color .15s}
.btn:hover{transform:translateY(-2px)}
.btn:active{transform:scale(.96)}
.btn:disabled{opacity:.55;cursor:not-allowed;transform:none}
.btn-red{background:var(--red);color:#fff;box-shadow:0 5px 0 var(--red-d)}
.btn-red:hover{background:#E2303A;color:#fff}
.btn-mus{background:var(--mus);color:var(--ink);box-shadow:0 5px 0 var(--mus-d)}
.btn-mus:hover{color:var(--ink)}
.btn-ghost{background:transparent;color:var(--off);box-shadow:inset 0 0 0 2px rgba(245,240,230,.55)}
.btn-ghost:hover{background:var(--off);color:var(--ink)}
.btn-sm{min-height:44px;font-size:17px;padding:0 18px}
.btn-block{width:100%}

/* ---------- Formulaires ---------- */
.field{display:flex;flex-direction:column;gap:7px;margin-bottom:18px}
.field label{font-weight:800;font-size:13px;letter-spacing:.1em;text-transform:uppercase}
.field input,.field textarea,.field select{width:100%;min-height:52px;border-radius:12px;border:2px solid rgba(245,240,230,.2);background:var(--ink);color:var(--off);font:600 17px Archivo,sans-serif;padding:12px 16px;transition:border-color .2s,box-shadow .2s}
.field textarea{min-height:220px;resize:vertical;line-height:1.5;font-weight:500}
.field input:focus,.field textarea:focus,.field select:focus{outline:none;border-color:var(--mus);box-shadow:0 0 0 5px rgba(244,180,0,.16)}
.field input::placeholder,.field textarea::placeholder{color:#7d766d}
.field select{appearance:none;-webkit-appearance:none;padding-right:44px;cursor:pointer;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23F4B400' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;background-size:18px}
.field label small{font-weight:600;letter-spacing:0;text-transform:none;color:var(--mute)}
.hint{font-size:14px;color:var(--mute);margin:-8px 0 18px}
.tools{display:flex;flex-wrap:wrap;gap:8px;margin:-8px 0 18px}
.tools + .hint{margin-top:-8px}

/* ---------- Messages ---------- */
.msg{display:none;margin-top:16px;padding:14px 16px;border-radius:12px;font-weight:700;font-size:15px}
.msg.show{display:block}
.msg.error{background:rgba(215,38,46,.14);border:2px solid var(--red);color:#FF8A8F}
.msg.success{background:rgba(63,185,80,.12);border:2px solid var(--ok);color:#7EE787}

/* ---------- Cartes ---------- */
.card{background:var(--ink2);border:1px solid var(--line);border-radius:22px;padding:28px}

/* ---------- Page de connexion ---------- */
.auth{min-height:100vh;display:grid;place-items:center;padding:32px 16px;position:relative;overflow:hidden;isolation:isolate}
.auth::before{content:"HEAVY'S";position:absolute;left:50%;top:50%;translate:-50% -50%;z-index:-1;font:900 clamp(140px,34vw,520px)/.8 var(--disp);color:transparent;-webkit-text-stroke:2px rgba(245,240,230,.06);white-space:nowrap;pointer-events:none}
.auth-card{width:100%;max-width:440px;background:var(--ink2);border:1px solid var(--line);border-top:6px solid var(--red);border-radius:24px;padding:36px 32px 30px;box-shadow:0 40px 80px -30px rgba(0,0,0,.8);animation:rise .5s cubic-bezier(.2,1.2,.4,1) both}
.auth-card .logo{display:block;height:46px;width:auto;margin:0 auto 22px}
.auth-card h1{font-size:clamp(48px,12vw,64px);text-align:center}
.auth-card .sub{text-align:center;color:var(--mute);margin:8px 0 28px;font-weight:600}
.pw{position:relative}
.pw input{padding-right:84px}
.pw button{position:absolute;right:8px;top:50%;translate:0 -50%;min-height:40px;padding:0 12px;border:0;border-radius:8px;background:transparent;color:var(--mute);font:800 12px Archivo,sans-serif;letter-spacing:.1em;text-transform:uppercase;cursor:pointer}
.pw button:hover{color:var(--mus)}
.back{display:block;text-align:center;margin-top:22px;font-weight:700;font-size:15px;color:var(--mute);text-decoration:none}
.back:hover{color:var(--mus)}
@keyframes rise{from{opacity:0;transform:translateY(24px) scale(.98)}to{opacity:1;transform:none}}

/* ---------- Administration ---------- */
.admin-head{padding:44px 0 26px}
.admin-head h1{font-size:clamp(52px,9vw,104px)}
.admin-head p{margin:10px 0 0;color:var(--mute);font-weight:600}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(180px,100%),1fr));gap:14px;margin-bottom:28px}
.stat{background:var(--ink2);border:1px solid var(--line);border-radius:18px;padding:20px 22px;transition:border-color .2s}
.stat:hover{border-color:rgba(244,180,0,.45)}
.stat b{display:block;font:900 clamp(44px,6vw,60px)/1 var(--disp);color:var(--mus)}
.stat span{display:block;margin-top:6px;font-weight:800;font-size:13px;letter-spacing:.1em;text-transform:uppercase;color:var(--mute)}
.stat.hot{background:var(--red);border-color:var(--red)}
.stat.hot b{color:#fff}
.stat.hot span{color:rgba(255,255,255,.85)}
.panel{background:var(--ink2);border:1px solid var(--line);border-radius:22px;padding:28px;margin-bottom:24px}
.panel-head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;margin-bottom:20px}
.panel h2{font-size:clamp(34px,4.6vw,46px)}
.panel h2 em{font-style:normal;color:var(--mus)}
.grid-2{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(380px,100%),1fr));gap:24px;align-items:start}
.preview-label{font-weight:800;font-size:13px;letter-spacing:.1em;text-transform:uppercase;margin:0 0 7px}
.preview{display:block;width:100%;height:640px;border:2px solid rgba(245,240,230,.2);border-radius:12px;background:var(--ink)}
.toolbar{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.search{min-height:44px;min-width:min(260px,100%);border-radius:999px;border:2px solid rgba(245,240,230,.2);background:var(--ink);color:var(--off);font:600 15px Archivo,sans-serif;padding:0 18px}
.search:focus{outline:none;border-color:var(--mus)}
.chips{display:flex;gap:6px}
.chip{min-height:44px;padding:0 16px;border-radius:999px;border:2px solid rgba(245,240,230,.2);background:transparent;color:var(--off);font:900 16px var(--disp);letter-spacing:.04em;text-transform:uppercase;cursor:pointer}
.chip.on{background:var(--red);border-color:var(--red);color:#fff}
.table-wrap{overflow-x:auto;border-radius:14px;border:1px solid var(--line)}
table{width:100%;border-collapse:collapse;font-size:15px}
th{position:sticky;top:0;background:var(--ink3);text-align:left;padding:13px 16px;font-weight:800;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--mute);white-space:nowrap}
td{padding:13px 16px;border-top:1px solid var(--line);vertical-align:middle}
tbody tr:hover{background:rgba(245,240,230,.03)}
td.email{word-break:break-all}
td.actions{white-space:nowrap;text-align:right}
td.actions .btn{margin-left:6px}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}

/* ---------- Onglets de l'admin ---------- */
.tabs{display:flex;flex-wrap:wrap;gap:8px;padding-top:26px}
.tabs + div .admin-head{padding-top:26px}
.tab-badge{display:inline-block;min-width:22px;margin-left:6px;padding:1px 7px;border-radius:999px;background:var(--mus);color:var(--ink);font:800 13px/1.5 Archivo,sans-serif;letter-spacing:0;text-align:center}
.admin-head a{color:var(--off)}

/* ---------- Messages de la boîte mail ---------- */
tr.unread td{font-weight:800}
.more{margin:16px 0 0;text-align:center}
.attachments{margin:0 0 14px;font-size:14px}
.modal .mail-body{background:#fff;margin-bottom:16px}
.modal{overflow:auto}
.modal.replying .preview{height:min(300px,32vh)}
.modal.replying #messageReply{display:none}
.reply .field{margin-bottom:14px}
.reply .field textarea{min-height:140px}
.reply .tools{margin:0 0 14px}
.reply .msg.show{margin:0 0 14px}

/* ---------- Fiche d'une candidature ---------- */
.details{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(240px,100%),1fr));gap:14px 20px;margin:0 0 18px}
.details dt{font-weight:800;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--mute);margin-bottom:3px}
.details dd{margin:0;word-break:break-word}
.job-message{margin:0 0 18px;padding:16px 18px;max-height:min(320px,40vh);overflow:auto;background:var(--ink);border:1px solid var(--line);border-radius:12px;white-space:pre-wrap;word-break:break-word}
.modal-actions{display:flex;flex-wrap:wrap;gap:10px}
.modal-actions .btn-red{margin-left:auto}
.field input[type=file]{padding:9px 12px;font-size:15px;cursor:pointer}
.field input[type=file]::file-selector-button{margin-right:12px;padding:7px 14px;border:0;border-radius:999px;background:var(--mus);color:var(--ink);font:800 13px Archivo,sans-serif;letter-spacing:.06em;text-transform:uppercase;cursor:pointer}

/* ---------- Fenêtre d'aperçu (historique des campagnes) ---------- */
.modal{width:min(720px,calc(100vw - 24px));max-height:calc(100vh - 24px);padding:22px;border:1px solid var(--line);border-radius:22px;background:var(--ink2);color:var(--off)}
.modal::backdrop{background:rgba(0,0,0,.72)}
.modal-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:16px}
.modal-head h2{font-size:clamp(26px,4vw,34px);line-height:1}
.modal-head p{margin:8px 0 0;font-size:14px}
.modal .preview{height:min(560px,calc(100vh - 260px));margin-bottom:16px}
.badge{display:inline-block;padding:4px 11px;border-radius:999px;font-weight:800;font-size:12px;letter-spacing:.08em;text-transform:uppercase}
.badge.on{background:rgba(63,185,80,.16);color:#7EE787}
.badge.off{background:rgba(215,38,46,.18);color:#FF8A8F}
.badge.wait{background:rgba(244,180,0,.16);color:var(--mus)}
.empty{padding:40px 16px;text-align:center;color:var(--mute);font-weight:600}
.count{color:var(--mute);font-weight:700;font-size:15px}
.refresh{font-size:13px;color:var(--mute)}

/* Tableau en cartes sur mobile */
@media (max-width:640px){
  .wrap{padding:0 16px}
  .brand span{display:none}
  .topbar-in{gap:8px}
  .topbar .btn-sm{font-size:15px;padding:0 13px}
  .stats{grid-template-columns:1fr 1fr;gap:10px}
  .stat{padding:16px}
  .stat.hot{grid-column:1 / -1}
  .search{flex:1 1 100%}
  .panel,.card{padding:20px;border-radius:18px}
  .table-wrap{border:0}
  table,thead,tbody,tr,td{display:block}
  thead{display:none}
  tbody tr{background:var(--ink);border:1px solid var(--line);border-radius:14px;padding:12px 14px;margin-bottom:10px}
  td{border:0;padding:4px 0;display:flex;justify-content:space-between;gap:12px}
  td.actions{justify-content:flex-end;padding-top:10px}
  td.actions::before{content:none}
  td::before{content:attr(data-label);font-weight:800;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--mute)}
  .auth-card{padding:28px 20px 24px}
}

/* ---------- Pages de texte (confidentialité) ---------- */
.doc{max-width:760px;margin:0 auto;padding:56px 24px 80px}
.doc h1{font-size:clamp(56px,11vw,110px)}
.doc .updated{color:var(--mute);font-weight:600;margin:12px 0 40px}
.doc h2{font:900 clamp(28px,4vw,36px)/1 var(--disp);text-transform:uppercase;color:var(--mus);margin:44px 0 14px}
.doc p,.doc li{color:#E4DED3}
.doc ul{padding-left:22px}
.doc li{margin:4px 0}
.doc li::marker{color:var(--red)}
.doc strong{color:var(--off)}
.doc a{color:var(--mus)}

/* ---------- Pages franchise et recrutement ---------- */
.page{max-width:980px;margin:0 auto;padding:56px 24px 80px}
.page h1{font-size:clamp(56px,11vw,118px)}
.page h1 em,.page h2 em{font-style:normal;color:var(--mus)}
.page h2{font-size:clamp(38px,6vw,56px);margin:64px 0 22px;scroll-margin-top:88px}
/* Le logo Heavy's dans un titre, teinté en jaune (le SVG sert de masque) */
.logo-mus{display:inline-block;height:1.05em;aspect-ratio:690/242;vertical-align:-.22em;background:var(--mus);-webkit-mask:url(/img/logo-heavys.svg) center/contain no-repeat;mask:url(/img/logo-heavys.svg) center/contain no-repeat}
.lead{max-width:680px;margin:22px 0 30px;font-size:clamp(18px,2.2vw,21px);color:#E4DED3}
.cta-row{display:flex;flex-wrap:wrap;gap:14px}
.perks{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(260px,100%),1fr));gap:14px}
.perk{background:var(--ink2);border:1px solid var(--line);border-radius:18px;padding:22px}
.perk h3{font:900 26px/1 var(--disp);text-transform:uppercase;color:var(--mus);margin:0 0 8px}
.perk p{margin:0;color:#E4DED3;font-size:16px}
.steps{list-style:none;margin:0;padding:0;display:grid;gap:14px;counter-reset:step}
.steps li{counter-increment:step;display:grid;grid-template-columns:auto 1fr;gap:4px 18px;align-items:center;background:var(--ink2);border:1px solid var(--line);border-radius:18px;padding:18px 22px}
.steps li::before{content:counter(step);grid-row:span 2;font:900 54px/1 var(--disp);color:var(--red);min-width:34px}
.steps b{font:900 24px/1 var(--disp);text-transform:uppercase}
.steps span{color:#E4DED3;font-size:16px}
.form-card{background:var(--ink2);border:1px solid var(--line);border-top:6px solid var(--red);border-radius:24px;padding:32px}
.form-card h2{margin-top:0}
.form-card .field textarea{min-height:150px}
.form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(280px,100%),1fr));gap:0 18px}
.consent{display:flex;gap:12px;align-items:flex-start;margin:4px 0 22px;font-size:14px;color:var(--mute);cursor:pointer}
.consent input{flex:none;width:22px;height:22px;margin:0;accent-color:var(--mus)}
.consent a{color:inherit}
.trap{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.sent{text-align:center;padding:24px 0}
.sent h2{margin:0 0 12px}
.sent p{color:#E4DED3;margin:0 0 22px}
@media (max-width:640px){
  .page{padding:40px 16px 64px}
  .form-card{padding:22px 18px;border-radius:20px}
  .cta-row .btn{flex:1 1 100%}
}

.foot{border-top:1px solid var(--line);padding:24px 0;color:var(--mute);font-size:14px}
.foot a{color:var(--mute)}

@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* bandeau cookies (js/consent.js) : pages franchise et recrutement */
.ck{position:fixed;left:16px;bottom:16px;z-index:100;width:min(420px,calc(100% - 32px));background:#0D0D0D;color:var(--off);border:1px solid rgba(245,240,230,.18);border-radius:18px;padding:20px;box-shadow:0 20px 50px rgba(0,0,0,.55);display:flex;flex-direction:column;gap:10px}
.ck[hidden]{display:none}
.ck-t{margin:0;font-family:"Big Shoulders Display",Impact,sans-serif;font-weight:900;font-size:26px;text-transform:uppercase;color:var(--mus)}
.ck-d{margin:0;font-size:15px;font-weight:600;line-height:1.45}
.ck-d a{color:var(--off)}
.ck-btns{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:4px}
.ck .ck-btn{min-height:46px;font-size:19px;padding:0 16px;background:transparent;color:var(--off);box-shadow:inset 0 0 0 2px rgba(245,240,230,.55)}
.ck .ck-btn:hover{background:var(--off);color:#0D0D0D}
.ck .ck-btn:focus-visible{outline:3px solid var(--mus);outline-offset:3px}