/* SA Consulting — feuille de style partagée */
@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,400;0,9..144,500;0,9..144,600;0,9..144,700;1,9..144,500&family=IBM+Plex+Sans:wght@400;500;600;700&family=IBM+Plex+Mono:wght@400;500;600&display=swap');

:root{
  --bg:#F4F5F2;
  --surface:#FFFFFF;
  --surface-2:#EBEDE8;
  --ink:#10182A;
  --ink-soft:#4C5768;
  --line:#DFE2DB;
  --gold:#B8862E;
  --gold-strong:#8F691E;
  --gold-soft:#F6E8C8;
  --success:#2F7A55;
  --error:#B3432F;
  --focus:#10182A;
  --shadow: 0 1px 2px rgba(16,24,42,.05), 0 14px 32px rgba(16,24,42,.07);

  /* deliberately fixed dark surfaces (hero band, footer) — same in both themes */
  --footer-bg:#0E1526;
  --footer-text:#F4F2E9;
  --footer-text-soft:#A9B3C4;
  --footer-line:#283449;
  --footer-gold:#D9B46E;

  --hero-bg-1:#0E1526;
  --hero-bg-2:#1E2E52;
  --hero-text:#F6F3E9;
  --hero-text-soft:#B7C1D6;
  --hero-gold:#E0BA70;
  --hero-line:rgba(246,243,233,.16);

  --font-display:'Fraunces','Iowan Old Style','Georgia',serif;
  --font-body:'IBM Plex Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --font-mono:'IBM Plex Mono','SFMono-Regular',Consolas,monospace;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg:#0B111D;
    --surface:#121A2B;
    --surface-2:#17202F;
    --ink:#ECEEEA;
    --ink-soft:#9CA7B6;
    --line:#293446;
    --gold:#E3B868;
    --gold-strong:#F0CB84;
    --gold-soft:#2E2514;
    --success:#4FAE81;
    --error:#E0796A;
    --focus:#ECEEEA;
    --shadow: 0 1px 2px rgba(0,0,0,.45), 0 14px 32px rgba(0,0,0,.4);
  }
}
:root[data-theme="dark"]{
  --bg:#0B111D;
  --surface:#121A2B;
  --surface-2:#17202F;
  --ink:#ECEEEA;
  --ink-soft:#9CA7B6;
  --line:#293446;
  --gold:#E3B868;
  --gold-strong:#F0CB84;
  --gold-soft:#2E2514;
  --success:#4FAE81;
  --error:#E0796A;
  --focus:#ECEEEA;
  --shadow: 0 1px 2px rgba(0,0,0,.45), 0 14px 32px rgba(0,0,0,.4);
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font-family:var(--font-body);
  font-size:17px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%; display:block;}
a{color:inherit;}
::selection{ background:var(--gold-soft); color:var(--ink); }

h1,h2,h3{
  font-family:var(--font-display);
  font-weight:600;
  text-wrap:balance;
  line-height:1.08;
  letter-spacing:-.01em;
  margin:0 0 .45em;
  color:var(--ink);
}
h1{ font-size:clamp(2.6rem,3.4vw + 1.6rem,4.2rem); }
h2{ font-size:clamp(1.9rem,1.8vw + 1.3rem,2.6rem); }
h3{ font-size:clamp(1.2rem,.5vw + 1.05rem,1.4rem); font-weight:600; }
p{ margin:0 0 1em; max-width:62ch; color:var(--ink-soft); }
em{ font-family:var(--font-display); font-style:italic; color:var(--ink); }

.eyebrow{
  display:inline-flex; align-items:center; gap:.65em;
  font-family:var(--font-body);
  font-size:.75rem;
  font-weight:600;
  letter-spacing:.17em;
  text-transform:uppercase;
  color:var(--gold-strong);
  margin:0 0 1.1em;
}
.eyebrow .rule{ width:2.4em; height:1px; background:var(--gold); display:inline-block; }

