:root{
  --leriau:#1B1816;
  --ink:#1B1816;
  --muted:#6A625D;
  --paper:#F8F3EE;
  --paper-2:#FCF9F6;
  --white:#FFFFFF;
  --line:#EADFD6;

  --agence:#D6A126;
  --agence-text:#94610C;
  --agence-soft:#F8ECD2;

  --industrie:#AD4828;
  --industrie-soft:#F1DDD4;

  --augure:#6C4D69;
  --augure-soft:#EDE4EC;

  --shadow:0 20px 50px rgba(38,28,22,.07);
  --max:1160px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;
  color:var(--ink);
  background:#FCFAF8;
  line-height:1.55;
}
a{color:inherit}
img{display:block;max-width:100%}
.wrap{width:min(var(--max),calc(100% - 44px));margin:0 auto}

/* Header */
.site-header{
  position:sticky;top:0;z-index:40;
  background:rgba(252,250,248,.94);
  backdrop-filter:blur(14px);
  border-bottom:1px solid rgba(234,223,214,.95);
}
.header-inner{
  min-height:76px;
  display:flex;align-items:center;justify-content:space-between;gap:24px;
}
.brand{display:inline-flex;align-items:center;text-decoration:none}
.brand img{width:146px;height:auto}
.nav{display:flex;align-items:center;gap:22px;flex-wrap:wrap}
.nav a{
  text-decoration:none;
  font-size:.95rem;
  font-weight:700;
  color:#3B3531;
  transition:.15s ease;
}
.nav a:hover,.nav a.active{color:var(--theme,var(--industrie))}
.nav .contact-link{
  border:1px solid transparent;
  background:
    linear-gradient(#fff,#fff) padding-box,
    linear-gradient(90deg,rgba(214,161,38,.44),rgba(173,72,40,.32),rgba(108,77,105,.40)) border-box;
  color:#514945;
  padding:9px 13px;
  border-radius:999px;
  box-shadow:0 6px 18px rgba(43,32,25,.035);
}
.nav .contact-link:hover{
  color:var(--industrie);
  box-shadow:0 10px 24px rgba(43,32,25,.06);
}

/* Common */
.eyebrow{
  color:var(--theme,var(--industrie));
  font-size:.79rem;
  font-weight:850;
  letter-spacing:.13em;
  text-transform:uppercase;
  margin-bottom:17px;
}
h1,h2,h3{letter-spacing:-.035em}
h1{
  margin:0 0 25px;
  font-size:clamp(3rem,6.2vw,5.35rem);
  line-height:.98;
  max-width:850px;
}
.lead{
  color:var(--muted);
  font-size:clamp(1.12rem,1.8vw,1.34rem);
  max-width:760px;
  margin:0 0 31px;
}
.cta-row{display:flex;gap:12px;flex-wrap:wrap}
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  min-height:48px;padding:12px 18px;
  border-radius:9px;font-weight:800;text-decoration:none;
  border:1px solid var(--theme,var(--industrie));
  transition:transform .16s ease,background .16s ease,box-shadow .16s ease;
}
.btn:hover{transform:translateY(-1px)}
.btn.primary{
  background:var(--theme,var(--industrie));color:#fff;
  box-shadow:0 10px 26px color-mix(in srgb,var(--theme,var(--industrie)) 24%,transparent);
}
.btn.secondary{color:var(--theme,var(--industrie));background:#fff}
.btn.ghost{border-color:var(--line);color:var(--ink);background:#fff}
.btn.ghost:hover{border-color:#CDB9AC}
.section{padding:80px 0}
.section.alt{
  background:
    radial-gradient(circle at 8% 100%,rgba(214,161,38,.045),transparent 20%),
    radial-gradient(circle at 50% 0%,rgba(173,72,40,.035),transparent 24%),
    radial-gradient(circle at 92% 8%,rgba(108,77,105,.045),transparent 22%),
    linear-gradient(180deg,#F8F3EE 0%,#FBF7F3 100%);
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
.section.dark{
  color:#fff;
  background:
    radial-gradient(circle at 86% 10%,rgba(108,77,105,.18),transparent 24%),
    radial-gradient(circle at 70% 100%,rgba(173,72,40,.14),transparent 28%),
    linear-gradient(135deg,#191716,#231F1D);
}
.section.dark .section-intro,.section.dark .muted{color:#CBC5C0}
.section-title{
  margin:0 0 12px;
  font-size:clamp(2.05rem,4vw,3.25rem);
  line-height:1.07;
}
.section-intro{
  max-width:810px;
  margin:0 0 36px;
  font-size:1.07rem;
  color:var(--muted);
}
.breadcrumb{
  margin-bottom:17px;font-size:.89rem;color:var(--muted);
}
.breadcrumb a{text-decoration:none;color:var(--theme,var(--industrie));font-weight:780}

/* HOME HERO */
.hero-wrap{
  position:relative;overflow:hidden;
  border-bottom:1px solid var(--line);
  background:
    radial-gradient(circle at 10% 88%,rgba(214,161,38,.16),transparent 28%),
    radial-gradient(circle at 92% 8%,rgba(173,72,40,.18),transparent 30%),
    radial-gradient(circle at 84% 72%,rgba(108,77,105,.16),transparent 34%),
    linear-gradient(120deg,rgba(214,161,38,.07) 0%,rgba(173,72,40,.05) 44%,rgba(108,77,105,.07) 100%),
    linear-gradient(180deg,#fff 0%,#FCF8F4 100%);
}
.home-hero{
  min-height:675px;
  padding:96px 0 82px;
  display:grid;
  grid-template-columns:1.06fr .94fr;
  gap:72px;
  align-items:center;
}
.home-hero .eyebrow{
  color:var(--leriau);
  display:inline-flex;align-items:center;gap:10px;
}
.home-hero .eyebrow:before{
  content:"";
  width:34px;height:3px;border-radius:3px;
  background:linear-gradient(90deg,var(--agence) 0%,var(--industrie) 48%,var(--augure) 100%);
}
.home-hero h1{
  max-width:760px;
  font-size:clamp(3.2rem,6.2vw,5.6rem);
  line-height:.96;
}
.home-hero .lead{max-width:700px}
.home-hero .btn.primary{
  --theme:var(--leriau);
  background:var(--leriau);
  border-color:var(--leriau);
  box-shadow:0 10px 28px rgba(27,24,22,.13);
}
.home-hero .btn.secondary{
  --theme:var(--leriau);
  border-color:#BEB3AB;
  color:var(--leriau);
}
.hero-proof{
  display:flex;gap:17px;flex-wrap:wrap;margin-top:26px;
  color:#7A716B;font-size:.88rem;
}
.hero-proof span{display:inline-flex;align-items:center;gap:7px}
.hero-proof span:before{
  content:"";width:7px;height:7px;border-radius:50%;
  background:var(--industrie);opacity:.75;
}
.brand-stage{
  position:relative;
  min-height:470px;
  display:flex;
  align-items:center;
  justify-content:center;
}
.brand-stage:before{
  content:"";
  position:absolute;
  width:390px;height:390px;border-radius:50%;
  border:1px solid rgba(173,72,40,.14);
  box-shadow:
    0 0 0 46px rgba(214,161,38,.055),
    0 0 0 92px rgba(108,77,105,.045);
}
.brand-stage-inner{
  position:relative;z-index:3;
  width:min(100%,470px);
  padding:34px 36px;
  border:1px solid var(--line);
  border-radius:24px;
  background:
    linear-gradient(135deg,rgba(255,255,255,.94),rgba(252,248,244,.90));
  box-shadow:var(--shadow);
}
.big-mark{
  width:118px;margin:0 auto 22px;
}
.brand-stage-title{
  text-align:center;font-size:1.08rem;font-weight:850;margin-bottom:26px;
}
.branch-line{
  display:grid;
  grid-template-columns:6px 1fr;
  gap:15px;
  padding:16px 0;
  border-top:1px solid var(--line);
}
.branch-line:first-of-type{border-top:none}
.branch-line-bar{border-radius:999px}
.branch-line.agence .branch-line-bar{background:var(--agence)}
.branch-line.industrie .branch-line-bar{background:var(--industrie)}
.branch-line.augure .branch-line-bar{background:var(--augure)}
.branch-line strong{display:block;font-size:.96rem}
.branch-line span{display:block;color:var(--muted);font-size:.88rem;margin-top:2px}
.brand-stage-note{
  margin-top:18px;padding-top:16px;border-top:1px solid var(--line);
  text-align:center;color:#8A817B;font-size:.8rem;
  text-transform:uppercase;letter-spacing:.09em;font-weight:750;
}

/* Branch cards */
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.branch-card{
  position:relative;
  display:flex;flex-direction:column;
  min-height:360px;
  border:1px solid var(--line);
  border-radius:18px;padding:30px;
  background:#fff;text-decoration:none;overflow:hidden;
  box-shadow:0 12px 32px rgba(43,32,25,.035);
  transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease;
}
.branch-card:before{
  content:"";position:absolute;left:0;right:0;top:0;height:6px;
  background:var(--card-accent);
}
.branch-card:after{
  content:"";position:absolute;
  width:180px;height:180px;border-radius:50%;
  right:-86px;top:-84px;
  background:var(--card-soft);opacity:.72;
}
.branch-card:hover{
  transform:translateY(-5px);
  border-color:#D7C3B6;
  box-shadow:0 20px 44px rgba(43,32,25,.085);
}
.branch-card.agence{--card-accent:var(--agence);--card-soft:var(--agence-soft)}
.branch-card.industrie{--card-accent:var(--industrie);--card-soft:var(--industrie-soft)}
.branch-card.augure{--card-accent:var(--augure);--card-soft:var(--augure-soft)}
.card-top{
  position:relative;z-index:2;
  display:flex;align-items:center;justify-content:space-between;gap:14px;
  margin-bottom:24px;
}
.card-kicker{
  color:var(--card-accent);
  font-size:.77rem;font-weight:850;letter-spacing:.11em;text-transform:uppercase;
}
.card-icon{
  width:46px;height:46px;border-radius:14px;
  display:flex;align-items:center;justify-content:center;
  background:color-mix(in srgb,var(--card-accent) 16%,#fff);
  border:1px solid color-mix(in srgb,var(--card-accent) 22%,#fff);
  color:var(--card-accent);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.62);
  font-weight:900;font-size:1.08rem;line-height:1;
}
.branch-card h3{position:relative;z-index:2;font-size:1.62rem;margin:0 0 13px}
.branch-card p{position:relative;z-index:2;color:var(--muted);margin:0 0 26px}
.branch-card .promise{
  position:relative;z-index:2;
  margin-top:auto;padding-top:19px;border-top:1px solid var(--line);
  font-weight:780;
}
.branch-card .discover{
  position:relative;z-index:2;
  display:inline-flex;align-items:center;gap:8px;
  color:var(--card-accent);font-weight:850;margin-top:13px;
}

/* Method */
.principle{
  display:grid;grid-template-columns:.84fr 1.16fr;
  gap:54px;align-items:center;
}
.principle-card{
  position:relative;background:#fff;border:1px solid var(--line);
  border-radius:18px;padding:31px;
  box-shadow:0 12px 30px rgba(43,32,25,.045);
}
.principle-card:before{
  content:"";position:absolute;left:0;top:28px;bottom:28px;width:4px;
  border-radius:5px;
  background:linear-gradient(var(--agence),var(--industrie),var(--augure));
}
.principle-card p{margin:0;color:var(--muted);font-size:1.06rem}
.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.tile{
  border:1px solid var(--line);
  border-radius:14px;padding:25px;background:#fff;
  box-shadow:0 8px 24px rgba(50,37,29,.035);
}
.tile-number{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:31px;height:31px;padding:0 9px;
  border-radius:10px;background:var(--theme-soft,var(--industrie-soft));
  color:var(--theme,var(--industrie));
  font-size:.78rem;font-weight:900;margin-bottom:14px;
}
.tile h3{font-size:1.13rem;margin:0 0 9px}
.tile p{color:var(--muted);margin:0;font-size:.96rem}
.step{padding:18px 8px 0 0;border-top:2px solid var(--theme,var(--industrie))}
.step strong{display:block;margin-bottom:7px}
.step span{color:var(--muted);font-size:.94rem}
.dark .step span{color:#C9C3BE}
.split{
  display:grid;grid-template-columns:.9fr 1.1fr;
  gap:54px;align-items:start;
}
.callout{
  background:
    radial-gradient(circle at 85% 15%,color-mix(in srgb,var(--theme,var(--industrie)) 22%,transparent),transparent 30%),
    #1B1918;
  color:#fff;padding:30px;border-radius:16px;
}
.callout p{color:#D2CDC9}
.tags{display:flex;flex-wrap:wrap;gap:9px}
.tag{
  padding:7px 11px;border:1px solid #5F5853;
  background:rgba(255,255,255,.025);
  border-radius:999px;color:#F0EEEC;font-size:.88rem;
}

/* Branch pages */
.page-agence{--theme:var(--agence);--theme-soft:var(--agence-soft)}
.page-industrie{--theme:var(--industrie);--theme-soft:var(--industrie-soft)}
.page-augure{--theme:var(--augure);--theme-soft:var(--augure-soft)}
.branch-hero{
  position:relative;overflow:hidden;
  background:
    radial-gradient(circle at 88% 10%,color-mix(in srgb,var(--theme) 23%,transparent),transparent 30%),
    radial-gradient(circle at 12% 92%,color-mix(in srgb,var(--theme) 7%,transparent),transparent 27%),
    linear-gradient(180deg,#fff 0%,#FBF6F2 100%);
  border-bottom:1px solid var(--line);
}
.branch-hero .hero{
  min-height:555px;padding:76px 0 68px;
  display:grid;grid-template-columns:1.08fr .72fr;
  gap:64px;align-items:center;
}
.branch-hero .hero>div:first-child{max-width:720px}
.branch-hero h1{
  font-size:clamp(2.75rem,5vw,4.4rem);line-height:1.01;max-width:700px;
}
.hero-visual{
  min-height:360px;
  border-radius:24px;
  border:1px solid var(--line);
  background:linear-gradient(145deg,#fff,#FAF5F1);
  box-shadow:var(--shadow);
  padding:30px;
}
.branch-visual-label{
  color:var(--theme);font-size:.78rem;font-weight:900;
  letter-spacing:.11em;text-transform:uppercase;margin-bottom:22px;
}
.branch-diagram{display:grid;gap:14px}
.branch-diagram-row{
  display:flex;align-items:center;gap:12px;
  padding:15px 16px;border:1px solid var(--line);
  background:rgba(255,255,255,.80);border-radius:14px;
}
.branch-diagram-row .mini{
  width:34px;height:34px;flex:0 0 34px;border-radius:10px;
  background:var(--theme-soft);color:var(--theme);
  display:flex;align-items:center;justify-content:center;font-weight:900;
}
.branch-diagram-row strong{display:block;font-size:.95rem}
.branch-diagram-row span{display:block;color:var(--muted);font-size:.84rem;margin-top:2px}

/* Contact */
.contact-panel{
  position:relative;overflow:hidden;border-radius:20px;padding:38px;color:#fff;
  background:
    radial-gradient(circle at 90% 10%,rgba(255,255,255,.12),transparent 25%),
    linear-gradient(135deg,var(--theme,var(--leriau)),color-mix(in srgb,var(--theme,var(--leriau)) 78%,#1B1816));
  box-shadow:0 18px 42px color-mix(in srgb,var(--theme,var(--leriau)) 22%,transparent);
}
.home-contact{--theme:var(--leriau)}
.contact-panel h2{font-size:clamp(2rem,4vw,3.05rem);margin:0 0 12px}
.contact-panel p{max-width:720px;color:#F5E9E2;margin:0 0 22px}
.contact-actions{display:flex;gap:12px;flex-wrap:wrap}
.contact-panel .btn{border-color:rgba(255,255,255,.65)}
.contact-panel .btn.primary{background:#fff;color:var(--theme,var(--leriau));box-shadow:none}
.contact-panel .btn.secondary{background:transparent;color:#fff}
.footer{
  border-top:1px solid var(--line);padding:30px 0 40px;
  color:var(--muted);font-size:.9rem;
}
.footer-inner{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap}
.footer a{color:var(--industrie);text-decoration:none;font-weight:700}

/* Responsive */
@media(max-width:920px){
  .home-hero,.branch-hero .hero,.principle,.split{grid-template-columns:1fr}
  .home-hero{min-height:auto}
  .brand-stage{min-height:440px}
  .cards,.grid-4{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:720px){
  .wrap{width:min(var(--max),calc(100% - 28px))}
  .site-header{
    position:sticky;
    top:0;
    box-shadow:0 8px 24px rgba(38,28,22,.055);
  }
  .header-inner{min-height:64px}
  .brand img{width:126px}
  .nav a:not(.contact-link){display:none}
  .nav .contact-link{
    padding:8px 12px;
    background:rgba(255,255,255,.96);
  }
  .home-hero,.branch-hero .hero{padding:58px 0 52px}
  .home-hero h1,.branch-hero h1{font-size:3rem}
  .brand-stage{min-height:auto}
  .brand-stage-inner{padding:26px 22px}
  .section{padding:58px 0}
  .cards,.grid-4,.grid-3{grid-template-columns:1fr}
  .branch-card{min-height:auto}
  .contact-panel{padding:29px 24px}
}

@media(max-width:720px){
  .brand{
    position:relative;
  }
  .brand:after{
    content:"Accueil";
    position:absolute;
    left:0;
    top:100%;
    margin-top:1px;
    font-size:.58rem;
    line-height:1;
    letter-spacing:.06em;
    text-transform:uppercase;
    color:#8A817B;
    font-weight:800;
    opacity:.72;
    pointer-events:none;
  }
}


/* V7 — accessibilité, navigation mobile, épuration */
.skip-link{
  position:fixed;left:14px;top:10px;z-index:9999;
  transform:translateY(-160%);
  padding:10px 14px;border-radius:8px;
  background:#1B1816;color:#fff;font-weight:800;text-decoration:none;
}
.skip-link:focus{transform:translateY(0)}
a:focus-visible, summary:focus-visible{
  outline:3px solid color-mix(in srgb,var(--theme,var(--industrie)) 65%,#fff);
  outline-offset:4px;
  border-radius:6px;
}
.mobile-menu{display:none;position:relative}
.mobile-menu summary{
  list-style:none;cursor:pointer;
  border:1px solid var(--line);
  background:#fff;
  border-radius:999px;
  padding:8px 12px;
  font-size:.9rem;font-weight:800;
}
.mobile-menu summary::-webkit-details-marker{display:none}
.mobile-menu-panel{
  position:absolute;right:0;top:calc(100% + 10px);
  min-width:220px;padding:10px;
  border:1px solid var(--line);border-radius:14px;
  background:#fff;box-shadow:0 18px 40px rgba(38,28,22,.12);
}
.mobile-menu-panel a{
  display:block;padding:10px 12px;
  text-decoration:none;border-radius:9px;
  color:var(--ink);font-weight:700;
}
.mobile-menu-panel a:last-child{
  margin-top:4px;
  border:1px solid color-mix(in srgb,var(--industrie) 18%,var(--line));
  background:linear-gradient(90deg,rgba(214,161,38,.05),rgba(173,72,40,.04),rgba(108,77,105,.05));
}
.mobile-menu-panel a:hover{background:var(--paper)}
.mobile-menu-panel a.current{color:var(--theme,var(--industrie));background:var(--paper)}

.continuum{
  margin-top:14px;
  display:grid;grid-template-columns:repeat(3,1fr);
  border:1px solid var(--line);
  border-radius:14px;overflow:hidden;
}
.continuum-item{
  position:relative;padding:18px 14px 16px;
  background:#fff;text-align:center;
  border-right:1px solid var(--line);
}
.continuum-item:last-child{border-right:none}
.continuum-item:before{
  content:"";position:absolute;left:0;right:0;top:0;height:5px;
}
.continuum-item.agence:before{background:var(--agence)}
.continuum-item.industrie:before{background:var(--industrie)}
.continuum-item.augure:before{background:var(--augure)}
.continuum-item strong{display:block;font-size:.93rem;margin-bottom:2px}
.continuum-item span{font-size:.78rem;color:var(--muted)}
.continuum-arrow{
  margin:16px 0 2px;text-align:center;color:#91867E;
  font-size:.78rem;font-weight:850;letter-spacing:.11em;text-transform:uppercase;
}

.outcomes{
  display:grid;gap:12px;
}
.outcome{
  display:grid;grid-template-columns:38px 1fr;gap:12px;align-items:start;
  padding:15px 16px;
  border:1px solid var(--line);border-radius:13px;
  background:rgba(255,255,255,.82);
}
.outcome-icon{
  width:38px;height:38px;border-radius:11px;
  display:flex;align-items:center;justify-content:center;
  background:var(--theme-soft);color:var(--theme);
  font-weight:900;
}
.outcome strong{display:block;margin:1px 0 3px;font-size:.96rem}
.outcome span{display:block;color:var(--muted);font-size:.84rem}

.method-head{
  display:grid;grid-template-columns:.9fr 1.1fr;gap:48px;
  align-items:end;margin-bottom:36px;
}
.method-head .section-intro{margin:0;color:#C9C3BE}

.page-agence .branch-card,
.page-agence .tile-number{--theme:var(--agence)}
.page-agence .branch-visual-label{color:var(--agence)}

@media(max-width:720px){
  .nav{display:none}
  .mobile-menu{display:block}
  .continuum{grid-template-columns:1fr}
  .continuum-item{border-right:none;border-bottom:1px solid var(--line)}
  .continuum-item:last-child{border-bottom:none}
  .method-head{grid-template-columns:1fr;gap:16px}
  .brand:after{display:none}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{
    transition-duration:.001ms!important;
    animation-duration:.001ms!important;
    animation-iteration-count:1!important;
  }
}


/* V8 — Agence : ocre lumineux visuel + texte accessible */
.branch-card.agence .card-kicker,
.branch-card.agence .discover,
.page-agence .eyebrow,
.page-agence .branch-visual-label,
.page-agence .breadcrumb a,
.page-agence .tile-number{
  color:var(--agence-text);
}
.branch-card.agence .card-icon{
  color:var(--agence-text);
}
.page-agence .btn.primary{
  background:var(--agence-text);
  border-color:var(--agence-text);
}
.page-agence .btn.secondary{
  color:var(--agence-text);
  border-color:var(--agence-text);
}
.page-agence .contact-panel{
  --theme:var(--agence-text);
}


/* =========================================================
   V10 — finition structurelle / rythme de lecture
   ========================================================= */

/* Les cartes d'offre ne doivent plus ressembler à des étapes. */
.capability-grid .tile{
  position:relative;
  overflow:hidden;
  padding-top:29px;
}
.capability-grid .tile::before{
  content:"";
  position:absolute;
  left:0;right:0;top:0;
  height:4px;
  background:var(--theme);
  opacity:.78;
}
.capability-grid .tile-number{display:none}

/* Hero : résultats, pas étapes. */
.outcomes{
  display:grid;
  gap:12px;
}
.outcome{
  position:relative;
  display:block;
  padding:16px 18px 16px 22px;
  border:1px solid var(--line);
  border-radius:13px;
  background:rgba(255,255,255,.82);
}
.outcome::before{
  content:"";
  position:absolute;
  left:0;top:16px;bottom:16px;
  width:4px;border-radius:999px;
  background:var(--theme);
  opacity:.78;
}
.outcome-icon{display:none}
.outcome strong{display:block;margin:0 0 4px;font-size:.96rem}
.outcome span{display:block;color:var(--muted);font-size:.84rem}

/* Cas d'usage : A/B/C = scénarios, pas process.
   Intensité croissante de gauche à droite. */
.scenario-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
}
.scenario-card{
  position:relative;
  min-height:236px;
  padding:26px;
  border:1px solid color-mix(in srgb,var(--theme) 19%,var(--line));
  border-radius:15px;
  overflow:hidden;
  box-shadow:0 9px 25px rgba(47,35,27,.035);
}
.scenario-card::after{
  content:"";
  position:absolute;
  width:120px;height:120px;
  border-radius:50%;
  right:-54px;top:-58px;
  background:color-mix(in srgb,var(--theme) var(--scenario-strength),transparent);
}
.scenario-card:nth-child(1){
  --scenario-strength:7%;
  background:linear-gradient(145deg,#fff,color-mix(in srgb,var(--theme) 3.5%,#fff));
}
.scenario-card:nth-child(2){
  --scenario-strength:13%;
  background:linear-gradient(145deg,#fff,color-mix(in srgb,var(--theme) 7%,#fff));
}
.scenario-card:nth-child(3){
  --scenario-strength:20%;
  background:linear-gradient(145deg,#fff,color-mix(in srgb,var(--theme) 11%,#fff));
}
.scenario-letter{
  position:relative;z-index:2;
  display:inline-flex;align-items:center;justify-content:center;
  min-width:32px;height:32px;padding:0 9px;
  margin-bottom:16px;border-radius:10px;
  background:color-mix(in srgb,var(--theme) 14%,#fff);
  color:var(--theme);
  font-size:.78rem;font-weight:900;
}
.scenario-card h3{
  position:relative;z-index:2;
  margin:0 0 9px;font-size:1.08rem;
}
.scenario-card p{
  position:relative;z-index:2;
  margin:0;color:var(--muted);font-size:.95rem;
}

/* La section scénario possède sa propre grammaire visuelle. */
.scenario-section .split{
  align-items:center;
}
.scenario-section .section-title{
  max-width:610px;
  font-size:clamp(1.95rem,3.25vw,2.85rem);
}
.scenario-section .section-intro{
  margin-bottom:0;
}

/* Matières industrie : intégrées au périmètre, pas nouvelle "page dans la page". */
.inline-capabilities{
  margin-top:26px;
  padding:24px 26px;
  border-radius:15px;
  background:
    radial-gradient(circle at 95% 0%,color-mix(in srgb,var(--theme) 15%,transparent),transparent 28%),
    #1B1918;
  color:#fff;
}
.inline-capabilities-head{
  display:flex;justify-content:space-between;align-items:end;
  gap:24px;margin-bottom:16px;
}
.inline-capabilities h3{margin:0;font-size:1.08rem}
.inline-capabilities p{
  margin:0;max-width:650px;color:#CEC8C3;font-size:.9rem;
}
.inline-capabilities .tags{margin-top:15px}

/* Note de modèle industriel intégrée au flux. */
.partner-note{
  margin-top:18px;
  padding:15px 18px;
  border-left:3px solid var(--theme);
  color:var(--muted);
  background:color-mix(in srgb,var(--theme) 4%,#fff);
  border-radius:0 10px 10px 0;
  font-size:.91rem;
}

/* Dégradés des 3 pages : même puissance perçue. */
.page-agence .branch-hero{
  background:
    radial-gradient(circle at 88% 8%,rgba(214,161,38,.24),transparent 31%),
    radial-gradient(circle at 12% 92%,rgba(214,161,38,.085),transparent 28%),
    linear-gradient(180deg,#fff 0%,#FBF7EF 100%);
}
.page-industrie .branch-hero{
  background:
    radial-gradient(circle at 88% 8%,rgba(173,72,40,.31),transparent 34%),
    radial-gradient(circle at 12% 92%,rgba(173,72,40,.135),transparent 31%),
    linear-gradient(180deg,#fff 0%,#FBF2EE 100%);
}
.page-augure .branch-hero{
  background:
    radial-gradient(circle at 88% 8%,rgba(108,77,105,.36),transparent 34%),
    radial-gradient(circle at 12% 92%,rgba(108,77,105,.165),transparent 31%),
    linear-gradient(180deg,#fff 0%,#F7F0F6 100%);
}
.page-agence .section.alt{
  background:
    radial-gradient(circle at 92% 8%,rgba(214,161,38,.10),transparent 25%),
    linear-gradient(180deg,#F9F4E9 0%,#FCF9F3 100%);
}
.page-industrie .section.alt{
  background:
    radial-gradient(circle at 92% 8%,rgba(173,72,40,.105),transparent 25%),
    linear-gradient(180deg,#F9F0EC 0%,#FCF8F5 100%);
}
.page-augure .section.alt{
  background:
    radial-gradient(circle at 92% 8%,rgba(108,77,105,.115),transparent 25%),
    linear-gradient(180deg,#F6F0F5 0%,#FBF8FA 100%);
}

/* Épure verticale : plus de continuité entre les grandes idées. */
.branch-hero .hero{padding-bottom:72px}
.section + .section:not(.dark){border-top:1px solid rgba(234,223,214,.62)}
.branch-hero + .section{border-top:none}

/* Interactions utiles uniquement sur les éléments cliquables. */
.btn,.branch-card,.nav a,.mobile-menu-panel a{
  transition:transform .16s ease,box-shadow .16s ease,background .16s ease,color .16s ease,border-color .16s ease;
}
.btn:hover{transform:translateY(-1px)}
.branch-card:hover{transform:translateY(-4px)}
.branch-card .discover span{
  display:inline-block;
  transition:transform .16s ease;
}
.branch-card:hover .discover span{transform:translateX(3px)}

/* Mobile : les scénarios deviennent une progression verticale naturelle. */
@media(max-width:900px){
  .scenario-grid{grid-template-columns:1fr}
  .scenario-card{min-height:auto}
}
@media(max-width:720px){
  .scenario-card:nth-child(1){
    background:linear-gradient(145deg,#fff,color-mix(in srgb,var(--theme) 4%,#fff));
  }
  .scenario-card:nth-child(2){
    background:linear-gradient(145deg,#fff,color-mix(in srgb,var(--theme) 7.5%,#fff));
  }
  .scenario-card:nth-child(3){
    background:linear-gradient(145deg,#fff,color-mix(in srgb,var(--theme) 11.5%,#fff));
  }
}


/* V11 — un seul dégradé fort par entrée de page.
   Le hero porte l'identité couleur ; la section suivante reste plus calme. */
.page-agence .section.alt{
  background:linear-gradient(180deg,#FBF7EF 0%,#FDFBF8 100%) !important;
}
.page-industrie .section.alt{
  background:linear-gradient(180deg,#FBF5F2 0%,#FDFBF9 100%) !important;
}
.page-augure .section.alt{
  background:linear-gradient(180deg,#FAF6F9 0%,#FDFBFC 100%) !important;
}


/* =========================================================
   V16 — SALES FIRST / EDITORIAL PRECISION
   ========================================================= */

.sales-hero .lead{
  max-width:720px;
  font-size:clamp(1.08rem,1.7vw,1.28rem);
}
.sales-hero .hero-visual{
  min-height:330px;
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.sales-points{
  display:grid;
  gap:12px;
}
.sales-point{
  position:relative;
  padding:17px 18px 17px 22px;
  border:1px solid var(--line);
  border-radius:13px;
  background:rgba(255,255,255,.84);
}
.sales-point::before{
  content:"";
  position:absolute;
  left:0;top:15px;bottom:15px;
  width:4px;border-radius:10px;
  background:var(--theme);
}
.sales-point strong{
  display:block;
  margin-bottom:3px;
  font-size:.97rem;
}
.sales-point span{
  color:var(--muted);
  font-size:.86rem;
}

.sales-pillars{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
}
.sales-pillar{
  position:relative;
  min-height:220px;
  padding:28px;
  border:1px solid var(--line);
  border-radius:16px;
  background:#fff;
  box-shadow:0 10px 28px rgba(45,33,26,.04);
}
.sales-pillar::before{
  content:"";
  position:absolute;
  left:0;right:0;top:0;height:5px;
  border-radius:16px 16px 0 0;
  background:var(--theme);
}
.sales-pillar .verb{
  color:var(--theme);
  font-size:.78rem;
  font-weight:900;
  letter-spacing:.12em;
  text-transform:uppercase;
  margin-bottom:18px;
}
.sales-pillar h3{
  margin:0 0 10px;
  font-size:1.38rem;
}
.sales-pillar p{
  margin:0;
  color:var(--muted);
  font-size:.97rem;
}

.target-line{
  margin-top:24px;
  padding:18px 20px;
  border-radius:13px;
  border:1px solid color-mix(in srgb,var(--theme) 18%,var(--line));
  background:color-mix(in srgb,var(--theme) 5%,#fff);
  color:var(--muted);
}
.target-line strong{color:var(--ink)}

.compact-method{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
}
.compact-method .step{
  min-height:120px;
}
.compact-method .step strong{
  font-size:1rem;
}

.offer-strip{
  margin-top:28px;
  padding:24px 26px;
  border-radius:16px;
  border:1px solid color-mix(in srgb,var(--theme) 18%,var(--line));
  background:
    radial-gradient(circle at 95% 0%,color-mix(in srgb,var(--theme) 13%,transparent),transparent 28%),
    #fff;
}
.offer-strip strong{
  display:block;
  margin-bottom:5px;
  font-size:1.05rem;
}
.offer-strip p{
  margin:0;
  color:var(--muted);
  max-width:850px;
}

.home-choice-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:20px;
}
.home-choice{
  position:relative;
  min-height:315px;
  padding:30px;
  border-radius:18px;
  border:1px solid var(--line);
  background:#fff;
  text-decoration:none;
  display:flex;
  flex-direction:column;
  overflow:hidden;
  box-shadow:0 12px 32px rgba(43,32,25,.035);
}
.home-choice::before{
  content:"";
  position:absolute;left:0;right:0;top:0;height:6px;
  background:var(--choice);
}
.home-choice::after{
  content:"";
  position:absolute;
  width:180px;height:180px;border-radius:50%;
  top:-90px;right:-85px;
  background:var(--choice-soft);
}
.home-choice.agence{--choice:var(--agence);--choice-soft:var(--agence-soft)}
.home-choice.industrie{--choice:var(--industrie);--choice-soft:var(--industrie-soft)}
.home-choice.augure{--choice:var(--augure);--choice-soft:var(--augure-soft)}
.home-choice .branch-name{
  position:relative;z-index:2;
  color:var(--choice);
  font-size:.78rem;font-weight:900;
  letter-spacing:.11em;text-transform:uppercase;
  margin-bottom:28px;
}
.home-choice h3{
  position:relative;z-index:2;
  margin:0 0 13px;
  font-size:1.72rem;
}
.home-choice p{
  position:relative;z-index:2;
  margin:0 0 24px;
  color:var(--muted);
}
.home-choice .choice-signature{
  position:relative;z-index:2;
  margin-top:auto;
  padding-top:17px;
  border-top:1px solid var(--line);
  font-weight:800;
}
.home-choice .choice-cta{
  position:relative;z-index:2;
  margin-top:10px;
  color:var(--choice);
  font-weight:900;
}
.home-choice:hover{
  transform:translateY(-4px);
  box-shadow:0 20px 44px rgba(43,32,25,.08);
}

.decision-cta{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:12px;
  margin-top:24px;
}
.decision-cta a{
  text-decoration:none;
  padding:14px 16px;
  border-radius:11px;
  background:#fff;
  color:var(--ink);
  font-weight:850;
  border:1px solid rgba(255,255,255,.52);
}
.decision-cta a:nth-child(1){box-shadow:inset 4px 0 0 var(--agence)}
.decision-cta a:nth-child(2){box-shadow:inset 4px 0 0 var(--industrie)}
.decision-cta a:nth-child(3){box-shadow:inset 4px 0 0 var(--augure)}

@media(max-width:900px){
  .sales-pillars,.compact-method,.home-choice-grid,.decision-cta{
    grid-template-columns:1fr;
  }
  .sales-pillar{min-height:auto}
  .home-choice{min-height:auto}
}


/* =========================================================
   V17 — SELF-SELECTION FIRST / FINAL UX POLISH
   ========================================================= */

/* Agency contact buttons: override old page-wide button rules inside the dark CTA. */
.page-agence .contact-panel .btn.primary{
  background:#fff;
  color:var(--agence-text);
  border-color:#fff;
  box-shadow:none;
}
.page-agence .contact-panel .btn.secondary{
  background:transparent;
  color:#fff;
  border-color:rgba(255,255,255,.72);
}
.page-agence .contact-panel .btn.secondary:hover{
  background:rgba(255,255,255,.08);
}

/* Self-selection section: make it feel like the immediate next decision after the hero. */
.self-select{
  position:relative;
}
.self-select .section-title{
  max-width:640px;
}
.self-select .scenario-card{
  min-height:215px;
}
.self-select .scenario-card h3{
  font-size:1.14rem;
}

/* Home: very light motion — no carousel, no distraction. */
@keyframes leriauFadeUp{
  from{opacity:0;transform:translateY(10px)}
  to{opacity:1;transform:translateY(0)}
}
@keyframes leriauFloat{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-4px)}
}
@keyframes leriauGlow{
  0%,100%{opacity:.72;transform:scale(1)}
  50%{opacity:.95;transform:scale(1.025)}
}

.home-hero > div:first-child{
  animation:leriauFadeUp .65s ease-out both;
}
.home-hero .brand-stage{
  animation:leriauFadeUp .72s .08s ease-out both;
}
.home-hero .big-mark{
  animation:leriauFloat 7s 1s ease-in-out infinite;
}
.home-hero .brand-stage::before{
  animation:leriauGlow 9s ease-in-out infinite;
}
.home-choice{
  animation:leriauFadeUp .55s ease-out both;
}
.home-choice:nth-child(1){animation-delay:.04s}
.home-choice:nth-child(2){animation-delay:.10s}
.home-choice:nth-child(3){animation-delay:.16s}

@media(prefers-reduced-motion:reduce){
  .home-hero > div:first-child,
  .home-hero .brand-stage,
  .home-hero .big-mark,
  .home-hero .brand-stage::before,
  .home-choice{
    animation:none!important;
  }
}


/* =========================================================
   V18 — DESKTOP / MOBILE CONTENT PRIORITY
   Desktop: layout preserved exactly as V17.
   Mobile: hero -> self-selection -> outcomes -> offer.
   ========================================================= */

.mobile-outcomes{
  display:none;
}

@media(max-width:720px){
  /* On mobile, the outcome block leaves the hero so the prospect
     can self-select before reading proof/results. */
  .branch-hero .sales-hero .hero-visual{
    display:none;
  }

  .mobile-outcomes{
    display:block;
    padding:0 0 58px;
    background:#FCFAF8;
  }

  .mobile-outcomes .hero-visual{
    min-height:auto;
    padding:24px 20px;
    border-radius:18px;
    box-shadow:0 12px 30px rgba(38,28,22,.055);
  }

  .mobile-outcomes .branch-visual-label{
    margin-bottom:16px;
  }

  /* Make self-selection and outcomes read as one continuous decision sequence. */
  #pour-vous.self-select{
    padding-bottom:34px;
  }

  #pour-vous.self-select .section-title{
    margin-bottom:24px;
  }

  #pour-vous.self-select .scenario-grid{
    gap:12px;
  }

  #pour-vous.self-select .scenario-card{
    min-height:auto;
    padding:22px;
  }
}


/* =========================================================
   V19 — RESPONSIVE DESKTOP RESILIENCE
   Same approved composition, more stable across desktop sizes.
   ========================================================= */

/* Avoid accidental overflow and make the two desktop columns elastic. */
.branch-hero .hero{
  grid-template-columns:minmax(0,1.08fr) minmax(340px,.72fr);
  gap:clamp(36px,4.5vw,64px);
}
.branch-hero .hero > *,
.scenario-section .split > *{
  min-width:0;
}

.branch-hero h1,
.scenario-section .section-title{
  text-wrap:balance;
}

/* Keep the self-selection row visually ordered on desktops of different widths. */
.scenario-section .split{
  grid-template-columns:minmax(280px,.82fr) minmax(0,1.18fr);
  gap:clamp(30px,4vw,54px);
}
.scenario-grid{
  gap:clamp(12px,1.5vw,18px);
}
.scenario-card{
  padding:clamp(20px,2vw,26px);
}

/* Medium desktop / laptop windows:
   preserve the same composition without letting the right card become cramped. */
@media(min-width:921px) and (max-width:1180px){
  .wrap{
    width:min(var(--max),calc(100% - 36px));
  }
  .branch-hero .hero{
    grid-template-columns:minmax(0,1fr) minmax(320px,.78fr);
    gap:34px;
  }
  .branch-hero h1{
    font-size:clamp(2.75rem,4.6vw,3.85rem);
  }
  .sales-hero .lead{
    font-size:1.06rem;
  }
  .sales-hero .hero-visual{
    padding:24px;
  }
  .sales-point{
    padding:15px 16px 15px 20px;
  }
  .scenario-section .split{
    grid-template-columns:minmax(250px,.72fr) minmax(0,1.28fr);
    gap:30px;
  }
  .scenario-card{
    padding:20px;
  }
}

/* Short desktop viewport (typical laptop, browser not fully maximised):
   compact spacing only — content and visual hierarchy stay identical. */
@media(min-width:921px) and (max-height:820px){
  .site-header .header-inner{
    min-height:68px;
  }
  .branch-hero .hero{
    min-height:0;
    padding:46px 0 44px;
  }
  .branch-hero h1{
    margin-bottom:18px;
    font-size:clamp(2.7rem,4.45vw,4rem);
  }
  .branch-hero .breadcrumb{
    margin-bottom:12px;
  }
  .branch-hero .eyebrow{
    margin-bottom:13px;
  }
  .sales-hero .lead{
    margin-bottom:20px;
  }
  .sales-hero .hero-visual{
    min-height:292px;
    padding:24px;
  }
  .sales-points{
    gap:10px;
  }
  .sales-point{
    padding-top:14px;
    padding-bottom:14px;
  }
  #pour-vous.self-select{
    padding-top:54px;
    padding-bottom:54px;
  }
  #pour-vous.self-select .scenario-card{
    min-height:195px;
  }
}

/* Very wide screens: do not let the content stretch unnaturally.
   The existing max-width remains the visual anchor. */
@media(min-width:1600px){
  .branch-hero .hero{
    gap:68px;
  }
}

/* Tablet remains the deliberate transition to stacked layout. */
@media(max-width:920px){
  .branch-hero .hero,
  .scenario-section .split{
    grid-template-columns:1fr;
  }
}

/* V18 mobile content priority remains authoritative. */
@media(max-width:720px){
  .branch-hero .hero{
    gap:0;
  }
}


/* =========================================================
   V20 — MILESTONE
   Broader Agence promise + living Leriau home atmosphere
   ========================================================= */

/* The existing static background remains as a fallback.
   These pseudo-elements add only a very slow layer of motion. */
.hero-wrap .wrap{
  position:relative;
  z-index:2;
}

.hero-wrap::before,
.hero-wrap::after{
  content:"";
  position:absolute;
  pointer-events:none;
  z-index:1;
  inset:-12%;
  will-change:transform,opacity;
}

.hero-wrap::before{
  background:
    radial-gradient(circle at 18% 72%,rgba(214,161,38,.17),transparent 27%),
    radial-gradient(circle at 76% 18%,rgba(173,72,40,.145),transparent 29%),
    radial-gradient(circle at 82% 76%,rgba(108,77,105,.145),transparent 31%);
  filter:blur(2px);
  animation:leriauAtmosphereA 22s ease-in-out infinite alternate;
}

.hero-wrap::after{
  background:
    radial-gradient(circle at 38% 18%,rgba(214,161,38,.07),transparent 24%),
    radial-gradient(circle at 60% 78%,rgba(173,72,40,.065),transparent 27%),
    radial-gradient(circle at 92% 42%,rgba(108,77,105,.08),transparent 25%);
  filter:blur(7px);
  opacity:.72;
  animation:leriauAtmosphereB 26s ease-in-out infinite alternate;
}

@keyframes leriauAtmosphereA{
  0%{
    transform:translate3d(-1.2%,1%,0) scale(1);
    opacity:.70;
  }
  50%{
    transform:translate3d(1.5%,-.8%,0) scale(1.025);
    opacity:.92;
  }
  100%{
    transform:translate3d(.2%,1.1%,0) scale(1.012);
    opacity:.78;
  }
}

@keyframes leriauAtmosphereB{
  0%{
    transform:translate3d(1.2%,-.7%,0) scale(1.01);
    opacity:.56;
  }
  50%{
    transform:translate3d(-1.4%,1%,0) scale(1.035);
    opacity:.78;
  }
  100%{
    transform:translate3d(.7%,-.3%,0) scale(1.018);
    opacity:.62;
  }
}

/* Keep motion elegant: on small screens, reduce amplitude/intensity slightly. */
@media(max-width:720px){
  .hero-wrap::before{
    opacity:.62;
    animation-duration:26s;
  }
  .hero-wrap::after{
    opacity:.48;
    animation-duration:30s;
  }
}

/* Accessibility: no ambient movement when reduced motion is requested. */
@media(prefers-reduced-motion:reduce){
  .hero-wrap::before,
  .hero-wrap::after{
    animation:none!important;
  }
}


/* =========================================================
   V21 — VISIBLE LIVING GRADIENT + AGENCE BREADTH + HOME NAV
   ========================================================= */

/* AGENCE — immediately show that the finished product can be sold,
   used internally, or offered to customers. */
.agency-use-cases{
  display:flex;
  flex-wrap:wrap;
  gap:9px;
  margin:20px 0 4px;
}
.agency-use-cases span{
  display:inline-flex;
  align-items:center;
  min-height:34px;
  padding:7px 12px;
  border-radius:999px;
  border:1px solid color-mix(in srgb,var(--agence) 22%,var(--line));
  background:color-mix(in srgb,var(--agence) 8%,#fff);
  color:var(--agence-text);
  font-size:.82rem;
  font-weight:850;
  letter-spacing:.01em;
}

/* HOME NAV — Accueil carries all three branch colours. */
body:not(.page-agence):not(.page-industrie):not(.page-augure) .nav a.active,
body:not(.page-agence):not(.page-industrie):not(.page-augure) .mobile-menu-panel a.current{
  background:linear-gradient(90deg,var(--agence) 0%,var(--industrie) 50%,var(--augure) 100%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  font-weight:800;
}

/* HOME — V20 motion was too subtle in real viewing conditions.
   V21 keeps the slow premium feel but increases travel and contrast enough
   to make the atmosphere perceptibly alive. */
.hero-wrap::before{
  inset:-22%;
  background:
    radial-gradient(circle at 16% 68%,rgba(214,161,38,.28),transparent 30%),
    radial-gradient(circle at 74% 18%,rgba(173,72,40,.235),transparent 31%),
    radial-gradient(circle at 83% 78%,rgba(108,77,105,.235),transparent 33%);
  filter:blur(14px);
  opacity:.92;
  animation:leriauAtmosphereV21A 20s ease-in-out infinite alternate;
}

.hero-wrap::after{
  inset:-18%;
  background:
    radial-gradient(circle at 34% 12%,rgba(214,161,38,.13),transparent 27%),
    radial-gradient(circle at 56% 84%,rgba(173,72,40,.12),transparent 29%),
    radial-gradient(circle at 94% 40%,rgba(108,77,105,.145),transparent 28%);
  filter:blur(22px);
  opacity:.78;
  animation:leriauAtmosphereV21B 24s ease-in-out infinite alternate;
}

@keyframes leriauAtmosphereV21A{
  0%{
    transform:translate3d(-4%,-1.5%,0) scale(1.02);
  }
  50%{
    transform:translate3d(3.5%,2.4%,0) scale(1.085);
  }
  100%{
    transform:translate3d(-1%,4%,0) scale(1.045);
  }
}

@keyframes leriauAtmosphereV21B{
  0%{
    transform:translate3d(3.2%,2%,0) scale(1.04);
  }
  50%{
    transform:translate3d(-3.8%,-2.5%,0) scale(1.09);
  }
  100%{
    transform:translate3d(1.5%,-3.6%,0) scale(1.055);
  }
}

@media(max-width:720px){
  .agency-use-cases{
    gap:8px;
    margin-top:18px;
  }
  .agency-use-cases span{
    font-size:.79rem;
    padding:7px 10px;
  }

  .hero-wrap::before{
    opacity:.78;
    animation-duration:24s;
  }
  .hero-wrap::after{
    opacity:.62;
    animation-duration:28s;
  }
}

@media(prefers-reduced-motion:reduce){
  .hero-wrap::before,
  .hero-wrap::after{
    animation:none!important;
  }
}


/* =========================================================
   V22 — AGENCE AUDIENCE + VISIBLE HOME MOTION
   ========================================================= */

.agency-use-cases{display:none!important;}

.agency-audience-line{
  display:flex;
  align-items:center;
  gap:13px;
  margin:18px 0 4px;
  color:var(--agence-text);
  font-size:.95rem;
  font-weight:850;
}
.agency-audience-line span{
  position:relative;
  padding-bottom:4px;
}
.agency-audience-line span::after{
  content:"";
  position:absolute;
  left:0;right:0;bottom:0;
  height:2px;
  border-radius:2px;
  background:var(--agence);
  opacity:.62;
}
.agency-audience-line em{
  color:var(--muted);
  font-style:normal;
  font-weight:600;
  font-size:.86rem;
}

/* The home hero gets a genuinely perceptible slow-moving three-colour atmosphere. */
.hero-wrap{
  position:relative;
  overflow:hidden;
  isolation:isolate;
}

.hero-wrap::before{
  content:"";
  position:absolute;
  z-index:0;
  pointer-events:none;
  width:118%;
  height:150%;
  left:-9%;
  top:-24%;
  background:
    radial-gradient(circle at 18% 62%,
      rgba(214,161,38,.34) 0%,
      rgba(214,161,38,.16) 18%,
      transparent 40%),
    radial-gradient(circle at 60% 18%,
      rgba(173,72,40,.29) 0%,
      rgba(173,72,40,.13) 20%,
      transparent 42%),
    radial-gradient(circle at 88% 68%,
      rgba(108,77,105,.31) 0%,
      rgba(108,77,105,.14) 20%,
      transparent 43%);
  filter:blur(22px);
  opacity:.9;
  transform-origin:center;
  animation:leriauAuroraV22 16s ease-in-out infinite alternate;
}

.hero-wrap::after{
  content:"";
  position:absolute;
  z-index:0;
  pointer-events:none;
  width:72%;
  height:74%;
  right:-18%;
  bottom:-28%;
  border-radius:50%;
  background:
    radial-gradient(circle,
      rgba(108,77,105,.20) 0%,
      rgba(173,72,40,.12) 42%,
      transparent 70%);
  filter:blur(28px);
  opacity:.78;
  animation:leriauAuroraV22B 19s ease-in-out infinite alternate;
}

.hero-wrap > .wrap{
  position:relative;
  z-index:2;
}

@keyframes leriauAuroraV22{
  0%{
    transform:translate3d(-4%,0,0) scale(1.00) rotate(-1deg);
  }
  50%{
    transform:translate3d(4.5%,3%,0) scale(1.09) rotate(1.2deg);
  }
  100%{
    transform:translate3d(-1%,5.5%,0) scale(1.04) rotate(.2deg);
  }
}

@keyframes leriauAuroraV22B{
  0%{
    transform:translate3d(0,0,0) scale(1);
    opacity:.58;
  }
  50%{
    transform:translate3d(-11%,-7%,0) scale(1.13);
    opacity:.9;
  }
  100%{
    transform:translate3d(-4%,3%,0) scale(1.05);
    opacity:.68;
  }
}

@media(max-width:720px){
  .agency-audience-line{
    flex-wrap:wrap;
    gap:8px 10px;
    font-size:.9rem;
  }
  .hero-wrap::before{
    animation-duration:19s;
    opacity:.78;
  }
  .hero-wrap::after{
    animation-duration:22s;
    opacity:.64;
  }
}

@media(prefers-reduced-motion:reduce){
  .hero-wrap::before,
  .hero-wrap::after{
    animation:none!important;
  }
}


/* =========================================================
   V23 — AGENCE SPACING + HIGH-VISIBILITY HOME MOTION TEST
   ========================================================= */

/* AGENCE — editorial note, not a control. */
.agency-audience-line{display:none!important;}

.agency-audience-note{
  display:flex;
  align-items:baseline;
  flex-wrap:wrap;
  gap:7px;
  margin:26px 0 30px;
  padding:2px 0 2px 15px;
  border-left:3px solid var(--agence);
  color:var(--muted);
  font-size:.96rem;
  line-height:1.5;
}
.agency-audience-note > span{
  font-weight:650;
}
.agency-audience-note strong{
  color:var(--agence-text);
  font-weight:900;
}
.agency-audience-note em{
  font-style:normal;
  font-size:.84rem;
  color:#8C8179;
  font-weight:650;
  padding:0 2px;
}

/* Keep the CTA row clearly separated from the audience note. */
.page-agence .sales-hero .cta-row{
  margin-top:0;
}

/* HOME — intentionally stronger for visual evaluation.
   Once validated, intensity/speed can be reduced without changing the mechanism. */
.hero-wrap::before{
  width:135%;
  height:165%;
  left:-18%;
  top:-32%;
  background:
    radial-gradient(circle at 18% 62%,
      rgba(214,161,38,.46) 0%,
      rgba(214,161,38,.24) 22%,
      transparent 43%),
    radial-gradient(circle at 57% 15%,
      rgba(173,72,40,.40) 0%,
      rgba(173,72,40,.21) 22%,
      transparent 45%),
    radial-gradient(circle at 88% 70%,
      rgba(108,77,105,.42) 0%,
      rgba(108,77,105,.22) 22%,
      transparent 45%);
  filter:blur(18px);
  opacity:.98;
  animation:leriauAuroraV23A 11s ease-in-out infinite alternate!important;
}

.hero-wrap::after{
  width:92%;
  height:100%;
  right:-28%;
  bottom:-42%;
  background:
    radial-gradient(circle at 35% 40%,
      rgba(108,77,105,.30) 0%,
      rgba(108,77,105,.14) 34%,
      transparent 66%),
    radial-gradient(circle at 70% 62%,
      rgba(214,161,38,.20) 0%,
      rgba(173,72,40,.14) 38%,
      transparent 68%);
  filter:blur(24px);
  opacity:.92;
  animation:leriauAuroraV23B 13s ease-in-out infinite alternate!important;
}

@keyframes leriauAuroraV23A{
  0%{
    transform:translate3d(-10%,-5%,0) scale(1.00) rotate(-2deg);
  }
  50%{
    transform:translate3d(10%,6%,0) scale(1.16) rotate(2.2deg);
  }
  100%{
    transform:translate3d(-2%,12%,0) scale(1.08) rotate(.5deg);
  }
}

@keyframes leriauAuroraV23B{
  0%{
    transform:translate3d(7%,4%,0) scale(1.02);
    opacity:.72;
  }
  50%{
    transform:translate3d(-15%,-11%,0) scale(1.20);
    opacity:1;
  }
  100%{
    transform:translate3d(-5%,8%,0) scale(1.10);
    opacity:.82;
  }
}

@media(max-width:720px){
  .agency-audience-note{
    margin:22px 0 26px;
    padding-left:13px;
    font-size:.92rem;
    gap:6px;
  }
  .hero-wrap::before{
    animation-duration:13s!important;
    opacity:.88;
  }
  .hero-wrap::after{
    animation-duration:15s!important;
    opacity:.78;
  }
}

/* Still respect explicit reduced-motion preferences. */
@media(prefers-reduced-motion:reduce){
  .hero-wrap::before,
  .hero-wrap::after{
    animation:none!important;
  }
}


/* =========================================================
   V24 — REAL DOM AURORA / MOTION DIAGNOSTIC
   Previous pseudo-element animations were likely being suppressed
   by the user's reduced-motion preference. V24 uses real decorative
   elements so the motion can be evaluated reliably.
   ========================================================= */

/* Neutralize the accumulated pseudo-element ambience from V20–V23. */
.hero-wrap::before,
.hero-wrap::after{
  display:none!important;
}

/* Keep the approved static background underneath. */
.hero-wrap{
  position:relative;
  overflow:hidden;
  isolation:isolate;
}

/* Real animated colour field. */
.home-aurora{
  position:absolute;
  inset:0;
  overflow:hidden;
  pointer-events:none;
  z-index:0;
}

.aurora-blob{
  position:absolute;
  display:block;
  border-radius:50%;
  filter:blur(62px);
  opacity:.48;
  will-change:transform;
}

.aurora-gold{
  width:46vw;
  height:46vw;
  min-width:620px;
  min-height:620px;
  left:-15vw;
  bottom:-28vw;
  background:rgba(214,161,38,.58);
  animation:auroraGoldV24 9s ease-in-out infinite alternate;
}

.aurora-terra{
  width:43vw;
  height:43vw;
  min-width:580px;
  min-height:580px;
  left:43%;
  top:-30vw;
  background:rgba(173,72,40,.48);
  animation:auroraTerraV24 11s ease-in-out infinite alternate;
}

.aurora-violet{
  width:48vw;
  height:48vw;
  min-width:640px;
  min-height:640px;
  right:-20vw;
  bottom:-25vw;
  background:rgba(108,77,105,.50);
  animation:auroraVioletV24 10s ease-in-out infinite alternate;
}

@keyframes auroraGoldV24{
  0%   { transform:translate3d(-3vw, 2vw, 0) scale(1.00); }
  50%  { transform:translate3d(13vw,-8vw, 0) scale(1.12); }
  100% { transform:translate3d(22vw, 3vw, 0) scale(.98); }
}

@keyframes auroraTerraV24{
  0%   { transform:translate3d(-9vw,-2vw,0) scale(1.04); }
  50%  { transform:translate3d(7vw,12vw,0) scale(.96); }
  100% { transform:translate3d(15vw, 5vw,0) scale(1.13); }
}

@keyframes auroraVioletV24{
  0%   { transform:translate3d(4vw, 1vw,0) scale(1.02); }
  50%  { transform:translate3d(-17vw,-9vw,0) scale(1.14); }
  100% { transform:translate3d(-7vw, 7vw,0) scale(.99); }
}

.hero-wrap > .wrap{
  position:relative;
  z-index:2;
}

/* This V24 diagnostic deliberately does NOT disable the home aurora
   through prefers-reduced-motion, so we can verify whether that setting
   was the reason no motion was visible on the user's machine.
   We can restore an accessible reduced-motion fallback after validation. */

@media(max-width:720px){
  .aurora-blob{
    filter:blur(52px);
    opacity:.40;
  }
  .aurora-gold{animation-duration:11s;}
  .aurora-terra{animation-duration:13s;}
  .aurora-violet{animation-duration:12s;}
}


/* =========================================================
   V25 — PREMIUM LIVING HOME
   Richer base, softer mesh, stronger mobile motion.
   ========================================================= */

/* Replace the too-white hero with a warm premium canvas. */
.hero-wrap{
  position:relative;
  overflow:hidden;
  isolation:isolate;
  background:
    radial-gradient(circle at 12% 18%, rgba(214,161,38,.10), transparent 30%),
    radial-gradient(circle at 86% 18%, rgba(173,72,40,.095), transparent 32%),
    radial-gradient(circle at 88% 82%, rgba(108,77,105,.10), transparent 34%),
    linear-gradient(135deg,#F1E8DE 0%,#F4E9DF 28%,#EEDDD7 61%,#E6DDE5 100%);
}

/* Real animated field; softer edges and more overlap. */
.home-aurora{
  position:absolute;
  inset:-4%;
  overflow:hidden;
  pointer-events:none;
  z-index:0;
}

.home-aurora::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:2;
  pointer-events:none;
  background:
    linear-gradient(115deg,rgba(255,255,255,.22),transparent 34%,rgba(255,255,255,.08) 68%,transparent),
    radial-gradient(circle at 50% 50%,transparent 35%,rgba(57,39,31,.035) 100%);
}

.aurora-blob{
  position:absolute;
  display:block;
  border-radius:50%;
  filter:blur(82px);
  mix-blend-mode:multiply;
  will-change:transform;
}

.aurora-gold{
  width:56vw;
  height:56vw;
  min-width:760px;
  min-height:760px;
  left:-20vw;
  bottom:-32vw;
  background:rgba(214,161,38,.42);
  opacity:.66;
  animation:auroraGoldV25 17s cubic-bezier(.45,.05,.25,1) infinite alternate;
}

.aurora-terra{
  width:52vw;
  height:52vw;
  min-width:720px;
  min-height:720px;
  left:38%;
  top:-35vw;
  background:rgba(173,72,40,.34);
  opacity:.58;
  animation:auroraTerraV25 19s cubic-bezier(.4,.05,.25,1) infinite alternate;
}

.aurora-violet{
  width:58vw;
  height:58vw;
  min-width:780px;
  min-height:780px;
  right:-24vw;
  bottom:-30vw;
  background:rgba(108,77,105,.36);
  opacity:.60;
  animation:auroraVioletV25 18s cubic-bezier(.42,.03,.25,1) infinite alternate;
}

@keyframes auroraGoldV25{
  0%   { transform:translate3d(-3vw, 3vw,0) scale(1.02); }
  50%  { transform:translate3d(15vw,-7vw,0) scale(1.14); }
  100% { transform:translate3d(25vw, 4vw,0) scale(1.05); }
}
@keyframes auroraTerraV25{
  0%   { transform:translate3d(-10vw,-3vw,0) scale(1.06); }
  50%  { transform:translate3d(7vw,12vw,0) scale(.98); }
  100% { transform:translate3d(18vw, 5vw,0) scale(1.13); }
}
@keyframes auroraVioletV25{
  0%   { transform:translate3d(6vw, 2vw,0) scale(1.02); }
  50%  { transform:translate3d(-19vw,-8vw,0) scale(1.16); }
  100% { transform:translate3d(-8vw, 9vw,0) scale(1.04); }
}

/* Give the right-side card a more premium glass treatment. */
.home-hero .brand-stage{
  background:rgba(255,252,249,.74);
  border-color:rgba(255,255,255,.58);
  box-shadow:
    0 28px 70px rgba(54,36,28,.11),
    inset 0 1px 0 rgba(255,255,255,.62);
  backdrop-filter:blur(14px);
}

/* Desktop readability: slightly calmer white surfaces against the richer background. */
.home-hero .lead{
  color:#655C56;
}

/* Mobile is deliberately redesigned, not just shrunk desktop. */
@media(max-width:720px){
  .hero-wrap{
    background:
      radial-gradient(circle at 18% 8%, rgba(214,161,38,.14), transparent 34%),
      radial-gradient(circle at 82% 38%, rgba(173,72,40,.13), transparent 38%),
      radial-gradient(circle at 60% 92%, rgba(108,77,105,.15), transparent 40%),
      linear-gradient(160deg,#EFE4D7 0%,#F1E5DD 42%,#E7DCE6 100%);
  }

  .home-aurora{
    inset:-8% -18%;
  }

  .home-aurora::before{
    background:
      linear-gradient(180deg,rgba(255,255,255,.16),transparent 35%,rgba(255,255,255,.04)),
      radial-gradient(circle at 50% 50%,transparent 36%,rgba(54,38,31,.035) 100%);
  }

  .aurora-blob{
    filter:blur(54px);
    mix-blend-mode:multiply;
  }

  /* Stronger vertical travel so motion is visible on a narrow screen. */
  .aurora-gold{
    width:95vw;
    height:95vw;
    min-width:0;
    min-height:0;
    left:-38vw;
    bottom:-18vw;
    opacity:.62;
    animation:auroraGoldMobileV25 10s ease-in-out infinite alternate!important;
  }

  .aurora-terra{
    width:90vw;
    height:90vw;
    min-width:0;
    min-height:0;
    left:34vw;
    top:-20vw;
    opacity:.56;
    animation:auroraTerraMobileV25 11s ease-in-out infinite alternate!important;
  }

  .aurora-violet{
    width:100vw;
    height:100vw;
    min-width:0;
    min-height:0;
    right:-45vw;
    bottom:4vw;
    opacity:.60;
    animation:auroraVioletMobileV25 10.5s ease-in-out infinite alternate!important;
  }

  @keyframes auroraGoldMobileV25{
    0%   { transform:translate3d(-8vw,16vw,0) scale(1.00); }
    50%  { transform:translate3d(34vw,-10vw,0) scale(1.18); }
    100% { transform:translate3d(14vw,-32vw,0) scale(1.06); }
  }
  @keyframes auroraTerraMobileV25{
    0%   { transform:translate3d(12vw,-20vw,0) scale(1.04); }
    50%  { transform:translate3d(-28vw,28vw,0) scale(1.16); }
    100% { transform:translate3d(-8vw,48vw,0) scale(.98); }
  }
  @keyframes auroraVioletMobileV25{
    0%   { transform:translate3d(18vw,14vw,0) scale(1.02); }
    50%  { transform:translate3d(-38vw,-12vw,0) scale(1.18); }
    100% { transform:translate3d(-16vw,-38vw,0) scale(1.06); }
  }

  .home-hero .brand-stage{
    background:rgba(255,251,248,.72);
    backdrop-filter:blur(12px);
    box-shadow:0 20px 48px rgba(54,36,28,.10);
  }
}

/* Keep motion active in V25 because it is an explicitly requested visual feature.
   Accessibility can still be handled with a site-level toggle later if needed. */


/* V27 — production refinements */

.home-hero .brand-stage{
  background:transparent !important;
  border:none !important;
  box-shadow:none !important;
  backdrop-filter:none !important;
}
.home-hero .brand-stage-inner{
  background:linear-gradient(135deg,rgba(255,255,255,.92),rgba(255,250,246,.88));
  box-shadow:0 24px 62px rgba(54,36,28,.10), inset 0 1px 0 rgba(255,255,255,.65);
  backdrop-filter:blur(12px);
}

.page-agence .branch-hero{
  background:
    radial-gradient(circle at 88% 8%,rgba(214,161,38,.34),transparent 32%),
    radial-gradient(circle at 10% 92%,rgba(214,161,38,.12),transparent 29%),
    linear-gradient(180deg,#FFFDF9 0%,#FBF4E9 100%) !important;
}
.page-industrie .branch-hero{
  background:
    radial-gradient(circle at 88% 8%,rgba(173,72,40,.38),transparent 35%),
    radial-gradient(circle at 10% 92%,rgba(173,72,40,.16),transparent 32%),
    linear-gradient(180deg,#FFFDFB 0%,#FAF0EA 100%) !important;
}
.page-augure .branch-hero{
  background:
    radial-gradient(circle at 88% 8%,rgba(108,77,105,.42),transparent 35%),
    radial-gradient(circle at 10% 92%,rgba(108,77,105,.19),transparent 32%),
    linear-gradient(180deg,#FFFDFF 0%,#F6EDF7 100%) !important;
}
.page-agence .section.alt{
  background:linear-gradient(180deg,#FBF4E7 0%,#FDFBF7 100%) !important;
}
.page-industrie .section.alt{
  background:linear-gradient(180deg,#FAEFEB 0%,#FDFBF9 100%) !important;
}
.page-augure .section.alt{
  background:linear-gradient(180deg,#F7EDF7 0%,#FDFBFD 100%) !important;
}

.nav a:hover,
.nav a.active{
  font-weight:800;
}

.agency-audience-note{
  display:inline-flex;
  align-items:center;
  gap:0;
  margin:22px 0 30px;
  padding:4px 0 4px 16px;
  border-left:3px solid var(--agence);
  color:var(--muted);
  font-size:.98rem;
  line-height:1.45;
}
.agency-audience-note strong{
  color:var(--agence-text);
  font-weight:900;
}
@media(max-width:720px){
  .agency-audience-note{
    margin:20px 0 26px;
    padding-left:14px;
    font-size:.94rem;
  }
}


/* =========================================================
   V28 — SIMPLIFICATION / OFFER SUMMARY REDESIGN
   ========================================================= */

.offer-summary-grid{
  display:grid;
  grid-template-columns:.9fr 1.1fr;
  gap:16px;
  margin-top:28px;
}

.offer-summary-card{
  position:relative;
  min-height:172px;
  padding:24px 24px 22px;
  border-radius:16px;
  border:1px solid color-mix(in srgb,var(--theme) 18%,var(--line));
  overflow:hidden;
}

.offer-summary-card::before{
  content:"";
  position:absolute;
  left:0;right:0;top:0;
  height:4px;
  background:var(--theme);
}

.offer-summary-card.fit{
  background:
    radial-gradient(circle at 100% 0%,color-mix(in srgb,var(--theme) 8%,transparent),transparent 36%),
    #fff;
}

.offer-summary-card.signature{
  background:
    radial-gradient(circle at 100% 0%,color-mix(in srgb,var(--theme) 15%,transparent),transparent 38%),
    color-mix(in srgb,var(--theme) 5%,#fff);
  box-shadow:0 12px 28px color-mix(in srgb,var(--theme) 8%,transparent);
}

.offer-summary-label{
  display:block;
  margin-bottom:12px;
  color:var(--theme);
  font-size:.75rem;
  font-weight:900;
  letter-spacing:.11em;
  text-transform:uppercase;
}

.offer-summary-card h3{
  margin:0 0 9px;
  font-size:1.22rem;
  line-height:1.18;
}

.offer-summary-card p{
  margin:0;
  color:var(--muted);
  font-size:.96rem;
}

.offer-summary-card.signature h3{
  font-size:1.3rem;
}

.target-line,
.offer-strip{
  display:none!important;
}

@media(max-width:820px){
  .offer-summary-grid{
    grid-template-columns:1fr;
  }
  .offer-summary-card{
    min-height:auto;
  }
}


/* =========================================================
   V29 — INDUSTRIE CLARITY + PREMIUM HOME ATMOSPHERE
   ========================================================= */

/* Stronger but cleaner coloured atmospheres on branch pages. */
.page-agence .section.alt{
  background:
    radial-gradient(circle at 6% 10%,rgba(214,161,38,.12),transparent 24%),
    radial-gradient(circle at 94% 88%,rgba(214,161,38,.07),transparent 26%),
    linear-gradient(180deg,#FBF3E4 0%,#FDFBF7 100%) !important;
}
.page-industrie .section.alt{
  background:
    radial-gradient(circle at 8% 12%,rgba(173,72,40,.14),transparent 24%),
    radial-gradient(circle at 92% 86%,rgba(173,72,40,.08),transparent 28%),
    linear-gradient(180deg,#FAEEEA 0%,#FDFBF9 100%) !important;
}
.page-augure .section.alt{
  background:
    radial-gradient(circle at 8% 12%,rgba(108,77,105,.16),transparent 24%),
    radial-gradient(circle at 92% 86%,rgba(108,77,105,.09),transparent 28%),
    linear-gradient(180deg,#F6ECF7 0%,#FDFBFD 100%) !important;
}

/* "Notre rôle" section: cleaner rhythm, richer hierarchy, more readable key words. */
.sales-pillars{
  gap:20px;
}
.sales-pillar{
  min-height:232px;
  padding:30px 28px 26px;
  border-radius:18px;
  border-color:color-mix(in srgb,var(--theme) 16%,var(--line));
  background:
    radial-gradient(circle at 100% 0%,color-mix(in srgb,var(--theme) 10%,transparent),transparent 34%),
    linear-gradient(180deg,rgba(255,255,255,.98) 0%,color-mix(in srgb,var(--theme) 3%,#fff) 100%);
  box-shadow:0 12px 30px color-mix(in srgb,var(--theme) 7%,transparent);
}
.sales-pillar::before{
  height:4px;
  opacity:.95;
}
.sales-pillar .verb{
  margin-bottom:16px;
  color:var(--theme);
}
.sales-pillar h3{
  margin:0 0 12px;
  font-size:1.44rem;
  line-height:1.05;
}
.sales-pillar p{
  font-size:.98rem;
  line-height:1.55;
}
.sales-pillar p strong{
  color:var(--ink);
  font-weight:850;
}

.offer-summary-grid{
  gap:18px;
  margin-top:22px;
}
.offer-summary-card{
  min-height:186px;
  padding:26px 26px 24px;
  border-radius:18px;
  box-shadow:0 12px 28px color-mix(in srgb,var(--theme) 6%,transparent);
}
.offer-summary-card::before{height:5px;opacity:.95;}
.offer-summary-card.fit{
  background:
    radial-gradient(circle at 100% 0%,color-mix(in srgb,var(--theme) 9%,transparent),transparent 36%),
    linear-gradient(180deg,#fff 0%,color-mix(in srgb,var(--theme) 2.8%,#fff) 100%);
}
.offer-summary-card.signature{
  background:
    radial-gradient(circle at 94% 0%,color-mix(in srgb,var(--theme) 18%,transparent),transparent 38%),
    linear-gradient(180deg,color-mix(in srgb,var(--theme) 6%,#fff) 0%,#fff 100%);
}
.offer-summary-card h3{
  font-size:1.32rem;
  line-height:1.12;
  max-width:24ch;
}
.offer-summary-card.signature h3{
  font-size:1.42rem;
}
.offer-summary-card p{
  font-size:.97rem;
  line-height:1.6;
  max-width:52ch;
}
.offer-summary-label{
  margin-bottom:13px;
}

/* Home hero: richer premium animated mesh with more visible motion on desktop and mobile. */
.hero-wrap{
  background:
    radial-gradient(circle at 10% 14%, rgba(214,161,38,.13), transparent 29%),
    radial-gradient(circle at 83% 12%, rgba(173,72,40,.12), transparent 31%),
    radial-gradient(circle at 88% 82%, rgba(108,77,105,.13), transparent 34%),
    linear-gradient(135deg,#EFE3D6 0%,#F3E4D9 27%,#EDD7CE 60%,#E4D9E4 100%);
}
.home-aurora{
  inset:-7%;
  animation:auroraFieldDriftV29 24s ease-in-out infinite alternate;
}
.home-aurora::before,
.home-aurora::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
}
.home-aurora::before{
  background:
    radial-gradient(circle at 22% 28%,rgba(255,255,255,.18),transparent 22%),
    radial-gradient(circle at 78% 24%,rgba(255,255,255,.16),transparent 20%),
    radial-gradient(circle at 50% 68%,rgba(255,255,255,.10),transparent 24%);
  mix-blend-mode:screen;
  opacity:.72;
  animation:auroraVeilV29 18s ease-in-out infinite alternate;
}
.home-aurora::after{
  background:linear-gradient(120deg,rgba(255,255,255,.12),transparent 34%,rgba(255,255,255,.05) 66%,transparent);
  opacity:.55;
}
.aurora-blob{
  filter:blur(74px);
  mix-blend-mode:multiply;
}
.aurora-gold{
  width:62vw; height:62vw; min-width:860px; min-height:860px;
  left:-23vw; bottom:-38vw;
  background:rgba(214,161,38,.48);
  opacity:.72;
  animation:auroraGoldV29 18s cubic-bezier(.45,.05,.25,1) infinite alternate;
}
.aurora-terra{
  width:54vw; height:54vw; min-width:760px; min-height:760px;
  left:34%; top:-34vw;
  background:rgba(173,72,40,.38);
  opacity:.62;
  animation:auroraTerraV29 20s cubic-bezier(.4,.05,.25,1) infinite alternate;
}
.aurora-violet{
  width:60vw; height:60vw; min-width:820px; min-height:820px;
  right:-26vw; bottom:-28vw;
  background:rgba(108,77,105,.41);
  opacity:.66;
  animation:auroraVioletV29 19s cubic-bezier(.42,.03,.25,1) infinite alternate;
}
@keyframes auroraFieldDriftV29{
  0%{ transform:translate3d(0,0,0) scale(1); }
  100%{ transform:translate3d(1.8%,-1.2%,0) scale(1.035); }
}
@keyframes auroraVeilV29{
  0%{ transform:translate3d(-1%,1%,0) scale(1); opacity:.58; }
  100%{ transform:translate3d(1.6%,-1.8%,0) scale(1.05); opacity:.86; }
}
@keyframes auroraGoldV29{
  0%   { transform:translate3d(-4vw, 3vw,0) scale(1.01); }
  50%  { transform:translate3d(14vw,-6vw,0) scale(1.16); }
  100% { transform:translate3d(26vw, 5vw,0) scale(1.07); }
}
@keyframes auroraTerraV29{
  0%   { transform:translate3d(-11vw,-3vw,0) scale(1.04); }
  50%  { transform:translate3d(8vw,12vw,0) scale(.98); }
  100% { transform:translate3d(19vw, 4vw,0) scale(1.14); }
}
@keyframes auroraVioletV29{
  0%   { transform:translate3d(7vw, 2vw,0) scale(1.02); }
  50%  { transform:translate3d(-19vw,-9vw,0) scale(1.18); }
  100% { transform:translate3d(-9vw, 10vw,0) scale(1.05); }
}
.home-hero .brand-stage-inner{
  background:linear-gradient(135deg,rgba(255,255,255,.90),rgba(255,248,243,.82));
  box-shadow:0 28px 72px rgba(54,36,28,.13), inset 0 1px 0 rgba(255,255,255,.72);
  border-color:rgba(234,223,214,.92);
}
@media(max-width:720px){
  .hero-wrap{
    background:
      radial-gradient(circle at 16% 10%, rgba(214,161,38,.18), transparent 34%),
      radial-gradient(circle at 84% 18%, rgba(173,72,40,.16), transparent 36%),
      radial-gradient(circle at 70% 88%, rgba(108,77,105,.19), transparent 40%),
      linear-gradient(160deg,#EEDFCF 0%,#F0E0D6 44%,#E5D8E3 100%);
  }
  .home-aurora{ inset:-14% -18%; animation-duration:18s; }
  .home-aurora::before{ opacity:.82; animation-duration:14s; }
  .aurora-blob{
    filter:blur(42px);
    mix-blend-mode:normal;
  }
  .aurora-gold{
    width:98vw; height:98vw; min-width:0; min-height:0;
    left:-34vw; bottom:-10vw;
    opacity:.70;
    animation:auroraGoldMobileV29 9.2s ease-in-out infinite alternate!important;
  }
  .aurora-terra{
    width:92vw; height:92vw; min-width:0; min-height:0;
    left:28vw; top:-18vw;
    opacity:.62;
    animation:auroraTerraMobileV29 10s ease-in-out infinite alternate!important;
  }
  .aurora-violet{
    width:104vw; height:104vw; min-width:0; min-height:0;
    right:-42vw; bottom:2vw;
    opacity:.68;
    animation:auroraVioletMobileV29 9.6s ease-in-out infinite alternate!important;
  }
  @keyframes auroraGoldMobileV29{
    0%   { transform:translate3d(-10vw,14vw,0) scale(1.00); }
    50%  { transform:translate3d(34vw,-6vw,0) scale(1.18); }
    100% { transform:translate3d(12vw,-30vw,0) scale(1.08); }
  }
  @keyframes auroraTerraMobileV29{
    0%   { transform:translate3d(12vw,-18vw,0) scale(1.04); }
    50%  { transform:translate3d(-30vw,26vw,0) scale(1.16); }
    100% { transform:translate3d(-10vw,44vw,0) scale(1.00); }
  }
  @keyframes auroraVioletMobileV29{
    0%   { transform:translate3d(18vw,12vw,0) scale(1.02); }
    50%  { transform:translate3d(-40vw,-10vw,0) scale(1.18); }
    100% { transform:translate3d(-18vw,-36vw,0) scale(1.08); }
  }
  .home-hero .brand-stage-inner{
    background:linear-gradient(135deg,rgba(255,255,255,.88),rgba(255,249,245,.80));
  }
}

/* =========================================================
   V30 — ULTRA-PROPRE FINISH
   1) Marketing clarity
   2) Final visual balance
   3) Premium details and stronger visible motion
   ========================================================= */

/* --- SELF-SELECTION: make the phrase instantly visible and useful --- */
.self-select{
  position:relative;
}

.self-select .split > div:first-child{
  padding:28px 30px;
  border:1px solid color-mix(in srgb,var(--theme) 16%,var(--line));
  border-radius:22px;
  background:
    radial-gradient(circle at 100% 0%,color-mix(in srgb,var(--theme) 10%,transparent),transparent 34%),
    linear-gradient(180deg,color-mix(in srgb,var(--theme) 4%,#fff) 0%,rgba(255,255,255,.98) 100%);
  box-shadow:0 14px 32px color-mix(in srgb,var(--theme) 6%,transparent);
}

.self-select .eyebrow{
  display:inline-flex;
  align-items:center;
  gap:10px;
  margin:0 0 18px;
  padding:9px 14px;
  border-radius:999px;
  border:1px solid color-mix(in srgb,var(--theme) 18%,var(--line));
  background:color-mix(in srgb,var(--theme) 8%,#fff);
  color:var(--theme);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.72);
}

.self-select .eyebrow::before{
  content:"";
  width:9px;
  height:9px;
  border-radius:50%;
  background:var(--theme);
  box-shadow:0 0 0 6px color-mix(in srgb,var(--theme) 11%,transparent);
}

.self-select .section-title{
  margin-bottom:0;
  max-width:18ch;
}

.self-select .scenario-grid{
  align-items:stretch;
}

.self-select .scenario-card{
  border-color:color-mix(in srgb,var(--theme) 19%,var(--line));
  box-shadow:0 12px 30px color-mix(in srgb,var(--theme) 6%,transparent);
}

/* --- HERO / RESULTS blocks: slightly cleaner and more premium --- */
.sales-hero .hero-visual{
  background:linear-gradient(145deg,rgba(255,255,255,.97),rgba(252,247,244,.94));
  border-color:color-mix(in srgb,var(--theme) 15%,var(--line));
  box-shadow:0 18px 44px color-mix(in srgb,var(--theme) 8%,transparent);
}

.sales-point{
  background:linear-gradient(180deg,rgba(255,255,255,.98) 0%,color-mix(in srgb,var(--theme) 2.8%,#fff) 100%);
  border-color:color-mix(in srgb,var(--theme) 14%,var(--line));
}

/* --- BRANCH PAGE BACKGROUND BALANCE ---
   stronger hero identity, quieter lower section */
.page-agence .branch-hero{
  background:
    radial-gradient(circle at 87% 8%,rgba(214,161,38,.39),transparent 32%),
    radial-gradient(circle at 12% 92%,rgba(214,161,38,.11),transparent 28%),
    linear-gradient(180deg,#FFFDF9 0%,#FBF3E5 100%) !important;
}
.page-industrie .branch-hero{
  background:
    radial-gradient(circle at 87% 8%,rgba(173,72,40,.43),transparent 34%),
    radial-gradient(circle at 12% 92%,rgba(173,72,40,.15),transparent 30%),
    linear-gradient(180deg,#FFFDFC 0%,#F9ECE5 100%) !important;
}
.page-augure .branch-hero{
  background:
    radial-gradient(circle at 87% 8%,rgba(108,77,105,.47),transparent 34%),
    radial-gradient(circle at 12% 92%,rgba(108,77,105,.17),transparent 31%),
    linear-gradient(180deg,#FFFDFE 0%,#F4EAF5 100%) !important;
}

.page-agence .section.alt{
  background:
    radial-gradient(circle at 8% 12%,rgba(214,161,38,.075),transparent 24%),
    radial-gradient(circle at 92% 86%,rgba(214,161,38,.04),transparent 26%),
    linear-gradient(180deg,#FCF8F1 0%,#FDFBF8 100%) !important;
}
.page-industrie .section.alt{
  background:
    radial-gradient(circle at 8% 12%,rgba(173,72,40,.08),transparent 24%),
    radial-gradient(circle at 92% 86%,rgba(173,72,40,.045),transparent 27%),
    linear-gradient(180deg,#FBF4F0 0%,#FDFBF9 100%) !important;
}
.page-augure .section.alt{
  background:
    radial-gradient(circle at 8% 12%,rgba(108,77,105,.09),transparent 24%),
    radial-gradient(circle at 92% 86%,rgba(108,77,105,.05),transparent 27%),
    linear-gradient(180deg,#F8F1F8 0%,#FDFBFD 100%) !important;
}

/* --- SALES PILLARS / OFFER SUMMARY: cleaner hierarchy --- */
.sales-pillar{
  min-height:238px;
  background:
    radial-gradient(circle at 100% 0%,color-mix(in srgb,var(--theme) 8%,transparent),transparent 34%),
    linear-gradient(180deg,rgba(255,255,255,.99) 0%,color-mix(in srgb,var(--theme) 2%,#fff) 100%);
  border-color:color-mix(in srgb,var(--theme) 15%,var(--line));
  box-shadow:0 12px 28px color-mix(in srgb,var(--theme) 6%,transparent);
}

.sales-pillar h3{
  text-wrap:balance;
}

.offer-summary-card{
  border-color:color-mix(in srgb,var(--theme) 16%,var(--line));
}

.offer-summary-card.signature{
  background:
    radial-gradient(circle at 96% 0%,color-mix(in srgb,var(--theme) 15%,transparent),transparent 36%),
    linear-gradient(180deg,color-mix(in srgb,var(--theme) 5%,#fff) 0%,rgba(255,255,255,.99) 100%);
}

/* --- HOME: more premium, less flat, more visibly alive --- */
.hero-wrap{
  background:
    radial-gradient(circle at 12% 12%, rgba(214,161,38,.16), transparent 30%),
    radial-gradient(circle at 82% 12%, rgba(173,72,40,.15), transparent 30%),
    radial-gradient(circle at 88% 82%, rgba(108,77,105,.16), transparent 34%),
    linear-gradient(135deg,#EEE0D2 0%,#F2E2D7 28%,#E9D3C9 58%,#E2D6E2 100%);
}

.home-aurora{
  inset:-12%;
  animation:auroraFieldDriftV30 18s ease-in-out infinite alternate;
}

.home-aurora::before,
.home-aurora::after{
  content:"";
  position:absolute;
  pointer-events:none;
}

.home-aurora::before{
  inset:-8%;
  background:
    conic-gradient(from 215deg at 50% 50%,
      rgba(214,161,38,.22) 0deg,
      rgba(173,72,40,.17) 115deg,
      rgba(108,77,105,.20) 230deg,
      rgba(214,161,38,.18) 360deg);
  filter:blur(105px);
  mix-blend-mode:screen;
  opacity:.72;
  animation:auroraFluxV30 14s ease-in-out infinite alternate;
}

.home-aurora::after{
  inset:-18% -10%;
  background:
    linear-gradient(108deg,
      rgba(214,161,38,.15) 4%,
      rgba(255,255,255,.12) 22%,
      rgba(173,72,40,.13) 46%,
      rgba(255,255,255,.10) 61%,
      rgba(108,77,105,.16) 84%);
  filter:blur(68px);
  mix-blend-mode:soft-light;
  opacity:.80;
  animation:auroraRibbonV30 12s ease-in-out infinite alternate;
}

.aurora-blob{
  filter:blur(88px);
  mix-blend-mode:multiply;
}

.aurora-gold{
  width:64vw; height:64vw; min-width:900px; min-height:900px;
  left:-24vw; bottom:-39vw;
  background:rgba(214,161,38,.52);
  opacity:.78;
  animation:auroraGoldV30 16s cubic-bezier(.46,.08,.26,1) infinite alternate;
}

.aurora-terra{
  width:58vw; height:58vw; min-width:800px; min-height:800px;
  left:31%; top:-36vw;
  background:rgba(173,72,40,.40);
  opacity:.66;
  animation:auroraTerraV30 17.5s cubic-bezier(.42,.05,.24,1) infinite alternate;
}

.aurora-violet{
  width:62vw; height:62vw; min-width:860px; min-height:860px;
  right:-28vw; bottom:-30vw;
  background:rgba(108,77,105,.44);
  opacity:.72;
  animation:auroraVioletV30 16.8s cubic-bezier(.42,.05,.24,1) infinite alternate;
}

.home-hero .brand-stage-inner{
  background:linear-gradient(135deg,rgba(255,255,255,.92),rgba(255,250,247,.84));
  border-color:rgba(238,227,218,.96);
  box-shadow:0 30px 80px rgba(54,36,28,.14), inset 0 1px 0 rgba(255,255,255,.76);
}

@keyframes auroraFieldDriftV30{
  0%{ transform:translate3d(-1.2%,0,0) scale(1); }
  100%{ transform:translate3d(2.4%,-1.8%,0) scale(1.05); }
}
@keyframes auroraFluxV30{
  0%{ transform:translate3d(-2%,2%,0) rotate(-8deg) scale(1); opacity:.58; }
  50%{ transform:translate3d(2.5%,-2.5%,0) rotate(4deg) scale(1.08); opacity:.82; }
  100%{ transform:translate3d(0,3%,0) rotate(10deg) scale(1.03); opacity:.64; }
}
@keyframes auroraRibbonV30{
  0%{ transform:translate3d(-8%,6%,0) skewX(-10deg) scale(1.02); opacity:.58; }
  50%{ transform:translate3d(7%,-4%,0) skewX(-4deg) scale(1.08); opacity:.84; }
  100%{ transform:translate3d(12%,2%,0) skewX(-8deg) scale(1.04); opacity:.66; }
}
@keyframes auroraGoldV30{
  0%{ transform:translate3d(-6vw,4vw,0) scale(1.02); }
  50%{ transform:translate3d(17vw,-7vw,0) scale(1.18); }
  100%{ transform:translate3d(28vw,5vw,0) scale(1.08); }
}
@keyframes auroraTerraV30{
  0%{ transform:translate3d(-12vw,-4vw,0) scale(1.04); }
  50%{ transform:translate3d(10vw,14vw,0) scale(.98); }
  100%{ transform:translate3d(22vw,4vw,0) scale(1.16); }
}
@keyframes auroraVioletV30{
  0%{ transform:translate3d(8vw,2vw,0) scale(1.02); }
  50%{ transform:translate3d(-21vw,-10vw,0) scale(1.20); }
  100%{ transform:translate3d(-10vw,11vw,0) scale(1.06); }
}

@media(max-width:920px){
  .self-select .split > div:first-child{
    padding:24px 24px;
  }
}

@media(max-width:720px){
  .self-select .split > div:first-child{
    padding:22px 22px;
    border-radius:18px;
  }

  .self-select .eyebrow{
    font-size:.76rem;
    padding:8px 12px;
    margin-bottom:16px;
  }

  .self-select .section-title{
    max-width:none;
  }

  .hero-wrap{
    background:
      radial-gradient(circle at 16% 10%, rgba(214,161,38,.22), transparent 34%),
      radial-gradient(circle at 84% 16%, rgba(173,72,40,.19), transparent 37%),
      radial-gradient(circle at 70% 88%, rgba(108,77,105,.22), transparent 42%),
      linear-gradient(160deg,#EEDDCB 0%,#F0DED3 43%,#E3D6E3 100%);
  }

  .home-aurora{
    inset:-18% -20%;
    animation-duration:15s;
  }

  .home-aurora::before{
    inset:-18%;
    filter:blur(72px);
    opacity:.78;
    animation-duration:11s;
  }

  .home-aurora::after{
    inset:-24% -18%;
    filter:blur(44px);
    opacity:.92;
    animation-duration:9.8s;
  }

  .aurora-blob{
    filter:blur(46px);
    mix-blend-mode:normal;
  }

  .aurora-gold{
    width:110vw; height:110vw; min-width:0; min-height:0;
    left:-42vw; bottom:-8vw;
    opacity:.78;
    animation:auroraGoldMobileV30 8.4s ease-in-out infinite alternate!important;
  }
  .aurora-terra{
    width:98vw; height:98vw; min-width:0; min-height:0;
    left:26vw; top:-22vw;
    opacity:.68;
    animation:auroraTerraMobileV30 8.9s ease-in-out infinite alternate!important;
  }
  .aurora-violet{
    width:112vw; height:112vw; min-width:0; min-height:0;
    right:-46vw; bottom:3vw;
    opacity:.74;
    animation:auroraVioletMobileV30 8.6s ease-in-out infinite alternate!important;
  }

  @keyframes auroraGoldMobileV30{
    0%{ transform:translate3d(-12vw,16vw,0) scale(1.00); }
    50%{ transform:translate3d(38vw,-4vw,0) scale(1.22); }
    100%{ transform:translate3d(10vw,-34vw,0) scale(1.10); }
  }
  @keyframes auroraTerraMobileV30{
    0%{ transform:translate3d(14vw,-20vw,0) scale(1.04); }
    50%{ transform:translate3d(-32vw,30vw,0) scale(1.18); }
    100%{ transform:translate3d(-12vw,48vw,0) scale(1.02); }
  }
  @keyframes auroraVioletMobileV30{
    0%{ transform:translate3d(18vw,14vw,0) scale(1.02); }
    50%{ transform:translate3d(-42vw,-12vw,0) scale(1.20); }
    100%{ transform:translate3d(-20vw,-38vw,0) scale(1.09); }
  }
}


/* =========================================================
   V31 — SELF-SELECTION AS THE DECISION GATE
   ========================================================= */

/* The key sentence is now the entry point of the whole section. */
.self-select{
  position:relative;
  padding-top:70px;
  padding-bottom:70px;
  background:#FCFAF8;
}

.self-select-head{
  margin-bottom:24px;
}

.self-select-kicker{
  display:flex;
  align-items:center;
  gap:14px;
  color:var(--theme);
  font-size:clamp(.98rem,1.35vw,1.12rem);
  font-weight:950;
  letter-spacing:.10em;
  text-transform:uppercase;
}

.self-select-kicker::before{
  content:"";
  width:48px;
  height:4px;
  flex:0 0 48px;
  border-radius:999px;
  background:var(--theme);
  box-shadow:0 0 0 7px color-mix(in srgb,var(--theme) 8%,transparent);
}

.self-select-kicker::after{
  content:"";
  height:1px;
  flex:1 1 auto;
  background:linear-gradient(90deg,color-mix(in srgb,var(--theme) 34%,var(--line)),transparent 82%);
}

.self-select-kicker span{
  white-space:nowrap;
}

.self-select-grid{
  display:grid;
  grid-template-columns:minmax(300px,.78fr) minmax(0,1.22fr);
  gap:28px;
  align-items:stretch;
}

.self-select-master{
  position:relative;
  display:flex;
  align-items:center;
  min-height:252px;
  padding:34px 34px 32px;
  border:1px solid color-mix(in srgb,var(--theme) 23%,var(--line));
  border-radius:22px;
  overflow:hidden;
  background:
    radial-gradient(circle at 100% 0%,color-mix(in srgb,var(--theme) 16%,transparent),transparent 34%),
    radial-gradient(circle at 0% 100%,color-mix(in srgb,var(--theme) 7%,transparent),transparent 32%),
    linear-gradient(145deg,color-mix(in srgb,var(--theme) 5%,#fff),#fff 62%);
  box-shadow:0 18px 42px color-mix(in srgb,var(--theme) 9%,transparent);
}

.self-select-master::before{
  content:"";
  position:absolute;
  left:0;
  top:28px;
  bottom:28px;
  width:5px;
  border-radius:0 999px 999px 0;
  background:var(--theme);
}

.self-select-master::after{
  content:"";
  position:absolute;
  width:170px;
  height:170px;
  right:-72px;
  top:-78px;
  border-radius:50%;
  border:1px solid color-mix(in srgb,var(--theme) 18%,transparent);
  box-shadow:0 0 0 34px color-mix(in srgb,var(--theme) 5%,transparent);
}

.self-select-master .section-title{
  position:relative;
  z-index:2;
  margin:0;
  max-width:14ch;
  font-size:clamp(2.15rem,3.35vw,3.15rem);
  line-height:1.06;
  text-wrap:balance;
}

.self-select .scenario-grid{
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
  align-items:stretch;
}

.self-select .scenario-card{
  min-height:252px;
  padding:25px 22px;
  border-color:color-mix(in srgb,var(--theme) 18%,var(--line));
  box-shadow:0 12px 28px color-mix(in srgb,var(--theme) 5%,transparent);
}

.self-select .scenario-card:nth-child(1){
  background:linear-gradient(145deg,#fff,color-mix(in srgb,var(--theme) 3%,#fff));
}
.self-select .scenario-card:nth-child(2){
  background:linear-gradient(145deg,#fff,color-mix(in srgb,var(--theme) 5.5%,#fff));
}
.self-select .scenario-card:nth-child(3){
  background:linear-gradient(145deg,#fff,color-mix(in srgb,var(--theme) 8%,#fff));
}

.self-select .scenario-card::after{
  opacity:.72;
}

.self-select .scenario-card h3{
  font-size:1.08rem;
  line-height:1.28;
  text-wrap:balance;
}

.self-select .scenario-card p{
  line-height:1.55;
}

@media(max-width:920px){
  .self-select-grid{
    grid-template-columns:1fr;
    gap:18px;
  }

  .self-select-master{
    min-height:auto;
    padding:28px 28px 27px;
  }

  .self-select-master .section-title{
    max-width:20ch;
  }
}

@media(max-width:720px){
  .self-select{
    padding-top:52px;
    padding-bottom:44px;
  }

  .self-select-head{
    margin-bottom:18px;
  }

  .self-select-kicker{
    gap:10px;
    font-size:.82rem;
    letter-spacing:.085em;
  }

  .self-select-kicker::before{
    width:30px;
    flex-basis:30px;
    height:3px;
    box-shadow:0 0 0 5px color-mix(in srgb,var(--theme) 7%,transparent);
  }

  .self-select-kicker::after{
    display:none;
  }

  .self-select-kicker span{
    white-space:normal;
  }

  .self-select-master{
    border-radius:18px;
    padding:25px 24px 24px;
    box-shadow:0 14px 32px color-mix(in srgb,var(--theme) 8%,transparent);
  }

  .self-select-master::before{
    top:22px;
    bottom:22px;
    width:4px;
  }

  .self-select-master .section-title{
    max-width:none;
    font-size:clamp(2rem,9vw,2.65rem);
  }

  .self-select .scenario-grid{
    grid-template-columns:1fr;
    gap:11px;
  }

  .self-select .scenario-card{
    min-height:auto;
    padding:21px 21px;
  }
}