/* ============================================================
   IKOS — Design System v1
   L'emploi industriel en Australie, pour les talents francophones
   ------------------------------------------------------------
   01. Tokens        02. Base & reset      03. Typographie
   04. Layout        05. Header & nav      06. Footer
   07. Boutons       08. Badges & chips    09. Cartes
   10. Formulaires   11. Accordéons        12. Onglets
   13. Stats         14. Callouts          15. Tables
   16. Navigation 2  17. Divers & motion   18. Responsive
   ============================================================ */

/* ————— 01. TOKENS ————— */
:root{
  /* Encre — bleu nuit industriel */
  --ink-950:#070B12; --ink-900:#0C1220; --ink-850:#101828;
  --ink-800:#16202F; --ink-700:#1F2D40; --ink-600:#2C3E57;
  --ink-500:#46586F; --ink-400:#697D95; --ink-300:#9AAABD;
  --ink-200:#C9D4E0; --ink-100:#E6ECF2; --ink-50:#F2F5F8;

  /* Papier — sable chaud */
  --paper:#F7F4EE; --paper-2:#EFEAE0; --white:#FFFFFF;

  /* Ambre — hi-vis raffiné */
  --amber-700:#9E4A0D; --amber-600:#BC5A11; --amber-500:#E87A1E;
  --amber-400:#F6953B; --amber-300:#FFB262; --amber-200:#FFD8A8;
  --amber-100:#FBEBD7;

  /* Eucalyptus & supports */
  --euca-700:#175041; --euca-600:#1F6A54; --euca-500:#2F8266; --euca-100:#DCEFE6;
  --red-600:#B94032;  --red-100:#F8E3E0;
  --blue-600:#2E6485; --blue-100:#DFEDF5;

  /* Thème par défaut (clair, papier) */
  --bg:var(--paper);
  --fg:var(--ink-900);
  --muted:#57677D;
  --line:#E3DDD1;
  --card-bg:var(--white);
  --card-line:#E7E2D8;
  --accent:var(--amber-600);
  --chip-bg:#FFFFFF;

  /* Typo */
  --f-display:'Archivo','TeX Gyre Heros','Helvetica Neue',Arial,system-ui,sans-serif;
  --f-body:'Inter','Liberation Sans','Helvetica Neue',Arial,system-ui,sans-serif;
  --f-mono:'IBM Plex Mono','DejaVu Sans Mono','SFMono-Regular',Consolas,monospace;

  --fs-display:clamp(2.7rem,1.1rem + 5.2vw,4.9rem);
  --fs-h1:clamp(2.2rem,1.5rem + 2.6vw,3.3rem);
  --fs-h2:clamp(1.75rem,1.25rem + 1.9vw,2.5rem);
  --fs-h3:clamp(1.3rem,1.12rem + .7vw,1.6rem);
  --fs-h4:1.13rem;

  /* Géométrie */
  --container:1200px;
  --r-xs:4px; --r-sm:8px; --r-md:12px; --r-lg:16px;
  --notch:12px;

  /* Ombres */
  --sh-sm:0 1px 2px rgba(12,18,32,.06),0 2px 8px rgba(12,18,32,.05);
  --sh-md:0 2px 6px rgba(12,18,32,.06),0 12px 32px -8px rgba(12,18,32,.14);
  --sh-lg:0 4px 12px rgba(12,18,32,.08),0 28px 60px -16px rgba(12,18,32,.22);

  --ease:cubic-bezier(.16,1,.3,1);
}

/* Thème sombre par section */
.theme-dark{
  --bg:var(--ink-900);
  --fg:#EDF2F9;
  --muted:#9CADC2;
  --line:rgba(255,255,255,.11);
  --card-bg:#111B2C;
  --card-line:rgba(255,255,255,.09);
  --accent:var(--amber-300);
  --chip-bg:rgba(255,255,255,.05);
}
.theme-deep{ --bg:var(--ink-950); }
.theme-deep{ --fg:#EDF2F9; --muted:#9CADC2; --line:rgba(255,255,255,.11);
  --card-bg:#101928; --card-line:rgba(255,255,255,.09); --accent:var(--amber-300);
  --chip-bg:rgba(255,255,255,.05); }