.rule-fine{
  height:1px; background:var(--line); border:none; margin:0;
}
.rule-double{
  height:5px; border:none; margin:1.6rem 0 0;
  background-image: linear-gradient(var(--line), var(--line));
  background-repeat:no-repeat;
  background-size:100% 1px, 100% 1px;
  background-position: top, bottom;
}
.rule-double::before{ content:""; }

.wrap{ max-width:1180px; margin:0 auto; padding:0 clamp(1.25rem,4vw,3rem); }
section{ padding: clamp(3.6rem,7vw,6.5rem) 0; }
.section-divider{ max-width:1180px; margin:0 auto; padding:0 clamp(1.25rem,4vw,3rem); }
.section-divider .line{ height:1px; background:var(--line); }

/* ---- header ---- */
header{
  position:sticky; top:0; z-index:40;
  background:color-mix(in srgb, var(--surface) 90%, transparent);
  backdrop-filter: blur(10px);
  border-bottom:1px solid var(--line);
}
.nav{ display:flex; align-items:center; justify-content:space-between; padding:.85rem clamp(1.25rem,4vw,3rem); }
.brand{ display:flex; align-items:center; gap:.7rem; text-decoration:none; }
.brand-logo{ display:block; width:auto; height:42px; }
.logo-dark{ display:none; }
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]) .logo-light{ display:none; }
  :root:not([data-theme="light"]) .logo-dark{ display:block; }
}
:root[data-theme="dark"] .logo-light{ display:none; }
:root[data-theme="dark"] .logo-dark{ display:block; }

.navlinks{ display:flex; gap:clamp(1.1rem,2vw,2.1rem); list-style:none; margin:0; padding:0; }
.navlinks a{
  text-decoration:none; font-size:.86rem; font-weight:500; letter-spacing:.01em; color:var(--ink-soft);
  padding:.3rem 0; border-bottom:1px solid transparent; transition:color .15s ease, border-color .15s ease;
}
.navlinks a:hover, .navlinks a[aria-current="page"]{ color:var(--ink); border-color:var(--gold); }
.nav-actions{ display:flex; align-items:center; gap:1rem; }
.navtoggle{ display:none; background:none; border:1px solid var(--line); border-radius:6px; padding:.4rem .6rem; color:var(--ink); }

.btn{
  display:inline-flex; align-items:center; gap:.5em;
  font-family:var(--font-body); font-weight:600; font-size:.92rem;
  padding:.8em 1.6em; border-radius:999px; text-decoration:none;
  border:1px solid transparent; cursor:pointer;
  transition: transform .15s ease, box-shadow .15s ease, background .15s ease, border-color .15s ease;
}
.btn:focus-visible{ outline:2px solid var(--focus); outline-offset:2px; }
.btn-primary{ background:var(--hero-gold); color:var(--hero-bg-1); border-color:var(--hero-gold); }
.btn-primary:hover{ transform:translateY(-1px); box-shadow:var(--shadow); background:var(--gold-strong); border-color:var(--gold-strong); }
.btn-outline{ background:transparent; color:var(--ink); border-color:var(--gold); }
.btn-outline:hover{ background:var(--gold-soft); }
.btn-outline-invert{ background:transparent; color:var(--hero-text); border-color:var(--hero-line); }
.btn-outline-invert:hover{ background:rgba(246,243,233,.08); border-color:var(--hero-gold); }
.btn[disabled]{ opacity:.6; cursor:not-allowed; transform:none !important; }

/* ---- hero (deliberately fixed dark band — same in both themes) ---- */
.hero{
  padding-top:clamp(3.4rem,7vw,5.2rem);
  padding-bottom:clamp(3.4rem,7vw,5.2rem);
  background: radial-gradient(ellipse 120% 100% at 85% 0%, var(--hero-bg-2), var(--hero-bg-1) 60%);
  color:var(--hero-text);
  overflow:hidden;
  position:relative;
}
.hero .eyebrow{ color:var(--hero-gold); }
.hero .eyebrow .rule{ background:var(--hero-gold); }
.hero h1{ color:var(--hero-text); }
.hero p{ color:var(--hero-text-soft); }
.hero strong{ color:var(--hero-text); }
.hero .contact-grid{ align-items:start; }
.hero .contact-grid form.card{ background:var(--surface); border-top:3px solid var(--hero-gold); }
.hero-grid{ display:grid; grid-template-columns:1.15fr .85fr; gap:clamp(2rem,5vw,4rem); align-items:center; }
.hero-copy{ max-width:46rem; }
.hero-copy .lead{ font-size:1.14rem; max-width:52ch; color:var(--hero-text-soft); }
.hero-ctas{ display:flex; flex-wrap:wrap; gap:1rem; margin-top:1.8rem; }
.hero-foot{ margin-top:2.6rem; display:flex; gap:2rem; flex-wrap:wrap; }
.hero-foot .stat{ font-size:.86rem; color:var(--hero-text-soft); border-left:1px solid var(--hero-line); padding-left:.9rem; }
.hero-foot .stat b{ display:block; font-family:var(--font-display); font-weight:600; font-size:1.3rem; color:var(--hero-text); }

.hero-emblem{ display:flex; align-items:center; justify-content:center; }
.emblem-lg{ width:min(100%,280px); height:auto; }
.emblem-sm{ width:120px; height:auto; position:absolute; top:1.6rem; right:clamp(1rem,4vw,3rem); opacity:.55; }
.ring-ticks line{ stroke:var(--hero-line); }
.ring-outer, .ring-inner{ stroke:var(--hero-line); }
.ring-dash{ stroke:var(--hero-gold); }
.check{ stroke:var(--hero-gold); }
.dots .dot-gold{ fill:var(--hero-gold); }
.dots .dot-navy{ fill:var(--hero-text-soft); }

/* ---- cards / grids ---- */
.grid-2{ display:grid; grid-template-columns:repeat(2,1fr); gap:1.6rem; }
.grid-3{ display:grid; grid-template-columns:repeat(3,1fr); gap:1.6rem; }
.grid-4{ display:grid; grid-template-columns:repeat(4,1fr); gap:1.3rem; }