.theme-white{ --bg:var(--white); --line:#ECE7DD; --card-line:#E9E4DA; }
.theme-paper2{ --bg:var(--paper-2); --card-line:#E2DCCF; --line:#DFD8C9; }

/* ————— 02. BASE ————— */
*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; scroll-padding-top:96px; -webkit-text-size-adjust:100%; }
body{
  margin:0; font-family:var(--f-body); font-size:1rem; line-height:1.65;
  background:var(--paper); color:var(--ink-900);
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
}
img,svg{ display:block; max-width:100%; }
a{ color:inherit; text-decoration:none; }
button{ font:inherit; color:inherit; background:none; border:0; padding:0; cursor:pointer; }
ul,ol{ margin:0; padding:0; list-style:none; }
p{ margin:0 0 1em; }
p:last-child{ margin-bottom:0; }
::selection{ background:var(--amber-500); color:var(--ink-950); }
:focus-visible{ outline:2px solid var(--amber-500); outline-offset:2px; border-radius:2px; }
.skip-link{
  position:fixed; top:-60px; left:16px; z-index:300; padding:10px 16px;
  background:var(--ink-950); color:#fff; border-radius:8px; transition:top .2s;
}
.skip-link:focus{ top:14px; }

/* Grain global très subtil */
body::before{
  content:""; position:fixed; inset:0; z-index:2000; pointer-events:none; opacity:.028;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* ————— 03. TYPOGRAPHIE ————— */
h1,h2,h3,h4,.display{
  font-family:var(--f-display); font-stretch:112%; font-weight:740;
  letter-spacing:-.015em; line-height:1.08; margin:0 0 .5em; color:var(--fg);
}
.display{ font-size:var(--fs-display); font-weight:790; line-height:1.02; letter-spacing:-.02em; }
h1{ font-size:var(--fs-h1); }
h2{ font-size:var(--fs-h2); }
h3{ font-size:var(--fs-h3); }
h4{ font-size:var(--fs-h4); }
.lead{ font-size:1.14rem; line-height:1.7; color:var(--muted); max-width:62ch; }
.lead--lg{ font-size:1.24rem; }
strong{ font-weight:650; }
em.hl{ font-style:normal; color:var(--amber-500); }
em.hl--under{
  font-style:normal;
  background:linear-gradient(transparent 68%, var(--amber-200) 68%);
}
.theme-dark em.hl--under,.theme-deep em.hl--under{
  background:linear-gradient(transparent 68%, rgba(232,122,30,.4) 68%);
}

.eyebrow{
  display:inline-flex; align-items:center; gap:12px;
  font-family:var(--f-mono); font-size:.72rem; font-weight:500;
  letter-spacing:.22em; text-transform:uppercase; color:var(--muted); margin:0 0 18px;
}
.eyebrow::before{ content:""; width:26px; height:2px; background:var(--amber-500); flex:none; }
.mono{ font-family:var(--f-mono); }
.mono-label{
  font-family:var(--f-mono); font-size:.7rem; letter-spacing:.14em;
  text-transform:uppercase; color:var(--muted);
}
.link-arr{
  display:inline-flex; align-items:center; gap:8px; font-weight:600; font-size:.95rem;
  color:var(--accent); transition:gap .25s var(--ease);
}
.link-arr:hover{ gap:12px; }
.link-plain{ font-weight:600; color:var(--accent); border-bottom:1px solid transparent; }
.link-plain:hover{ border-bottom-color:currentColor; }

/* ————— 04. LAYOUT ————— */
.container{ width:min(var(--container),100% - 48px); margin-inline:auto; }
.container--narrow{ width:min(880px,100% - 48px); margin-inline:auto; }
.section{ position:relative; padding:104px 0; background:var(--bg); color:var(--fg); }
.section--sm{ padding:72px 0; }
.section--xs{ padding:48px 0; }
.section--flush-top{ padding-top:0; }
.sec-head{
  display:flex; align-items:flex-end; justify-content:space-between;
  gap:32px; margin-bottom:52px;
}
.sec-head h2{ margin-bottom:0; max-width:22ch; }
.sec-head .lead{ margin-top:14px; }
.sec-head__aside{ flex:none; padding-bottom:6px; }
.grid{ display:grid; gap:24px; }
.cols-2{ grid-template-columns:repeat(2,1fr); }
.cols-3{ grid-template-columns:repeat(3,1fr); }
.cols-4{ grid-template-columns:repeat(4,1fr); }
.center{ text-align:center; }
.center .eyebrow{ justify-content:center; }
.center .lead{ margin-inline:auto; }

/* Fond quadrillage « blueprint » */
.grid-bg{ position:relative; overflow:hidden; }
.grid-bg > *{ position:relative; z-index:1; }
.grid-bg::before{
  content:""; position:absolute; inset:0; z-index:0; pointer-events:none;
  background-image:
    linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);
  background-size:46px 46px;
  -webkit-mask-image:radial-gradient(120% 90% at 50% 0%,#000 30%,transparent 78%);
          mask-image:radial-gradient(120% 90% at 50% 0%,#000 30%,transparent 78%);
}
.grid-bg--light::before{
  background-image:
    linear-gradient(rgba(12,18,32,.055) 1px,transparent 1px),
    linear-gradient(90deg,rgba(12,18,32,.055) 1px,transparent 1px);
}

/* Bande « hazard » signature */
.hazard{
  height:7px; width:100%;
  background:repeating-linear-gradient(-45deg,
    var(--amber-500) 0 13px, var(--ink-950) 13px 26px);
}
.hazard--thin{ height:4px; }

/* ————— 05. HEADER ————— */
.site-header{
  position:fixed; inset:0 0 auto 0; z-index:120;
  --hd-fg:var(--ink-900); --hd-mut:#5A6A80;
  transition:background .35s,border-color .35s,box-shadow .35s;
  border-bottom:1px solid transparent;
}
body[data-nav="dark"] .site-header{ --hd-fg:#EDF2F9; --hd-mut:#A7B6C9; }
.site-header.is-scrolled{
  background:rgba(247,244,238,.86);
  -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px);
  border-bottom-color:rgba(12,18,32,.08);
}
body[data-nav="dark"] .site-header.is-scrolled{
  background:rgba(9,13,21,.8);
  border-bottom-color:rgba(255,255,255,.08);
}
.site-header__in{
  display:flex; align-items:center; gap:28px; height:76px;
  width:min(1320px,100% - 48px); margin-inline:auto;
}
.brand{ display:flex; align-items:center; gap:11px; color:var(--hd-fg); }
.brand__mark{ width:34px; height:34px; flex:none; }
.brand__name{
  font-family:var(--f-display); font-stretch:118%; font-weight:800;
  font-size:1.32rem; letter-spacing:.04em;
}
.brand__tag{
  font-family:var(--f-mono); font-size:.58rem; letter-spacing:.18em;
  color:var(--hd-mut); display:block; margin-top:-3px; text-transform:uppercase;
}
.nav{ display:flex; gap:2px; margin-left:12px; }
.nav a{
  position:relative; padding:9px 13px; border-radius:8px;
  font-size:.93rem; font-weight:530; color:var(--hd-mut);
  transition:color .2s;
}
.nav a:hover{ color:var(--hd-fg); }
.nav a.is-active{ color:var(--hd-fg); font-weight:620; }
.nav a.is-active::after{
  content:""; position:absolute; left:13px; right:13px; bottom:2px;
  height:2px; background:var(--amber-500); border-radius:2px;
}
.site-header__actions{ margin-left:auto; display:flex; align-items:center; gap:10px; }
.site-header__actions .btn--text{ color:var(--hd-mut); }
.site-header__actions .btn--text:hover{ color:var(--hd-fg); }
.nav-toggle{
  display:none; width:44px; height:44px; border-radius:10px;
  color:var(--hd-fg); align-items:center; justify-content:center;
}

/* Drawer mobile */
.drawer{
  position:fixed; inset:0; z-index:200; background:var(--ink-950); color:#EDF2F9;
  display:flex; flex-direction:column; padding:24px;
  transform:translateY(-102%); transition:transform .5s var(--ease); visibility:hidden;
}
.drawer.open{ transform:none; visibility:visible; }
.drawer__top{ display:flex; justify-content:space-between; align-items:center; height:56px; }
.drawer__nav{ margin:auto 0; display:flex; flex-direction:column; gap:4px; }
.drawer__nav a{
  font-family:var(--f-display); font-stretch:112%; font-weight:740;
  font-size:clamp(1.7rem,6vw,2.4rem); padding:10px 4px; color:#EDF2F9;
  display:flex; align-items:baseline; gap:16px; border-radius:10px;
}
.drawer__nav a:hover{ color:var(--amber-300); }
.drawer__nav a .idx{ font:500 .72rem var(--f-mono); color:var(--amber-500); letter-spacing:.15em; }
.drawer__foot{ display:flex; flex-direction:column; gap:16px; padding-top:24px; border-top:1px solid rgba(255,255,255,.12); }

/* ————— 06. FOOTER ————— */
.site-footer{ position:relative; background:var(--ink-950); color:#A9B8CB; overflow:hidden; }
.site-footer::before{ content:""; display:block; height:6px;
  background:repeating-linear-gradient(-45deg,var(--amber-500) 0 13px,var(--ink-950) 13px 26px); }
.site-footer a:hover{ color:#fff; }
.footer-main{
  display:grid; grid-template-columns:1.5fr 1fr 1fr 1fr; gap:48px;
  padding:72px 0 56px; position:relative; z-index:1;
}
.footer-brand p{ font-size:.95rem; line-height:1.7; margin:18px 0 22px; max-width:34ch; }
.footer-col h4{
  font-family:var(--f-mono); font-size:.7rem; font-weight:500; letter-spacing:.2em;
  text-transform:uppercase; color:#6C7E96; margin:0 0 18px;
}
.footer-col ul{ display:flex; flex-direction:column; gap:11px; }
.footer-col a{ font-size:.93rem; color:#A9B8CB; }
.footer-socials{ display:flex; gap:10px; }
.footer-socials a{
  width:38px; height:38px; display:grid; place-items:center; border-radius:9px;
  border:1px solid rgba(255,255,255,.14); color:#C6D2E0; transition:.25s;
}
.footer-socials a:hover{ border-color:var(--amber-500); color:var(--amber-300); transform:translateY(-2px); }
.footer-ack{
  position:relative; z-index:1; border-top:1px solid rgba(255,255,255,.09);
  padding:22px 0; font-size:.8rem; color:#6C7E96; line-height:1.6;
}
.footer-bottom{
  position:relative; z-index:1; border-top:1px solid rgba(255,255,255,.09);
  padding:22px 0 26px; display:flex; flex-wrap:wrap; gap:14px 28px;
  align-items:center; font-size:.82rem; color:#7A8CA2;
}
.footer-bottom .legal{ display:flex; gap:20px; margin-left:auto; }
.footer-bottom .legal a{ color:#7A8CA2; }
.footer-watermark{
  position:absolute; left:50%; bottom:-.28em; transform:translateX(-50%);
  font-family:var(--f-display); font-stretch:125%; font-weight:840;
  font-size:clamp(9rem,24vw,20rem); line-height:1; letter-spacing:.03em;
  color:transparent; -webkit-text-stroke:1px rgba(255,255,255,.055);
  pointer-events:none; user-select:none; white-space:nowrap;
}

/* ————— 07. BOUTONS ————— */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:9px;
  padding:13px 24px; border-radius:2px; border:1px solid transparent;
  font-weight:620; font-size:.94rem; line-height:1; white-space:nowrap;
  transition:transform .2s var(--ease),background .2s,border-color .2s,color .2s,box-shadow .2s;
}
.btn .icon{ width:17px; height:17px; transition:transform .25s var(--ease); }
.btn:hover .icon--go{ transform:translateX(3px); }
.btn:active{ transform:translateY(1px); }
.btn--primary{
  background:var(--amber-500); color:var(--ink-950);
  clip-path:polygon(0 0,calc(100% - var(--notch)) 0,100% var(--notch),100% 100%,0 100%);
}
.btn--primary:hover{ background:var(--amber-400); }
.btn--dark{ background:var(--ink-900); color:#fff; }
.btn--dark:hover{ background:var(--ink-700); }
.btn--outline{ border-color:var(--ink-300); color:var(--fg); }
.btn--outline:hover{ border-color:var(--fg); }
.theme-dark .btn--outline,.theme-deep .btn--outline{ border-color:rgba(255,255,255,.28); color:#EDF2F9; }
.theme-dark .btn--outline:hover,.theme-deep .btn--outline:hover{ border-color:var(--amber-400); color:var(--amber-300); }
.btn--ghost{ color:var(--fg); background:transparent; }
.btn--ghost:hover{ background:rgba(12,18,32,.06); }
.theme-dark .btn--ghost:hover,.theme-deep .btn--ghost:hover{ background:rgba(255,255,255,.07); }
.btn--text{ padding:10px 12px; font-weight:560; }
.btn--lg{ padding:16px 30px; font-size:1rem; }
.btn--sm{ padding:9px 16px; font-size:.86rem; }
.btn--block{ width:100%; }
.btn-icon{
  width:42px; height:42px; padding:0; display:inline-grid; place-items:center;
  border-radius:9px; border:1px solid var(--card-line); color:var(--muted);
  transition:.25s;
}
.btn-icon:hover{ border-color:var(--amber-500); color:var(--amber-600); }
.save.is-saved{ background:var(--amber-100); border-color:var(--amber-500); color:var(--amber-700); }
.save.is-saved .icon{ fill:currentColor; }

/* ————— 08. BADGES & CHIPS ————— */
.badge{
  display:inline-flex; align-items:center; gap:6px; padding:4px 9px;
  border-radius:var(--r-xs); font-family:var(--f-mono); font-size:.67rem;
  font-weight:500; letter-spacing:.06em; text-transform:uppercase; line-height:1.5;
  background:var(--ink-100); color:var(--ink-600); border:1px solid transparent;
}
.badge .icon{ width:12px; height:12px; }
.badge--amber{ background:var(--amber-100); color:var(--amber-700); }
.badge--euca{ background:var(--euca-100); color:var(--euca-700); }
.badge--blue{ background:var(--blue-100); color:var(--blue-600); }
.badge--red{ background:var(--red-100); color:var(--red-600); }
.badge--solid{ background:var(--amber-500); color:var(--ink-950); }
.badge--ink{ background:var(--ink-900); color:#fff; }
.badge--dark{ background:rgba(255,255,255,.07); color:#C9D5E3; border-color:rgba(255,255,255,.12); }
.badge--outline{ background:transparent; border-color:var(--line); color:var(--muted); }

.chip{
  display:inline-flex; align-items:center; gap:8px; padding:9px 16px;
  border-radius:8px; border:1px solid var(--line); background:var(--chip-bg);
  font-size:.88rem; font-weight:560; color:var(--fg); cursor:pointer;
  transition:.22s;
}
.chip:hover{ border-color:var(--ink-400); }
.chip.is-on{ background:var(--ink-900); border-color:var(--ink-900); color:#fff; }
.theme-dark .chip.is-on,.theme-deep .chip.is-on{ background:var(--amber-500); border-color:var(--amber-500); color:var(--ink-950); }
.chip .icon{ width:15px; height:15px; }
.chip-row{ display:flex; flex-wrap:wrap; gap:10px; }

/* ————— 09. CARTES ————— */
.card{
  background:var(--card-bg); border:1px solid var(--card-line);
  border-radius:var(--r-lg); padding:26px;
  transition:transform .35s var(--ease),box-shadow .35s,border-color .35s;
}
.card--hover:hover{ transform:translateY(-5px); box-shadow:var(--sh-lg); border-color:var(--ink-300); }
.theme-dark .card--hover:hover,.theme-deep .card--hover:hover{ border-color:rgba(255,255,255,.22); box-shadow:0 24px 60px -18px rgba(0,0,0,.6); }
.card--flush{ padding:0; overflow:hidden; }

.logo-tile{
  display:inline-grid; place-items:center; width:46px; height:46px; flex:none;
  border-radius:11px; font-family:var(--f-display); font-stretch:110%;
  font-weight:760; font-size:.95rem; letter-spacing:.03em; color:#fff;
  background:var(--tile,#2C3E57);
}
.logo-tile--lg{ width:64px; height:64px; font-size:1.25rem; border-radius:14px; }

/* Carte offre d'emploi */
.job-card{ display:flex; flex-direction:column; gap:14px; position:relative; }
.job-card__top{ display:flex; gap:14px; align-items:flex-start; }
.job-card__title{ font-size:1.06rem; margin:0 0 2px; line-height:1.3; letter-spacing:-.01em; }
.job-card__title a::after{ content:""; position:absolute; inset:0; }
.job-card__company{ font-size:.85rem; color:var(--muted); margin:0; }
.job-card .save{ margin-left:auto; position:relative; z-index:2; }
.job-card__meta{ display:flex; flex-wrap:wrap; gap:6px 16px; }
.job-card__meta li{
  display:flex; align-items:center; gap:6px; font-size:.84rem; color:var(--muted);
}
.job-card__meta .icon{ width:14px; height:14px; color:var(--ink-400); }
.job-card__salary{
  font-family:var(--f-mono); font-weight:600; font-size:1.02rem; color:var(--fg);
  padding:11px 14px; background:var(--paper); border:1px dashed var(--line);
  border-radius:9px; display:flex; align-items:baseline; gap:8px;
}
.job-card__salary span{ font-size:.72rem; font-weight:400; color:var(--muted); letter-spacing:.04em; }
.theme-dark .job-card__salary,.theme-deep .job-card__salary{ background:rgba(255,255,255,.04); }
.job-card__tags{ display:flex; flex-wrap:wrap; gap:7px; }
.job-card__foot{
  margin-top:auto; padding-top:14px; border-top:1px solid var(--card-line);
  display:flex; justify-content:space-between; align-items:center;
  font-size:.8rem; color:var(--muted);
}
.job-card__foot .link-arr{ font-size:.88rem; position:relative; z-index:2; }

/* ————— 10. FORMULAIRES ————— */
.field{ display:flex; flex-direction:column; gap:8px; }
.field > label:not(.check){
  font-family:var(--f-mono); font-size:.68rem; font-weight:500;
  letter-spacing:.14em; text-transform:uppercase; color:var(--muted);
}
.field .req{ color:var(--amber-600); }
.input,.select,.textarea{
  width:100%; padding:13px 15px; border-radius:var(--r-sm);
  border:1px solid var(--line); background:var(--card-bg); color:var(--fg);
  font:inherit; font-size:.95rem; transition:border-color .2s,box-shadow .2s;
  appearance:none;
}
.textarea{ min-height:140px; resize:vertical; line-height:1.6; }
.input::placeholder,.textarea::placeholder{ color:var(--ink-400); }
.input:focus,.select:focus,.textarea:focus{
  outline:none; border-color:var(--amber-500);
  box-shadow:0 0 0 3px rgba(232,122,30,.18);
}
.select-wrap{ position:relative; }
.select-wrap .icon{
  position:absolute; right:14px; top:50%; width:16px; height:16px;
  transform:translateY(-50%); pointer-events:none; color:var(--muted);
}
.select{ padding-right:42px; cursor:pointer; }
.input-icon{ position:relative; }
.input-icon > .icon{
  position:absolute; left:14px; top:50%; transform:translateY(-50%);
  width:17px; height:17px; color:var(--ink-400); pointer-events:none;
}
.input-icon .input{ padding-left:42px; }
.check{ display:flex; align-items:flex-start; gap:10px; font-size:.92rem; cursor:pointer; color:var(--fg); }
.check input{ width:17px; height:17px; margin-top:2px; accent-color:var(--amber-600); cursor:pointer; flex:none; }
.check span{ line-height:1.5; }
.check--sub{ color:var(--muted); font-size:.86rem; }
input[type=range]{ width:100%; accent-color:var(--amber-600); cursor:pointer; }
.field-err{ display:none; font-size:.8rem; color:var(--red-600); }
.field.has-err .input,.field.has-err .textarea,.field.has-err .select{ border-color:var(--red-600); }
.field.has-err .field-err{ display:block; }
.form-note{ font-size:.82rem; color:var(--muted); }

/* ————— 11. ACCORDÉONS ————— */
.acc{ border-top:1px solid var(--line); }
.acc-item{ border-bottom:1px solid var(--line); }
.acc-head{
  width:100%; display:flex; align-items:center; gap:18px; text-align:left;
  padding:22px 4px; font-weight:600; font-size:1.02rem; color:var(--fg);
}
.acc-head:hover{ color:var(--amber-600); }
.theme-dark .acc-head:hover{ color:var(--amber-300); }
.acc-head .icon{
  width:18px; height:18px; margin-left:auto; flex:none; color:var(--muted);
  transition:transform .35s var(--ease);
}
.acc-item.open .acc-head .icon{ transform:rotate(180deg); color:var(--amber-500); }
.acc-panel{ display:grid; grid-template-rows:0fr; transition:grid-template-rows .4s var(--ease); }
.acc-panel > div{ overflow:hidden; }
.acc-item.open .acc-panel{ grid-template-rows:1fr; }
.acc-body{ padding:0 4px 24px; color:var(--muted); font-size:.96rem; line-height:1.7; max-width:70ch; }

/* ————— 12. ONGLETS ————— */
.tabs{ display:flex; gap:6px; flex-wrap:wrap; }
.tabs--line{ gap:0; border-bottom:1px solid var(--line); }
.tabs--line .tab{
  padding:12px 18px; font-weight:560; font-size:.94rem; color:var(--muted);
  position:relative; border-radius:0;
}
.tabs--line .tab.is-on{ color:var(--fg); }
.tabs--line .tab.is-on::after{
  content:""; position:absolute; left:0; right:0; bottom:-1px; height:2px; background:var(--amber-500);
}
[data-tabpanel]{ display:none; }
[data-tabpanel].is-on{ display:block; animation:fadeUp .5s var(--ease); }
@keyframes fadeUp{ from{ opacity:0; transform:translateY(10px);} to{ opacity:1; transform:none;} }

/* ————— 13. STATS ————— */
.stat{ padding-left:18px; border-left:2px solid var(--amber-500); }
.stat__value{
  font-family:var(--f-display); font-stretch:114%; font-weight:790;
  font-size:clamp(1.9rem,1.2rem + 2vw,2.7rem); line-height:1.05; color:var(--fg);
  display:flex; align-items:baseline; gap:4px;
}
.stat__value .unit{ font-family:var(--f-mono); font-size:.85rem; font-weight:500; color:var(--amber-500); }
.stat__label{ margin-top:6px; font-family:var(--f-mono); font-size:.68rem; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); }

/* ————— 14. CALLOUTS ————— */
.callout{
  display:flex; gap:14px; padding:18px 20px; border-radius:var(--r-md);
  border:1px solid; font-size:.95rem; line-height:1.65;
}
.callout .icon{ width:19px; height:19px; flex:none; margin-top:3px; }
.callout b{ display:block; margin-bottom:2px; font-weight:650; }
.callout--info{ background:var(--blue-100); border-color:#C3DCEC; color:#1E4258; }
.callout--info .icon{ color:var(--blue-600); }
.callout--warn{ background:var(--amber-100); border-color:#F2D9B8; color:#6B3A10; }
.callout--warn .icon{ color:var(--amber-600); }
.callout--tip{ background:var(--euca-100); border-color:#C2E2D2; color:#164434; }
.callout--tip .icon{ color:var(--euca-600); }
.callout--danger{ background:var(--red-100); border-color:#EFC9C4; color:#7C2A20; }
.callout--danger .icon{ color:var(--red-600); }

/* ————— 15. TABLES ————— */
.table-wrap{ border:1px solid var(--card-line); border-radius:var(--r-md); overflow:auto; background:var(--card-bg); }
table.table{ width:100%; border-collapse:collapse; font-size:.92rem; min-width:560px; }
.table th{
  text-align:left; padding:13px 18px; background:var(--ink-50);
  font-family:var(--f-mono); font-size:.66rem; font-weight:500;
  letter-spacing:.14em; text-transform:uppercase; color:var(--ink-500);
  border-bottom:1px solid var(--card-line);
}
.theme-dark .table th{ background:rgba(255,255,255,.04); color:var(--muted); }
.table td{ padding:13px 18px; border-bottom:1px solid var(--card-line); vertical-align:top; }
.table tr:last-child td{ border-bottom:0; }
.table tbody tr{ transition:background .15s; }
.table tbody tr:hover{ background:var(--ink-50); }
.theme-dark .table tbody tr:hover{ background:rgba(255,255,255,.03); }
.table .mono{ font-size:.86rem; }

/* ————— 16. NAVIGATION SECONDAIRE ————— */
.breadcrumbs{
  display:flex; flex-wrap:wrap; gap:8px; align-items:center;
  font-family:var(--f-mono); font-size:.72rem; letter-spacing:.08em;
  text-transform:uppercase; color:var(--muted);
}
.breadcrumbs a:hover{ color:var(--amber-600); }
.breadcrumbs .sep{ opacity:.45; }
.pagination{ display:flex; gap:8px; justify-content:center; align-items:center; }
.pagination button{
  min-width:42px; height:42px; padding:0 8px; border-radius:9px;
  border:1px solid var(--line); font-family:var(--f-mono); font-size:.88rem;
  color:var(--fg); transition:.2s; display:grid; place-items:center;
}
.pagination button:hover{ border-color:var(--ink-400); }
.pagination button.is-on{ background:var(--ink-900); border-color:var(--ink-900); color:#fff; }
.pagination button:disabled{ opacity:.35; cursor:default; }

/* ————— 17. DIVERS & MOTION ————— */
.avatar{
  width:46px; height:46px; border-radius:50%; display:grid; place-items:center;
  font-family:var(--f-display); font-weight:740; font-size:.9rem; color:#fff;
  background:var(--av,#46586F); flex:none;
}
.quote-card{ display:flex; flex-direction:column; gap:20px; }
.quote-card__mark{
  font-family:var(--f-display); font-size:3.4rem; line-height:.6;
  color:var(--amber-500); font-weight:800; height:.55em;
}
.quote-card blockquote{ margin:0; font-size:1.02rem; line-height:1.7; color:var(--fg); }
.quote-card__who{ margin-top:auto; display:flex; gap:13px; align-items:center; }
.quote-card__who b{ display:block; font-size:.93rem; }
.quote-card__who span{ font-size:.8rem; color:var(--muted); display:block; }

.marquee{ overflow:hidden; position:relative;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);
          mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent); }
.marquee__track{ display:flex; gap:64px; width:max-content; animation:marquee 36s linear infinite; padding-block:4px; }
.marquee:hover .marquee__track{ animation-play-state:paused; }
@keyframes marquee{ to{ transform:translateX(-50%); } }
.partner{
  font-family:var(--f-display); font-stretch:116%; font-weight:700; font-size:1.05rem;
  letter-spacing:.14em; color:var(--muted); opacity:.75; white-space:nowrap;
  display:flex; align-items:center; gap:10px;
}
.partner .icon{ width:16px; height:16px; color:var(--amber-500); opacity:.9; }

.toast{
  position:fixed; right:24px; bottom:24px; z-index:400;
  display:flex; gap:12px; align-items:flex-start; max-width:380px;
  background:var(--ink-900); color:#EDF2F9; border:1px solid rgba(255,255,255,.14);
  border-radius:12px; padding:16px 18px; box-shadow:var(--sh-lg);
  transform:translateY(20px); opacity:0; pointer-events:none;
  transition:.4s var(--ease); font-size:.92rem; line-height:1.55;
}
.toast.show{ transform:none; opacity:1; pointer-events:auto; }
.toast .icon{ width:18px; height:18px; color:var(--amber-400); flex:none; margin-top:2px; }
.toast b{ display:block; }

/* Révélation au scroll */
.rv{ opacity:0; transform:translateY(26px); transition:opacity .75s var(--ease),transform .75s var(--ease); }
.rv.in{ opacity:1; transform:none; }
.rv[data-d="1"]{ transition-delay:.08s; } .rv[data-d="2"]{ transition-delay:.16s; }
.rv[data-d="3"]{ transition-delay:.24s; } .rv[data-d="4"]{ transition-delay:.32s; }
.rv[data-d="5"]{ transition-delay:.4s; }

.icon{ width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:1.8;
  stroke-linecap:round; stroke-linejoin:round; flex:none; }
.icon--s{ width:16px; height:16px; }
.icon--l{ width:26px; height:26px; }
.icon-tile{
  width:52px; height:52px; border-radius:13px; display:grid; place-items:center;
  background:var(--ink-900); color:var(--amber-400); flex:none;
  transition:background .3s,color .3s,transform .3s var(--ease);
}
.icon-tile .icon{ width:24px; height:24px; stroke-width:1.6; }
.icon-tile--light{ background:var(--amber-100); color:var(--amber-700); }
.icon-tile--ghost{ background:rgba(255,255,255,.06); color:var(--amber-300); border:1px solid rgba(255,255,255,.1); }

.divider-word{ display:flex; align-items:center; gap:20px; color:var(--muted); }
.divider-word::before,.divider-word::after{ content:""; height:1px; flex:1; background:var(--line); }

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{ animation-duration:.01ms !important; animation-iteration-count:1 !important;
    transition-duration:.01ms !important; scroll-behavior:auto !important; }
  .rv{ opacity:1; transform:none; }
}

/* ————— 18. RESPONSIVE ————— */
@media (max-width:1080px){
  .nav{ display:none; }
  .nav-toggle{ display:inline-flex; }
  .site-header__actions .btn--text{ display:none; }
  .footer-main{ grid-template-columns:1fr 1fr; gap:40px; }
}
@media (max-width:900px){
  .cols-3,.cols-4{ grid-template-columns:repeat(2,1fr); }
  .sec-head{ flex-direction:column; align-items:flex-start; gap:18px; margin-bottom:40px; }
  .section{ padding:80px 0; }
}
@media (max-width:640px){
  .container{ width:min(var(--container),100% - 40px); }
  .cols-2,.cols-3,.cols-4{ grid-template-columns:1fr; }
  .site-header__actions .btn--primary{ display:none; }
  .footer-main{ grid-template-columns:1fr; gap:36px; padding:56px 0 44px; }
  .footer-bottom .legal{ margin-left:0; flex-wrap:wrap; }
  .toast{ left:16px; right:16px; max-width:none; }
}


/* ————— 19. PHOTOS RÉELLES (heros IA v1) ————— */
.hero-photo{position:absolute;inset:0;z-index:0;background:url('https://ikos-plateforme.netlify.app/assets/hero-accueil.jpg') center 38%/cover no-repeat;opacity:.26;
  -webkit-mask-image:linear-gradient(100deg,transparent 0 34%,rgba(0,0,0,.9) 62%,#000 100%);mask-image:linear-gradient(100deg,transparent 0 34%,rgba(0,0,0,.9) 62%,#000 100%);}
.hero-home .grid-lines{z-index:1}
.photo-band{position:relative;overflow:hidden;border-radius:0;margin:0}
.photo-band__img{display:block;width:100%;height:340px;object-fit:cover}
@media(min-width:900px){.photo-band__img{height:420px}}
.photo-band__scrim{position:absolute;inset:0;background:linear-gradient(90deg,rgba(7,11,18,.82) 0%,rgba(7,11,18,.45) 46%,rgba(7,11,18,.12) 100%)}
.photo-band .container{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center}
.photo-band .eyebrow{color:#FFB262}
.photo-band h2{color:#F4F7FB;max-width:22ch;margin:6px 0 10px}
.photo-band p{color:#C9D4E0;max-width:52ch}

/* ————— 20. EMBLÈMES AGENTS IA ————— */
.aemb{display:block;width:100%;height:100%}
.agent-emblem{flex:0 0 auto;width:46px;height:46px;filter:drop-shadow(0 6px 14px rgba(0,0,0,.5))}
.agent-emblem--lg{width:58px;height:58px}
.agent-pill .agent-emblem{width:44px;height:44px}
.agent-card:hover .agent-emblem{filter:drop-shadow(0 6px 18px rgba(232,122,30,.35))}
.circuit-bg{position:relative}
.circuit-bg::after{content:"";position:absolute;inset:0;pointer-events:none;opacity:.5;
background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220' viewBox='0 0 220 220'%3E%3Cg fill='none' stroke='%232C3E57' stroke-opacity='.33' stroke-width='1'%3E%3Cpath d='M20 0 V52 L64 96 H128'/%3E%3Cpath d='M220 168 H160 L120 208 V220'/%3E%3Cpath d='M0 140 H36 L72 176'/%3E%3C/g%3E%3Cg fill='%2346586F' fill-opacity='.5'%3E%3Ccircle cx='128' cy='96' r='2.2'/%3E%3Ccircle cx='72' cy='176' r='2.2'/%3E%3Ccircle cx='160' cy='168' r='2.2'/%3E%3C/g%3E%3Cg fill='%23E87A1E' fill-opacity='.28'%3E%3Ccircle cx='20' cy='52' r='1.8'/%3E%3Ccircle cx='120' cy='208' r='1.8'/%3E%3C/g%3E%3C/svg%3E");}
.circuit-bg > .container{position:relative;z-index:1}

.agent-card__portrait{margin:-16px -16px 2px;border-radius:14px 14px 0 0;overflow:hidden;background:#0B1322}
.agent-card__portrait img{display:block;width:100%;height:215px;object-fit:cover;object-position:center 20%}
@media(min-width:900px){.agent-card__portrait img{height:255px}}

.agent-avatar{flex:0 0 auto;width:48px;height:48px;border-radius:50%;object-fit:cover;border:2.5px solid var(--amber-500);box-shadow:0 0 0 3px rgba(0,0,0,.25),0 6px 16px rgba(0,0,0,.45);background:#0B1322}
.agent-avatar--lg{width:60px;height:60px}
.agent-avatar--sm{width:34px;height:34px;border-width:2px}
.demo-title-avatar{width:34px;height:34px;border-radius:50%;object-fit:cover;vertical-align:middle;margin-right:9px;border:2px solid var(--amber-500)}

/* ————— 21. CARTE INTERACTIVE v2 ————— */
.mapx{display:grid;grid-template-columns:1fr;gap:18px}
@media(min-width:980px){.mapx{grid-template-columns:1.35fr .65fr}}
.mapx-stage{position:relative;background:linear-gradient(180deg,#0B1322,#0A1120);border:1px solid rgba(255,255,255,.09);border-radius:16px;overflow:hidden}
.mapx-svg{display:block;width:100%;height:auto;touch-action:manipulation}
.mapx-svg .st{fill:#16243B;stroke:#2C3E57;stroke-width:1.2;cursor:pointer;transition:fill .25s}
.mapx-svg .st:hover{fill:#1E3050}
.mapx-svg .st.on{fill:#24354F;stroke:#E87A1E;stroke-width:1.8}
.mapx-svg .st.dim{opacity:.35}
.mapx-svg .stlb{fill:#8FA1B8;font-size:13px;font-weight:700;letter-spacing:.08em;pointer-events:none;font-family:var(--f-mono,monospace)}
.mapx-svg .pt{cursor:pointer;transition:opacity .2s}
.mapx-svg .pt circle.core{stroke:#0A1120;stroke-width:1.2}
.mapx-svg .pt.sel circle.core{stroke:#fff;stroke-width:2}
.mapx-svg .pt.hide{opacity:.06;pointer-events:none}
.mapx-svg .pt .halo{opacity:.32}
.mapx-svg .pt.sd .halo{animation:mpulse 2.6s ease-out infinite}
@keyframes mpulse{0%{transform-origin:center;opacity:.45}70%{opacity:0}100%{opacity:0}}
.mapx-bar{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:14px}
.mapx-chip{border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.03);color:#C9D5E3;font-size:.78rem;font-weight:700;padding:7px 12px;border-radius:999px;cursor:pointer;display:inline-flex;align-items:center;gap:7px}
.mapx-chip i{width:9px;height:9px;border-radius:50%;display:inline-block}
.mapx-chip.on{background:rgba(232,122,30,.16);border-color:#E87A1E;color:#fff}
.mapx-search{flex:1;min-width:190px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.14);color:#EAF0F7;border-radius:10px;padding:10px 13px;font-size:.9rem}
.mapx-back{position:absolute;top:12px;left:12px;z-index:3;background:rgba(11,19,34,.9);border:1px solid rgba(255,255,255,.18);color:#fff;font-weight:700;font-size:.8rem;padding:8px 13px;border-radius:9px;cursor:pointer;display:none}
.mapx-back.on{display:block}
.mapx-count{position:absolute;bottom:12px;left:12px;z-index:3;font-size:.74rem;color:#8FA1B8;background:rgba(11,19,34,.85);border:1px solid rgba(255,255,255,.1);padding:6px 11px;border-radius:8px}
.mapx-panel{background:#0E1729;border:1px solid rgba(255,255,255,.09);border-radius:16px;overflow:hidden;align-self:start}
.mapx-photo{position:relative;height:170px;background:#0B1322}
.mapx-photo img{width:100%;height:100%;object-fit:cover;display:block}
.mapx-photo .tag{position:absolute;left:12px;bottom:10px;background:rgba(10,17,32,.85);border:1px solid rgba(255,255,255,.15);color:#EAF0F7;font-size:.7rem;font-weight:700;padding:4px 9px;border-radius:6px}
.mapx-photo .credit{position:absolute;right:10px;top:10px;font-size:.62rem;color:#93A5BB;background:rgba(10,17,32,.7);padding:3px 7px;border-radius:5px}
.mapx-body{padding:16px}
.mapx-body h3{margin:0 0 3px;font-size:1.12rem;color:#F2F6FB}
.mapx-body .op{font-size:.82rem;color:#93A5BB;margin-bottom:10px}
.mapx-body p{font-size:.88rem;color:#B9C6D6;margin:0 0 14px}
.mapx-kpis{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px}
.mapx-kpi{flex:1;min-width:88px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.09);border-radius:9px;padding:9px}
.mapx-kpi b{display:block;font-size:1.02rem;color:#fff}
.mapx-kpi span{font-size:.66rem;text-transform:uppercase;letter-spacing:.09em;color:#8298B0}
.mapx-jobs{border-top:1px solid rgba(255,255,255,.08);padding-top:12px}
.mapx-jobs h4{font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:#FFB262;margin:0 0 9px}
.mapx-job{display:block;padding:9px 0;border-bottom:1px dashed rgba(255,255,255,.08);color:#DCE5EF;text-decoration:none}
.mapx-job:last-of-type{border-bottom:none}
.mapx-job b{display:block;font-size:.88rem}
.mapx-job span{font-size:.74rem;color:#8FA1B8}
.mapx-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:9px;margin-top:20px}
.mapx-item{text-align:left;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.09);border-left-width:3px;border-radius:10px;padding:10px 12px;cursor:pointer;color:#DCE5EF}
.mapx-item:hover{background:rgba(255,255,255,.06)}
.mapx-item b{display:block;font-size:.86rem}
.mapx-item span{font-size:.72rem;color:#8FA1B8}
.mapx-note{font-size:.74rem;color:#7E90A8;margin-top:14px}

/* ————— 22. SOURCING DES OFFRES ————— */
.src-line{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:-4px 0 10px}
.src-badge{display:inline-flex;align-items:center;gap:6px;font-size:.7rem;font-weight:800;letter-spacing:.02em;
  color:var(--sc);border:1px solid color-mix(in srgb, var(--sc) 45%, transparent);
  background:color-mix(in srgb, var(--sc) 12%, transparent);padding:3px 9px;border-radius:6px}
.src-badge .icon{width:12px;height:12px}
.src-via{font-size:.72rem;color:var(--muted)}
.chan-grid{display:grid;grid-template-columns:1fr;gap:12px}
@media(min-width:760px){.chan-grid{grid-template-columns:repeat(4,1fr)}}
.chan{border:1px solid var(--card-line,rgba(255,255,255,.1));border-radius:14px;padding:16px;background:var(--card-bg,#0E1729)}
.chan__top{display:flex;align-items:center;gap:9px;margin-bottom:9px}
.chan__dot{width:11px;height:11px;border-radius:50%}
.chan h3{margin:0;font-size:.98rem}
.chan p{margin:0;font-size:.85rem;color:var(--muted)}
.chan__step{margin-top:10px;font-size:.74rem;color:var(--muted);border-top:1px dashed rgba(255,255,255,.12);padding-top:9px}
.decoder{display:grid;grid-template-columns:1fr;gap:10px;margin-top:16px}
@media(min-width:760px){.decoder{grid-template-columns:repeat(3,1fr)}}
.decoder .d{border-left:3px solid var(--amber-500,#E87A1E);background:rgba(255,255,255,.03);border-radius:0 10px 10px 0;padding:12px 14px}
.decoder .d b{display:block;font-size:.9rem;margin-bottom:3px}
.decoder .d span{font-size:.82rem;color:var(--muted)}

/* ————— 23. JOB BOARD ————— */
.jb-search{background:var(--ink-900,#0C1220);border-bottom:1px solid rgba(255,255,255,.08);padding:20px 0}
.jb-search__row{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.jb-field{position:relative;flex:1;min-width:200px;display:flex;align-items:center;gap:9px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.14);border-radius:11px;padding:0 13px}
.jb-field .icon{width:16px;height:16px;color:#8FA1B8;flex:0 0 auto}
.jb-field input,.jb-field select{flex:1;background:transparent;border:0;color:#EAF0F7;font-size:.95rem;padding:13px 0;outline:none;width:100%}
.jb-field select{appearance:none;cursor:pointer}
.jb-field select option{background:#0C1220;color:#EAF0F7}
.jb-search .btn{padding:13px 24px}
.jb-quick{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px;align-items:center}
.jb-quick span{font-size:.74rem;color:#7E90A8;letter-spacing:.06em;text-transform:uppercase}
.jb-quick a{font-size:.8rem;color:#C9D5E3;border:1px solid rgba(255,255,255,.14);border-radius:999px;padding:5px 12px;text-decoration:none}
.jb-quick a:hover{border-color:var(--amber-500,#E87A1E);color:#fff}

.jb-wrap{display:grid;grid-template-columns:1fr;gap:22px;align-items:start}
@media(min-width:1000px){.jb-wrap{grid-template-columns:262px 1fr}}
.jb-side{position:sticky;top:84px;background:var(--card-bg,#0E1729);border:1px solid var(--card-line,rgba(255,255,255,.09));border-radius:14px;padding:16px;max-height:calc(100vh - 110px);overflow:auto}
@media(max-width:999px){.jb-side{position:static;max-height:none;display:none}.jb-side.open{display:block}}
.jb-side h4{font-size:.7rem;letter-spacing:.13em;text-transform:uppercase;color:#FFB262;margin:16px 0 8px}
.jb-side h4:first-of-type{margin-top:0}
.jb-side .check{display:flex;align-items:center;gap:9px;padding:5px 0;font-size:.85rem;color:#C9D5E3;cursor:pointer}
.jb-side .check input{accent-color:#E87A1E;width:15px;height:15px}
.jb-side .cnt{margin-left:auto;font-size:.72rem;color:#7E90A8}
.jb-side__head{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px}
.jb-reset{background:none;border:0;color:#FFB262;font-size:.76rem;font-weight:700;cursor:pointer}
.jb-toolbar{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:14px}
.jb-toolbar .res{font-size:.9rem;color:#C9D5E3}
.jb-toolbar .res b{color:#fff}
.jb-sel{margin-left:auto;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.14);color:#EAF0F7;border-radius:9px;padding:9px 12px;font-size:.83rem;cursor:pointer}
.jb-sel option{background:#0C1220}
.jb-filtersbtn{display:none;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.14);color:#EAF0F7;border-radius:9px;padding:9px 14px;font-size:.83rem;font-weight:700;cursor:pointer}
@media(max-width:999px){.jb-filtersbtn{display:inline-flex;gap:7px;align-items:center}}

.jb-row{display:grid;grid-template-columns:44px 1fr auto;gap:13px;align-items:start;background:var(--card-bg,#0E1729);border:1px solid var(--card-line,rgba(255,255,255,.09));border-radius:12px;padding:14px;margin-bottom:9px;transition:border-color .18s,transform .18s}
.jb-row:hover{border-color:rgba(232,122,30,.5);transform:translateY(-1px)}
.jb-row__logo{width:44px;height:44px;border-radius:10px;display:grid;place-items:center;font-weight:800;font-size:.82rem;color:#fff;background:var(--tile,#2C3E57)}
.jb-row__t{font-size:1rem;font-weight:700;margin:0 0 2px}
.jb-row__t a{color:#F2F6FB;text-decoration:none}
.jb-row__t a:hover{color:#FFB262}
.jb-row__co{font-size:.82rem;color:#93A5BB;margin-bottom:7px}
.jb-row__meta{display:flex;gap:12px;flex-wrap:wrap;font-size:.78rem;color:#8FA1B8;margin-bottom:8px}
.jb-row__meta .icon{width:13px;height:13px;margin-right:4px;vertical-align:-2px}
.jb-row__tags{display:flex;gap:6px;flex-wrap:wrap}
.jb-tag{font-size:.68rem;font-weight:700;color:#C9D5E3;border:1px solid rgba(255,255,255,.14);border-radius:5px;padding:2px 7px}
.jb-tag--visa{color:#7ED0A6;border-color:rgba(126,208,166,.4)}
.jb-row__right{text-align:right;display:flex;flex-direction:column;align-items:flex-end;gap:6px;min-width:132px}
.jb-pay{font-family:var(--f-mono,monospace);font-size:.95rem;font-weight:700;color:#fff;white-space:nowrap}
.jb-pay small{display:block;font-size:.68rem;color:#8FA1B8;font-family:inherit;font-weight:500}
.jb-date{font-size:.72rem;color:#7E90A8}
.jb-new{font-size:.64rem;font-weight:800;color:#0B1322;background:#7ED0A6;padding:2px 7px;border-radius:4px;letter-spacing:.04em}
@media(max-width:620px){.jb-row{grid-template-columns:38px 1fr}.jb-row__right{grid-column:2;align-items:flex-start;text-align:left;min-width:0;flex-direction:row;justify-content:space-between;width:100%;margin-top:4px}}
.jb-pager{display:flex;gap:6px;justify-content:center;align-items:center;margin:22px 0 4px;flex-wrap:wrap}
.jb-pager button{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.14);color:#C9D5E3;min-width:38px;height:38px;border-radius:9px;font-weight:700;font-size:.85rem;cursor:pointer}
.jb-pager button.on{background:var(--amber-500,#E87A1E);border-color:var(--amber-500,#E87A1E);color:#fff}
.jb-pager button[disabled]{opacity:.35;cursor:default}
.jb-empty{text-align:center;padding:40px 20px;border:1px dashed rgba(255,255,255,.16);border-radius:14px;color:#8FA1B8}
.jb-empty h3{color:#EAF0F7;margin:8px 0}

/* ————— 24. OFFRES VITRINE ————— */
.jobs-grid{display:grid;grid-template-columns:1fr;gap:14px}
@media(min-width:720px){.jobs-grid{grid-template-columns:1fr 1fr}}
.jb-cta{display:flex;gap:18px;align-items:center;justify-content:space-between;flex-wrap:wrap;margin-top:22px;
  background:linear-gradient(100deg,rgba(232,122,30,.14),rgba(232,122,30,.03));border:1px solid rgba(232,122,30,.45);
  border-radius:16px;padding:20px 24px;text-decoration:none;transition:border-color .2s,transform .2s}
.jb-cta:hover{border-color:var(--amber-500,#E87A1E);transform:translateY(-2px)}
.jb-cta b{display:block;font-size:1.12rem;color:var(--ink-900,#0C1220);margin-bottom:4px;font-weight:800}
.jb-cta span{font-size:.88rem;color:var(--muted)}
.jb-cta__go{display:inline-flex;align-items:center;gap:9px;font-weight:800;font-size:.92rem;color:#fff;
  background:var(--amber-500,#E87A1E);padding:12px 20px;border-radius:10px;white-space:nowrap}

/* ===== bloc suivant ===== */

/* ============================================================
   IKOS — Styles de pages & sections
   ============================================================ */

/* ————— HERO ACCUEIL ————— */
.hero-home{
  position:relative; background:var(--ink-950); color:#EDF2F9; overflow:hidden;
  padding:172px 0 0;
}
.hero-home .container{ position:relative; z-index:2; }
.hero-home__grid{ display:grid; grid-template-columns:1.05fr .95fr; gap:48px; align-items:center; }
.hero-home .display{ color:#F4F7FB; margin-bottom:22px; max-width:14ch; }
.hero-home .lead{ color:#A7B6C9; max-width:52ch; margin-bottom:34px; }
.hero-home .eyebrow{ color:#8DA0B8; }
.hero-glow{
  position:absolute; z-index:0; width:900px; height:900px; border-radius:50%;
  right:-260px; top:-330px; pointer-events:none;
  background:radial-gradient(circle,rgba(232,122,30,.17) 0%,rgba(232,122,30,.05) 38%,transparent 65%);
}
.hero-visual{ position:relative; height:560px; }
.hero-visual__map{ position:absolute; inset:0; display:grid; place-items:center; }
.hero-visual__map svg{ width:104%; max-width:none; height:auto; opacity:.96;
  filter:drop-shadow(0 30px 60px rgba(0,0,0,.45)); }
.float-card{
  position:absolute; z-index:3; display:flex; gap:12px; align-items:center;
  background:rgba(14,21,34,.86); border:1px solid rgba(255,255,255,.12);
  -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px);
  border-radius:14px; padding:14px 18px; box-shadow:0 18px 50px -12px rgba(0,0,0,.55);
  animation:floaty 7s ease-in-out infinite;
}
.float-card b{ display:block; font-size:.9rem; letter-spacing:-.01em; }
.float-card span{ display:block; font-size:.74rem; color:#93A5BB; margin-top:1px; }
.float-card .mono{ color:var(--amber-300); font-size:.82rem; }
.float-card--a{ top:52px; left:-10px; }
.float-card--b{ bottom:120px; right:-6px; animation-delay:-3.5s; }
.float-card--c{ bottom:-6px; left:12%; animation-delay:-1.8s; }
@keyframes floaty{ 0%,100%{ transform:translateY(0);} 50%{ transform:translateY(-12px);} }

.searchbar{
  display:grid; grid-template-columns:1.15fr 1fr auto; gap:8px;
  background:#fff; border-radius:14px; padding:9px;
  box-shadow:0 24px 70px -18px rgba(0,0,0,.55);
}
.searchbar .sfield{ position:relative; display:flex; align-items:center; }
.searchbar .sfield > .icon{
  position:absolute; left:15px; width:17px; height:17px; color:var(--ink-400); pointer-events:none;
}
.searchbar .sfield + .sfield{ border-left:1px solid var(--ink-100); }
.searchbar select{
  width:100%; border:0; background:transparent; font:530 .95rem var(--f-body);
  color:var(--ink-800); padding:14px 30px 14px 44px; appearance:none; cursor:pointer;
  border-radius:9px;
}
.searchbar select:focus{ outline:none; background:var(--ink-50); }
.searchbar .sfield::after{
  content:""; position:absolute; right:12px; width:8px; height:8px;
  border-right:1.6px solid var(--ink-400); border-bottom:1.6px solid var(--ink-400);
  transform:rotate(45deg) translateY(-3px); pointer-events:none;
}
.searchbar .btn{ border-radius:9px; }
.hero-quick{ display:flex; flex-wrap:wrap; gap:8px 10px; align-items:center; margin-top:18px; }
.hero-quick .mono-label{ color:#7C8FA6; margin-right:4px; }
.hero-quick a{
  font-size:.82rem; padding:6px 12px; border-radius:99px;
  border:1px solid rgba(255,255,255,.16); color:#C3D0DF; transition:.2s;
}
.hero-quick a:hover{ border-color:var(--amber-400); color:var(--amber-300); }

.hero-stats{
  position:relative; z-index:2; margin-top:76px;
  border-top:1px solid rgba(255,255,255,.1);
}
.hero-stats__grid{
  display:grid; grid-template-columns:repeat(4,1fr); gap:32px; padding:36px 0 42px;
}
.hero-stats .stat{ border-color:rgba(232,122,30,.85); }
.hero-stats .stat__value{ color:#F4F7FB; }
.hero-stats .stat__label{ color:#8398AF; }

/* Coordonnées décoratives */
.coords{
  position:absolute; z-index:2; font-family:var(--f-mono); font-size:.64rem;
  letter-spacing:.16em; color:rgba(255,255,255,.32); text-transform:uppercase;
  writing-mode:vertical-rl; right:26px; top:190px; display:flex; gap:18px;
}
@media (max-width:1250px){ .coords{ display:none; } }

/* ————— BANDE PARTENAIRES ————— */
.partners-band{ padding:34px 0; border-bottom:1px solid var(--line); }
.partners-band .mono-label{ text-align:center; display:block; margin-bottom:20px; }

/* ————— SECTEURS ————— */
.sector-card{ display:flex; flex-direction:column; gap:18px; position:relative; min-height:210px; }
.sector-card:hover .icon-tile{ background:var(--amber-500); color:var(--ink-950); transform:translateY(-3px); }
.sector-card h3{ margin:0; font-size:1.12rem; }
.sector-card h3 a::after{ content:""; position:absolute; inset:0; }
.sector-card p{ font-size:.88rem; color:var(--muted); margin:0; }
.sector-card__foot{
  margin-top:auto; display:flex; align-items:center; justify-content:space-between;
  padding-top:6px;
}
.sector-card__count{ font-family:var(--f-mono); font-size:.76rem; color:var(--muted); }
.sector-card__count b{ color:var(--amber-600); font-weight:600; }
.sector-card__foot .icon{ width:17px; height:17px; color:var(--ink-300); transition:.25s var(--ease); }
.sector-card:hover .sector-card__foot .icon{ color:var(--amber-600); transform:translate(3px,-3px); }

/* ————— ÉTAPES ————— */
.steps{ display:grid; grid-template-columns:repeat(4,1fr); gap:28px; counter-reset:step; }
.step{ position:relative; padding-top:22px; }
.step::before{
  content:""; position:absolute; top:0; left:0; right:-28px; height:1px;
  background:var(--line);
}
.step:last-child::before{ right:0; }
.step::after{
  content:""; position:absolute; top:-4px; left:0; width:9px; height:9px;
  border-radius:50%; background:var(--amber-500);
  box-shadow:0 0 0 5px color-mix(in srgb,var(--amber-500) 18%,transparent);
}
.step__num{
  font-family:var(--f-mono); font-size:.72rem; letter-spacing:.2em; color:var(--amber-600);
  margin-bottom:12px; display:block;
}
.theme-dark .step__num,.theme-deep .step__num{ color:var(--amber-300); }
.step h3{ font-size:1.08rem; margin-bottom:8px; }
.step p{ font-size:.9rem; color:var(--muted); margin:0; }

/* ————— BANDE AGENTS (accueil) ————— */
.agents-band{ position:relative; overflow:hidden; }
.agents-band__grid{ display:grid; grid-template-columns:1fr 1fr; gap:64px; align-items:center; }
.agent-pill{
  display:flex; align-items:center; gap:14px; padding:15px 18px;
  background:var(--card-bg); border:1px solid var(--card-line); border-radius:13px;
  transition:.3s var(--ease);
}
.agent-pill:hover{ transform:translateX(6px); border-color:rgba(255,255,255,.24); }
.agent-pill b{ font-size:.95rem; display:flex; gap:10px; align-items:baseline; }
.agent-pill b .mono{ font-size:.68rem; color:var(--amber-300); letter-spacing:.12em; }
.agent-pill span{ display:block; font-size:.8rem; color:var(--muted); margin-top:1px; }
.agent-pill .icon-tile{ width:44px; height:44px; border-radius:11px; }
.agents-band__list{ display:flex; flex-direction:column; gap:12px; }

/* ————— NEWSLETTER ————— */
.newsletter{
  border-radius:22px; background:var(--ink-900); color:#EDF2F9; overflow:hidden;
  position:relative; padding:56px; display:grid; grid-template-columns:1.2fr 1fr;
  gap:48px; align-items:center;
}
.newsletter h2{ color:#F4F7FB; margin-bottom:10px; }
.newsletter p{ color:#9CADC2; margin:0; max-width:44ch; }
.newsletter form{ display:flex; gap:8px; background:#fff; padding:7px; border-radius:12px; }
.newsletter .input{ border:0; box-shadow:none !important; background:transparent; }
.newsletter .form-note{ color:#7C8FA6; margin-top:12px; font-size:.78rem; }
.newsletter::before{
  content:""; position:absolute; inset:0;
  background-image:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);
  background-size:42px 42px; pointer-events:none;
}
.newsletter > *{ position:relative; }

/* ————— HERO PAGES INTERNES ————— */
.page-hero{ padding:158px 0 64px; background:var(--bg); color:var(--fg); position:relative; }
.page-hero .breadcrumbs{ margin-bottom:26px; }
.page-hero h1{ margin-bottom:16px; max-width:20ch; }
.page-hero .lead{ max-width:58ch; }
.page-hero__meta{ display:flex; flex-wrap:wrap; gap:10px; margin-top:24px; }
.page-hero--dark{ background:var(--ink-950); color:#EDF2F9; }
.page-hero--dark h1{ color:#F4F7FB; }
.page-hero--dark .lead{ color:#A7B6C9; }
.page-hero--center{ text-align:center; }
.page-hero--center h1,.page-hero--center .lead{ margin-inline:auto; }
.page-hero--center .breadcrumbs{ justify-content:center; }

/* ————— PAGE OFFRES ————— */
.jobs-layout{ display:grid; grid-template-columns:290px 1fr; gap:40px; align-items:start; }
.filters{ position:sticky; top:100px; display:flex; flex-direction:column; gap:26px; }
.filters__head{ display:flex; justify-content:space-between; align-items:center; }
.filters__head h3{ font-size:1rem; margin:0; display:flex; gap:9px; align-items:center; }
.filters__reset{ font-size:.8rem; color:var(--amber-600); font-weight:600; }
.fgroup{ border-top:1px solid var(--line); padding-top:20px; display:flex; flex-direction:column; gap:11px; }
.fgroup > h4{
  margin:0 0 4px; font-family:var(--f-mono); font-size:.68rem; font-weight:500;
  letter-spacing:.16em; text-transform:uppercase; color:var(--muted);
}
.fgroup .check{ font-size:.9rem; }
.fgroup .count{ margin-left:auto; font-family:var(--f-mono); font-size:.72rem; color:var(--ink-400); }
.range-out{ display:flex; justify-content:space-between; font-family:var(--f-mono); font-size:.78rem; color:var(--muted); }
.results-head{
  display:flex; align-items:center; gap:18px; margin-bottom:22px; flex-wrap:wrap;
}
.results-head p{ margin:0; font-size:.93rem; color:var(--muted); }
.results-head p b{ color:var(--fg); font-weight:650; }
.results-head .select-wrap{ margin-left:auto; }
.results-head .select{ padding:10px 38px 10px 14px; font-size:.88rem; width:auto; }
.jobs-list{ display:grid; grid-template-columns:1fr 1fr; gap:20px; }
.filters-toggle{ display:none; }
.empty-state{
  grid-column:1/-1; text-align:center; padding:80px 24px;
  border:1px dashed var(--line); border-radius:var(--r-lg); color:var(--muted);
}
.empty-state .icon{ width:38px; height:38px; margin:0 auto 16px; color:var(--ink-300); }
.empty-state h3{ font-size:1.15rem; margin-bottom:6px; }
.empty-state p{ max-width:40ch; margin:0 auto 20px; font-size:.92rem; }

/* ————— DÉTAIL OFFRE ————— */
.job-head{ padding:150px 0 44px; background:var(--white); border-bottom:1px solid var(--line); }
.job-head .breadcrumbs{ margin-bottom:30px; }
.job-head__main{ display:flex; gap:22px; align-items:flex-start; }
.job-head__main h1{ font-size:clamp(1.7rem,1.2rem+1.9vw,2.5rem); margin:2px 0 10px; }
.job-head__company{ display:flex; flex-wrap:wrap; gap:6px 18px; color:var(--muted); font-size:.95rem; align-items:center; }
.job-head__company .dot{ width:3px; height:3px; border-radius:50%; background:var(--ink-300); }
.job-head__tags{ display:flex; flex-wrap:wrap; gap:8px; margin-top:18px; }
.job-detail-layout{ display:grid; grid-template-columns:1fr 360px; gap:56px; align-items:start; }
.job-body h2{
  font-size:1.28rem; margin:44px 0 16px; display:flex; align-items:baseline; gap:14px;
}
.job-body h2:first-child{ margin-top:0; }
.job-body h2 .idx{ font:500 .7rem var(--f-mono); color:var(--amber-600); letter-spacing:.15em; }
.job-body p{ color:#41536B; line-height:1.75; }
.list-check{ display:flex; flex-direction:column; gap:11px; margin:14px 0; }
.list-check li{ display:flex; gap:12px; font-size:.97rem; line-height:1.6; color:#41536B; }
.list-check .icon{ width:17px; height:17px; color:var(--euca-600); flex:none; margin-top:4px; }
.list-check--amber .icon{ color:var(--amber-600); }
.job-aside{ position:sticky; top:100px; display:flex; flex-direction:column; gap:20px; }
.apply-card .salary{
  font-family:var(--f-mono); font-size:1.28rem; font-weight:600; margin-bottom:2px;
}
.apply-card .salary-sub{ font-size:.8rem; color:var(--muted); margin-bottom:20px; }
.apply-card .btn{ margin-bottom:10px; }
.apply-card__meta{ margin-top:16px; padding-top:16px; border-top:1px solid var(--card-line);
  display:flex; flex-direction:column; gap:10px; }
.apply-card__meta li{ display:flex; justify-content:space-between; gap:16px; font-size:.86rem; }
.apply-card__meta li span{ color:var(--muted); }
.apply-card__meta li b{ font-weight:600; text-align:right; }
.mini-job{ display:flex; gap:12px; padding:13px 0; border-top:1px solid var(--card-line); position:relative; }
.mini-job:first-of-type{ border-top:0; padding-top:0; }
.mini-job b{ font-size:.89rem; display:block; line-height:1.35; }
.mini-job b a::after{ content:""; position:absolute; inset:0; }
.mini-job span{ font-size:.77rem; color:var(--muted); }
.mini-job .logo-tile{ width:38px; height:38px; border-radius:9px; font-size:.75rem; }

/* ————— CARTE INTERACTIVE ————— */
.map-layout{ display:grid; grid-template-columns:1.25fr .9fr; gap:52px; align-items:start; }
.map-stage{ position:sticky; top:96px; }
.map-stage svg{ width:100%; height:auto; }
.map-stage .st{
  fill:#152134; stroke:#31435C; stroke-width:1.1; cursor:pointer;
  transition:fill .25s;
}
.map-stage .st:hover{ fill:#1D2E45; }
.map-stage .st.is-on{ fill:rgba(232,122,30,.3); stroke:var(--amber-500); }
.map-stage .st-label{
  font:500 11px var(--f-mono); letter-spacing:.14em; fill:#7C8FA6; pointer-events:none;
}
.map-stage .city-dot{ fill:#C9D5E3; pointer-events:none; }
.map-stage .city-lb{ font:500 10.5px var(--f-mono); letter-spacing:.08em; fill:#93A5BB; pointer-events:none; }
.map-hotspot{ pointer-events:none; }
.map-hotspot circle.core{ fill:var(--amber-500); }
.map-hotspot circle.pulse{ fill:none; stroke:var(--amber-500); opacity:.7;
  animation:pulse 2.6s ease-out infinite; transform-origin:center; transform-box:fill-box; }
@keyframes pulse{ 0%{ transform:scale(.4); opacity:.8;} 100%{ transform:scale(2.6); opacity:0;} }
.map-legend{ display:flex; gap:22px; margin-top:18px; flex-wrap:wrap; }
.map-legend span{ display:flex; align-items:center; gap:8px; font-family:var(--f-mono);
  font-size:.7rem; letter-spacing:.1em; text-transform:uppercase; color:#8398AF; }
.map-legend i{ width:10px; height:10px; border-radius:50%; }
.map-panel{ display:flex; flex-direction:column; gap:22px; }
.map-panel__head h2{ margin:0 0 4px; font-size:1.7rem; }
.map-panel__head .mono-label{ color:var(--amber-300); }
.map-panel__stats{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
.map-stat{ background:var(--card-bg); border:1px solid var(--card-line); border-radius:12px; padding:16px; }
.map-stat b{ font-family:var(--f-mono); font-size:1.15rem; font-weight:600; display:block; }
.map-stat span{ font-size:.72rem; color:var(--muted); display:block; margin-top:3px; line-height:1.4; }
.map-panel h3{ font-size:.95rem; margin:6px 0 0; display:flex; gap:10px; align-items:center; color:var(--fg); }
.map-panel h3 .icon{ width:16px; height:16px; color:var(--amber-300); }
.hotspot-line{ display:flex; gap:13px; padding:12px 0; border-bottom:1px solid var(--line); font-size:.9rem; }
.hotspot-line:last-child{ border-bottom:0; }
.hotspot-line .n{ font-family:var(--f-mono); font-size:.7rem; color:var(--amber-300); margin-top:3px; }
.hotspot-line b{ display:block; font-size:.92rem; }
.hotspot-line span{ color:var(--muted); font-size:.82rem; }

/* Variantes décoratives de la carte d'Australie */
.aus .st{ transition:fill .25s; }
.aus--dark .st{ fill:#131E30; stroke:#31445E; stroke-width:1.1; }
.aus--dark .city-dot{ fill:#7E92AA; }
.aus--light .st{ fill:#101A2B; stroke:#2B3A50; stroke-width:1.1; }
.aus--light .city-dot{ fill:#5E7191; }

/* Bar list — salaires médians (série unique, surbrillance sélection) */
.barlist{ display:flex; flex-direction:column; gap:12px; }
.barlist__row{ display:grid; grid-template-columns:44px 1fr 76px; gap:14px; align-items:center; }
.barlist__row .lb{ font-family:var(--f-mono); font-size:.74rem; letter-spacing:.08em; color:var(--muted); }
.barlist__row .val{ font-family:var(--f-mono); font-size:.78rem; color:var(--fg);
  text-align:right; font-variant-numeric:tabular-nums; }
.barlist__track{ position:relative; height:18px; }
.barlist__bar{
  position:absolute; inset:0 auto 0 0; width:var(--w,50%);
  background:#697D95; border-radius:0 4px 4px 0; transition:width .8s var(--ease), background .3s;
}
.barlist__row.is-on .barlist__bar{ background:var(--amber-500); }
.barlist__row.is-on .lb,.barlist__row.is-on .val{ color:#F4F7FB; }

/* ————— GUIDES ————— */
.guide-feat{
  display:grid; grid-template-columns:1.1fr .9fr; border-radius:20px; overflow:hidden;
  background:var(--ink-900); color:#EDF2F9; border:1px solid var(--ink-800);
}
.guide-feat__body{ padding:52px; display:flex; flex-direction:column; align-items:flex-start; gap:18px; }
.guide-feat__body h2{ color:#F4F7FB; margin:0; font-size:clamp(1.5rem,1.1rem+1.6vw,2.2rem); max-width:18ch; }
.guide-feat__body p{ color:#9CADC2; margin:0; max-width:48ch; }
.guide-feat__visual{
  position:relative; min-height:340px;
  background:linear-gradient(135deg,#16233A 0%,#0C1424 100%);
  display:grid; place-items:center; overflow:hidden;
}
.guide-feat__visual::before{
  content:""; position:absolute; inset:0;
  background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),
   linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);
  background-size:38px 38px;
}
.guide-feat__visual .icon{ width:120px; height:120px; stroke-width:.9; color:var(--amber-500); opacity:.85; }
.guide-card{ display:flex; flex-direction:column; gap:14px; position:relative; min-height:230px; }
.guide-card__cat{ display:flex; justify-content:space-between; align-items:center; }
.guide-card h3{ font-size:1.12rem; margin:0; line-height:1.35; }
.guide-card h3 a::after{ content:""; position:absolute; inset:0; }
.guide-card p{ font-size:.9rem; color:var(--muted); margin:0; }
.guide-card__foot{
  margin-top:auto; display:flex; align-items:center; gap:8px; padding-top:14px;
  border-top:1px solid var(--card-line); font-family:var(--f-mono); font-size:.72rem;
  color:var(--muted); letter-spacing:.06em;
}
.guide-card__foot .icon{ width:14px; height:14px; }
.guide-card__foot .go{ margin-left:auto; color:var(--amber-600); display:flex; gap:5px; align-items:center;
  font-family:var(--f-body); font-weight:600; font-size:.85rem; letter-spacing:0; }
.roadmap-item{ display:flex; gap:18px; padding:18px 0; border-bottom:1px solid var(--line); align-items:baseline; }
.roadmap-item:last-child{ border-bottom:0; }
.roadmap-item .date{ font-family:var(--f-mono); font-size:.72rem; color:var(--amber-600);
  letter-spacing:.1em; text-transform:uppercase; flex:none; width:92px; }
.roadmap-item b{ font-weight:620; font-size:.98rem; }
.roadmap-item span{ color:var(--muted); font-size:.86rem; display:block; margin-top:2px; }

/* ————— ARTICLE ————— */
.progress-bar{
  position:fixed; top:0; left:0; height:3px; width:0%; z-index:130;
  background:var(--amber-500); transition:width .1s linear;
}
.article-hero{ padding:158px 0 46px; background:var(--white); border-bottom:1px solid var(--line); }
.article-hero .badge{ margin-bottom:18px; }
.article-hero h1{ max-width:24ch; font-size:clamp(1.9rem,1.3rem+2.3vw,3rem); }
.article-hero__meta{
  display:flex; flex-wrap:wrap; gap:8px 22px; margin-top:22px; align-items:center;
  font-size:.85rem; color:var(--muted);
}
.article-hero__meta span{ display:flex; gap:7px; align-items:center; }
.article-hero__meta .icon{ width:15px; height:15px; }
.article-layout{ display:grid; grid-template-columns:minmax(0,720px) 260px; gap:72px; justify-content:center; }
.toc{ position:sticky; top:110px; font-size:.87rem; }
.toc h4{ font-family:var(--f-mono); font-size:.66rem; letter-spacing:.18em; text-transform:uppercase;
  color:var(--muted); margin:0 0 14px; }
.toc ol{ display:flex; flex-direction:column; border-left:1px solid var(--line); }
.toc a{ display:block; padding:7px 0 7px 16px; color:var(--muted); border-left:2px solid transparent;
  margin-left:-1.5px; line-height:1.45; transition:.2s; }
.toc a:hover{ color:var(--fg); }
.toc a.is-on{ color:var(--amber-700); border-left-color:var(--amber-500); font-weight:560; }
.toc .toc-cta{ margin-top:22px; padding:16px; background:var(--paper-2); border-radius:12px; font-size:.82rem; }
.toc .toc-cta b{ display:block; margin-bottom:4px; }
.toc .toc-cta a{ padding:0; border:0; margin:8px 0 0; color:var(--amber-700); font-weight:600; display:inline-flex; gap:6px; }

.prose{ font-size:1.04rem; line-height:1.8; color:#33445C; }
.prose > p:first-of-type{ font-size:1.18rem; color:var(--ink-700); line-height:1.75; }
.prose h2{
  font-size:1.55rem; margin:2.2em 0 .7em; scroll-margin-top:110px;
  display:flex; align-items:baseline; gap:14px;
}
.prose h2 .idx{ font:500 .72rem var(--f-mono); color:var(--amber-600); letter-spacing:.14em; flex:none; }
.prose h3{ font-size:1.18rem; margin:1.8em 0 .5em; }
.prose ul,.prose ol{ margin:0 0 1.2em; padding-left:2px; display:flex; flex-direction:column; gap:9px; }
.prose ul li{ position:relative; padding-left:26px; }
.prose ul li::before{
  content:""; position:absolute; left:2px; top:.62em; width:12px; height:2px; background:var(--amber-500);
}
.prose ol{ counter-reset:oli; }
.prose ol li{ position:relative; padding-left:38px; counter-increment:oli; }
.prose ol li::before{
  content:counter(oli,decimal-leading-zero); position:absolute; left:0; top:.18em;
  font:600 .74rem var(--f-mono); color:var(--amber-600); letter-spacing:.05em;
}
.prose .callout{ margin:1.6em 0; }
.prose .table-wrap{ margin:1.6em 0; }
.prose blockquote{
  margin:1.8em 0; padding:6px 0 6px 26px; border-left:3px solid var(--amber-500);
  font-size:1.15rem; line-height:1.65; color:var(--ink-800); font-weight:500;
}
.prose hr{ border:0; height:1px; background:var(--line); margin:2.4em 0; }
.article-foot{
  margin-top:56px; padding-top:28px; border-top:1px solid var(--line);
  display:flex; justify-content:space-between; gap:24px; flex-wrap:wrap; align-items:center;
}
.author-chip{ display:flex; gap:13px; align-items:center; }
.author-chip b{ display:block; font-size:.92rem; }
.author-chip span{ font-size:.79rem; color:var(--muted); }

/* ————— FORMATIONS ————— */
.cert-card{ display:flex; flex-direction:column; gap:16px; position:relative; }
.cert-card__top{ display:flex; align-items:flex-start; gap:16px; }
.cert-card__top .badge{ margin-left:auto; }
.cert-card h3{ font-size:1.08rem; margin:0; }
.cert-card .code{ font-family:var(--f-mono); font-size:.7rem; color:var(--muted); letter-spacing:.08em; }
.cert-card p{ font-size:.89rem; color:var(--muted); margin:0; }
.cert-card__specs{
  display:grid; grid-template-columns:1fr 1fr 1fr; gap:10px; margin-top:auto;
  border-top:1px solid var(--card-line); padding-top:15px;
}
.cert-card__specs div span{ display:block; font-family:var(--f-mono); font-size:.62rem;
  letter-spacing:.12em; text-transform:uppercase; color:var(--ink-400); margin-bottom:3px; }
.cert-card__specs div b{ font-size:.86rem; font-weight:620; }
.pathway{ position:relative; padding-left:34px; display:flex; flex-direction:column; gap:26px; }
.pathway::before{ content:""; position:absolute; left:8px; top:8px; bottom:8px; width:2px;
  background:repeating-linear-gradient(var(--ink-300) 0 6px,transparent 6px 12px); }
.pathway-step{ position:relative; }
.pathway-step::before{
  content:""; position:absolute; left:-32px; top:4px; width:14px; height:14px; border-radius:50%;
  background:var(--bg); border:3px solid var(--amber-500);
}
.pathway-step b{ display:flex; gap:12px; align-items:baseline; font-size:1.02rem; }
.pathway-step b .mono{ font-size:.68rem; color:var(--amber-600); letter-spacing:.12em; }
.pathway-step p{ color:var(--muted); font-size:.9rem; margin:4px 0 0; max-width:52ch; }
.pathway-step .badge{ margin-top:8px; }

/* ————— AGENTS IA ————— */
.agent-card{
  position:relative; display:flex; flex-direction:column; gap:16px; overflow:hidden;
  background:linear-gradient(160deg,#131E31 0%,#0D1524 100%);
  border:1px solid rgba(255,255,255,.1);
}
.agent-card:hover{ border-color:rgba(232,122,30,.45); }
.agent-card::before{
  content:""; position:absolute; top:-70px; right:-70px; width:190px; height:190px;
  border-radius:50%; background:radial-gradient(circle,rgba(232,122,30,.16),transparent 70%);
}
.agent-card__name{ display:flex; align-items:center; gap:14px; }
.agent-card__name h3{ margin:0; font-size:1.2rem; letter-spacing:.05em; }
.agent-card__name .mono-label{ color:var(--amber-300); }
.agent-card > p{ color:#9CADC2; font-size:.92rem; margin:0; }
.agent-card__caps{ display:flex; flex-direction:column; gap:9px; margin-top:auto; }
.agent-card__caps li{ display:flex; gap:10px; font-size:.85rem; color:#C3D0DF; align-items:flex-start; }
.agent-card__caps .icon{ width:14px; height:14px; color:var(--amber-400); margin-top:4px; }
.agent-card__status{
  display:inline-flex; align-items:center; gap:7px; font-family:var(--f-mono);
  font-size:.64rem; letter-spacing:.14em; text-transform:uppercase; color:#7FD1A9;
}
.agent-card__status i{ width:7px; height:7px; border-radius:50%; background:#4ADE80;
  box-shadow:0 0 8px rgba(74,222,128,.8); animation:blink 2.2s infinite; }
@keyframes blink{ 0%,100%{opacity:1;} 50%{opacity:.35;} }

/* Démo chat */
.chat-demo{
  border-radius:20px; overflow:hidden; border:1px solid rgba(255,255,255,.12);
  background:#0D1524; box-shadow:0 40px 90px -30px rgba(0,0,0,.7);
}
.chat-demo__bar{
  display:flex; align-items:center; gap:12px; padding:15px 20px;
  background:rgba(255,255,255,.03); border-bottom:1px solid rgba(255,255,255,.09);
}
.chat-demo__bar .dots{ display:flex; gap:6px; }
.chat-demo__bar .dots i{ width:10px; height:10px; border-radius:50%; background:#2C3E57; }
.chat-demo__bar .title{ font-family:var(--f-mono); font-size:.72rem; letter-spacing:.14em;
  color:#8398AF; text-transform:uppercase; margin:0 auto; display:flex; gap:8px; align-items:center; }
.chat-demo__bar .title .icon{ width:14px; height:14px; color:var(--amber-400); }
.chat-thread{ padding:26px 24px; display:flex; flex-direction:column; gap:14px; min-height:380px; }
.msg{ max-width:78%; padding:13px 17px; border-radius:14px; font-size:.93rem; line-height:1.6;
  animation:fadeUp .45s var(--ease); }
.msg--bot{ align-self:flex-start; background:rgba(255,255,255,.06); color:#DAE3EE;
  border:1px solid rgba(255,255,255,.08); border-bottom-left-radius:4px; }
.msg--user{ align-self:flex-end; background:var(--amber-500); color:var(--ink-950);
  border-bottom-right-radius:4px; font-weight:530; }
.msg--bot b{ color:#fff; }
.msg--bot .mono{ color:var(--amber-300); font-size:.84rem; }
.msg-typing{ display:inline-flex; gap:5px; padding:16px 18px; }
.msg-typing i{ width:7px; height:7px; border-radius:50%; background:#8398AF; animation:tp 1.1s infinite; }
.msg-typing i:nth-child(2){ animation-delay:.18s; } .msg-typing i:nth-child(3){ animation-delay:.36s; }
@keyframes tp{ 0%,100%{ opacity:.25; transform:translateY(0);} 50%{ opacity:1; transform:translateY(-3px);} }
.chat-replies{ display:flex; flex-wrap:wrap; gap:9px; padding:0 24px 22px; }
.chat-replies button{
  padding:9px 15px; border-radius:99px; border:1px solid rgba(255,255,255,.2);
  color:#DAE3EE; font-size:.85rem; transition:.2s;
}
.chat-replies button:hover{ border-color:var(--amber-400); color:var(--amber-300); }
.chat-replies button:disabled{ opacity:.35; }
.chat-input{
  display:flex; gap:12px; align-items:center; padding:14px 20px;
  border-top:1px solid rgba(255,255,255,.09); color:#5E7191;
  font-size:.9rem;
}
.chat-input .icon{ margin-left:auto; color:#5E7191; }
.agents-hero-orbit{ position:absolute; inset:0; pointer-events:none; overflow:hidden; }
.agents-hero-orbit i{
  position:absolute; border-radius:50%; border:1px dashed rgba(255,255,255,.09);
}

/* ————— FAQ ————— */
.faq-search{ max-width:560px; margin:30px auto 0; }
.faq-cats{ display:flex; gap:8px; flex-wrap:wrap; justify-content:center; margin-bottom:44px; }
.faq-group h3{
  font-size:.8rem; font-family:var(--f-mono); font-weight:500; letter-spacing:.18em;
  text-transform:uppercase; color:var(--amber-700); margin:40px 0 8px; display:flex; gap:10px; align-items:center;
}
.faq-group h3 .icon{ width:16px; height:16px; }
.faq-group:first-child h3{ margin-top:0; }
mark.hlt{ background:var(--amber-200); color:inherit; border-radius:2px; padding:0 1px; }

/* ————— CONTACT ————— */
.contact-layout{ display:grid; grid-template-columns:.85fr 1.15fr; gap:64px; align-items:start; }
.contact-info{ display:flex; flex-direction:column; gap:26px; }
.contact-line{ display:flex; gap:16px; align-items:flex-start; }
.contact-line b{ display:block; font-size:.98rem; margin-bottom:2px; }
.contact-line p{ margin:0; color:var(--muted); font-size:.9rem; line-height:1.6; }
.contact-line a{ color:var(--amber-700); font-weight:560; }
.clockrow{ display:flex; gap:14px; }
.clock{
  flex:1; background:var(--card-bg); border:1px solid var(--card-line); border-radius:13px;
  padding:16px 18px;
}
.clock b{ font-family:var(--f-mono); font-size:1.25rem; font-weight:600; display:block; }
.clock span{ font-family:var(--f-mono); font-size:.64rem; letter-spacing:.14em;
  text-transform:uppercase; color:var(--muted); }
.form-card{ padding:36px; }
.form-grid{ display:grid; grid-template-columns:1fr 1fr; gap:20px; }
.form-grid .field--full{ grid-column:1/-1; }
.form-success{ text-align:center; padding:60px 30px; display:none; }
.form-success .icon-tile{ margin:0 auto 20px; background:var(--euca-100); color:var(--euca-600); }
.form-success h3{ margin-bottom:8px; }
.form-success p{ color:var(--muted); max-width:38ch; margin:0 auto; }

/* ————— À PROPOS ————— */
.mission-quote{
  font-family:var(--f-display); font-stretch:106%; font-weight:640;
  font-size:clamp(1.5rem,1rem+2.1vw,2.5rem); line-height:1.3; letter-spacing:-.015em;
  max-width:26ch; margin:0;
}
.mission-quote em{ font-style:normal; color:var(--amber-500); }
.timeline{ position:relative; display:flex; flex-direction:column; gap:34px; padding-left:36px; }
.timeline::before{ content:""; position:absolute; left:9px; top:6px; bottom:6px; width:2px; background:var(--line); }
.tl-item{ position:relative; }
.tl-item::before{
  content:""; position:absolute; left:-33px; top:5px; width:12px; height:12px;
  border-radius:50%; background:var(--amber-500); box-shadow:0 0 0 4px var(--amber-100);
}
.tl-item .date{ font-family:var(--f-mono); font-size:.72rem; letter-spacing:.16em; color:var(--amber-700); }
.tl-item h3{ font-size:1.1rem; margin:6px 0 4px; }
.tl-item p{ color:var(--muted); font-size:.92rem; margin:0; max-width:52ch; }
.team-card{ text-align:center; padding:32px 22px; }
.team-card .avatar{ width:72px; height:72px; font-size:1.3rem; margin:0 auto 16px; }
.team-card b{ display:block; font-size:1rem; }
.team-card span{ font-size:.8rem; color:var(--muted); display:block; margin-top:2px; }
.team-card .mono-label{ display:block; margin-top:10px; font-size:.6rem; color:var(--amber-700); }
.value-card h3{ display:flex; gap:12px; align-items:center; font-size:1.05rem; }
.value-card p{ font-size:.9rem; color:var(--muted); margin:0; }

/* ————— AUTH ————— */
.auth-shell{ min-height:100vh; display:grid; grid-template-columns:1fr 1.1fr; background:var(--paper); }
.auth-side{
  position:relative; background:var(--ink-950); color:#EDF2F9; padding:48px 56px;
  display:flex; flex-direction:column; overflow:hidden;
}
.auth-side__quote{ margin:auto 0; position:relative; z-index:1; }
.auth-side__quote .display{ font-size:clamp(2rem,1.4rem+2vw,3.2rem); color:#F4F7FB; max-width:15ch; }
.auth-side__quote p{ color:#9CADC2; max-width:40ch; }
.auth-side__stats{ position:relative; z-index:1; display:flex; gap:36px; }
.auth-side__stats .stat__value{ color:#F4F7FB; font-size:1.7rem; }
.auth-main{ display:flex; align-items:center; justify-content:center; padding:48px 24px; }
.auth-box{ width:min(460px,100%); }
.auth-box .tabs{ margin-bottom:28px; }
.auth-social{ display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-bottom:8px; }
.auth-social .btn{ border:1px solid var(--line); background:#fff; font-weight:560; }
.auth-social .btn:hover{ border-color:var(--ink-400); }

/* ————— CTA FINAL ————— */
.cta-final{ text-align:center; position:relative; overflow:hidden; }
.cta-final h2{ font-size:clamp(2rem,1.3rem+2.8vw,3.4rem); color:#F4F7FB; max-width:18ch; margin:0 auto 18px; }
.cta-final p{ color:#9CADC2; max-width:48ch; margin:0 auto 34px; }
.cta-final__actions{ display:flex; gap:14px; justify-content:center; flex-wrap:wrap; }

/* ————— LEGAL ————— */
.legal-body h2{ font-size:1.3rem; margin:2.2em 0 .6em; }
.legal-body p,.legal-body li{ color:#41536B; font-size:.97rem; }
.legal-body ul{ list-style:disc; padding-left:22px; display:flex; flex-direction:column; gap:8px; margin-bottom:1.2em; }

/* ————— RESPONSIVE PAGES ————— */
@media (max-width:1150px){
  .hero-visual{ display:none; }
  .hero-home__grid{ grid-template-columns:1fr; }
  .hero-home .display{ max-width:17ch; }
  .article-layout{ grid-template-columns:minmax(0,1fr); gap:0; }
  .toc{ display:none; }
  .job-detail-layout{ grid-template-columns:1fr; }
  .job-aside{ position:static; }
  .map-layout{ grid-template-columns:1fr; }
  .map-stage{ position:static; }
}
@media (max-width:1000px){
  .jobs-layout{ grid-template-columns:1fr; }
  .filters{ position:fixed; inset:0; z-index:210; background:var(--paper); padding:24px;
    overflow:auto; transform:translateX(-104%); transition:transform .45s var(--ease); }
  .filters.open{ transform:none; }
  .filters-toggle{ display:inline-flex; }
  .filters__close{ display:inline-flex !important; }
  .agents-band__grid{ grid-template-columns:1fr; gap:40px; }
  .newsletter{ grid-template-columns:1fr; padding:40px 28px; gap:28px; }
  .guide-feat{ grid-template-columns:1fr; }
  .guide-feat__visual{ min-height:220px; order:-1; }
  .contact-layout{ grid-template-columns:1fr; gap:44px; }
  .auth-shell{ grid-template-columns:1fr; }
  .auth-side{ display:none; }
}
@media (max-width:760px){
  .searchbar{ grid-template-columns:1fr; }
  .searchbar .sfield + .sfield{ border-left:0; border-top:1px solid var(--ink-100); }
  .hero-stats__grid{ grid-template-columns:1fr 1fr; gap:24px; padding:28px 0 34px; }
  .hero-home{ padding-top:140px; }
  .steps{ grid-template-columns:1fr; gap:36px; }
  .step::before{ right:0; }
  .jobs-list{ grid-template-columns:1fr; }
  .map-panel__stats{ grid-template-columns:1fr 1fr; }
  .form-grid{ grid-template-columns:1fr; }
  .guide-feat__body{ padding:32px 26px; }
  .page-hero{ padding:134px 0 48px; }
  .article-hero,.job-head{ padding-top:128px; }
  .clockrow{ flex-direction:column; }
}


/* — Mode fichier unique (routeur interne) — */
.route-auth .site-header, .route-auth .site-footer, .route-auth .drawer{ display:none; }
.route-auth .auth-shell{ min-height:100vh; }

/* ===== IKOSwork — mot-symbole ===== */
.brand__name .brand__w{
  color: var(--amber-400);
  font-weight: 680;
  letter-spacing: .015em;
}

/* ===== Transition bandeau sombre → papier ===== */
/* Bas du bandeau : dégradé de profondeur, l'encre s'éclaircit vers la jonction */
.page-hero--dark::after{
  content:""; position:absolute; left:0; right:0; bottom:0; height:170px; z-index:0;
  pointer-events:none;
  background:linear-gradient(to bottom, rgba(7,11,18,0) 0%, #0E1828 100%);
}
/* Côté papier : jonction ambre assumée, puis le sable se lève vers le blanc cassé */
.page-hero--dark + .section:not(.theme-dark):not(.theme-deep){
  background:linear-gradient(to bottom, var(--paper-2) 0%, var(--paper) 170px);
  border-top:1px solid rgba(232,122,30,.42);
}

/* ===== Hero accueil — puces populaires sur une seule ligne ===== */
.hero-quick .mono-label{ flex:0 0 100%; margin:0 0 10px; }

/* ===== Carte — tuiles du panneau : plus d'orphelin étiré ===== */
.mapx-kpis{
  display:grid; grid-template-columns:repeat(auto-fit,minmax(88px,1fr));
}
/* 4 tuiles (vue Australie, États riches) → 2×2 équilibré plutôt que 3+1 */
.mapx-kpis:has(> :nth-child(4)){ grid-template-columns:repeat(2,1fr); }
.mapx-kpi{ min-width:0; }

/* ===== Carte — barre de filtres : puces groupées, recherche ancrée à droite ===== */
.mapx-search{
  order:2;                 /* passe après toutes les puces */
  flex:0 1 340px;          /* ne gonfle plus au détriment des puces */
  margin-left:auto;        /* se cale à droite de la ligne où elle tombe */
}
@media (max-width:860px){
  .mapx-search{ order:-1; flex:1 1 100%; margin-left:0; }
}

/* ===== Surlignage titre : une boîte par ligne, pas une boîte découpée ===== */
em.hl--under{
  -webkit-box-decoration-break:clone;
          box-decoration-break:clone;
}

/* ===== Hero clair → section : resserrer le vide (pas de rupture de couleur) ===== */
.page-hero:not(.page-hero--dark) + .section{ padding-top:24px; }

/* ===== Rangées de filtres : tenir sur une ligne (10 chips = 1218px pour 1200) ===== */
.chip-row{ gap:8px; }
.chip-row .chip{ padding:9px 14px; }

/* ===== Cartes formation : réserver 2 lignes au titre pour aligner le code ===== */
.cert-card h3{ min-height:2lh; }