.card{
  background:var(--surface); border:1px solid var(--line); border-top:3px solid var(--gold); border-radius:10px;
  padding:1.8rem; transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.card:hover{ transform:translateY(-3px); border-color:var(--gold); box-shadow:var(--shadow); }
.card p{ font-size:.95rem; margin-bottom:0; }

.medallion{
  width:50px; height:50px; border-radius:50%;
  background:var(--gold-soft); color:var(--gold-strong);
  display:flex; align-items:center; justify-content:center;
  margin-bottom:1.1rem;
}
.medallion svg{ width:24px; height:24px; }

.reveal{ opacity:0; transform:translateY(14px); transition:opacity .6s ease, transform .6s ease; }
.reveal.in{ opacity:1; transform:none; }

/* ---- process / method ---- */
.steps{ display:grid; grid-template-columns:repeat(4,1fr); gap:1.8rem; }
.step{ position:relative; padding-top:1.1rem; }
.step .num{ font-family:var(--font-display); font-style:italic; font-weight:500; font-size:1.7rem; color:var(--gold); display:block; margin-bottom:.5rem; }
.step hr.rule-fine{ margin-bottom:1rem; }

/* ---- sector / badge pills ---- */
.pill-row{ display:flex; flex-wrap:wrap; gap:.8rem; }
.pill{
  font-family:var(--font-body); font-size:.86rem; letter-spacing:.01em; font-weight:500;
  border:1px solid var(--gold); color:var(--ink);
  padding:.5em 1.1em; border-radius:999px;
  display:inline-flex; align-items:center; gap:.5em;
  background:var(--gold-soft);
}
.pill .dot{ width:5px; height:5px; border-radius:50%; background:var(--gold-strong); display:inline-block; }

/* ---- offers ---- */
.offer{ display:flex; flex-direction:column; height:100%; }
.offer h3{ margin-bottom:.3rem; }
.offer .tag{ font-size:.74rem; letter-spacing:.1em; text-transform:uppercase; font-weight:600; color:var(--gold-strong); margin-bottom:1.1rem; }
.offer ul{ list-style:none; margin:0 0 1.3rem; padding:0; flex:1; }
.offer li{ font-size:.93rem; color:var(--ink-soft); padding:.55em 0; border-top:1px solid var(--line); }
.offer li:first-child{ border-top:none; }

/* ---- contact ---- */
.contact-grid{ display:grid; grid-template-columns:.9fr 1.1fr; gap:clamp(2rem,5vw,4rem); align-items:start; }
form{ display:grid; gap:1.1rem; }
.field{ display:grid; gap:.45rem; }
.field label{ font-size:.78rem; font-weight:600; letter-spacing:.04em; color:var(--ink-soft); }
.field input, .field textarea{
  font-family:var(--font-body); font-size:.96rem; color:var(--ink);
  background:var(--surface); border:1px solid var(--line); border-radius:6px;
  padding:.8em .95em; width:100%;
}
.field input:focus, .field textarea:focus{ outline:2px solid var(--focus); outline-offset:1px; border-color:var(--focus); }
.row2{ display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.form-note{ font-size:.82rem; color:var(--ink-soft); max-width:none; margin-top:-.3rem; }
.form-status{ font-size:.86rem; color:var(--success); min-height:1.2em; }
.form-status.is-error{ color:var(--error); }
.hp-field{ position:absolute; left:-9999px; top:auto; width:1px; height:1px; overflow:hidden; }

/* ---- footer (deliberately fixed dark band, same in both themes) ---- */
footer{ background:var(--footer-bg); color:var(--footer-text); }
footer .brand-logo{ height:46px; }
footer p{ color:var(--footer-text-soft); }
.footer-grid{ display:grid; grid-template-columns:1.3fr 1fr 1fr; gap:2.2rem; padding:3.4rem 0 1.6rem; }
.footer-grid h4{ font-size:.73rem; letter-spacing:.12em; text-transform:uppercase; font-weight:600; color:var(--footer-gold); margin:0 0 1.1rem; }
.footer-grid ul{ list-style:none; margin:0; padding:0; display:grid; gap:.65rem; }
.footer-grid a{ text-decoration:none; color:var(--footer-text-soft); font-size:.92rem; }
.footer-grid a:hover{ color:var(--footer-gold); }
.footer-bottom{ border-top:1px solid var(--footer-line); padding:1.2rem clamp(1.25rem,4vw,3rem); display:flex; justify-content:space-between; flex-wrap:wrap; gap:.6rem; font-size:.8rem; color:var(--footer-text-soft); }
#mentions{ scroll-margin-top:90px; }
#mentions p{ font-size:.86rem; }

@media (max-width: 920px){
  .navlinks{ display:none; }
  .navtoggle{ display:inline-flex; }
  .contact-grid{ grid-template-columns:1fr; }
  .hero-grid{ grid-template-columns:1fr; }
  .hero-emblem{ order:-1; }
  .emblem-lg{ width:160px; margin:0 auto; }
  .emblem-sm{ display:none; }
  .grid-2,.grid-3,.grid-4,.steps{ grid-template-columns:1fr 1fr; }
  .footer-grid{ grid-template-columns:1fr; }
  .row2{ grid-template-columns:1fr; }
}
@media (max-width: 600px){
  .grid-2,.grid-3,.grid-4,.steps{ grid-template-columns:1fr; }
}

@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  .reveal{ opacity:1; transform:none; transition:none; }
  .card:hover{ transform:none; }
}
