@font-face{
  font-family:"DM Sans";
  src:url("../fonts/dm-sans-variable.ttf") format("truetype");
  font-style:normal;
  font-weight:100 1000;
  font-display:swap;
}
:root{
  --evergreen:#0c1d15;
  --eggshell:#f5f2e1;
  --pollen:#ffce3b;
  --teal:#97af9a;
  --tangerine:#d64933;
  --tangerine-ink:#a52f20;
  --white:#fffdf4;
  --line:rgba(12,29,21,.18);
  --line-light:rgba(245,242,225,.2);
  --accent:var(--pollen);
  --page:min(1180px,calc(100vw - 48px));
  --font:"DM Sans",ui-sans-serif,system-ui,"Segoe UI",sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--eggshell);color:var(--evergreen);font:400 16px/1.6 var(--font);-webkit-font-smoothing:antialiased}
body[data-audience="industry"]{--accent:var(--pollen)}
body[data-audience="ecosystem"]{--accent:var(--teal)}
img{display:block;max-width:100%}
a{color:inherit}
.shell{width:var(--page);margin-inline:auto}
.skip-link{position:fixed;left:16px;top:12px;z-index:100;transform:translateY(-160%);padding:10px 16px;background:var(--pollen);border-radius:999px;font-weight:800;text-decoration:none}
.skip-link:focus{transform:none}
.button:focus-visible,.back-link:focus-visible{outline:3px solid var(--pollen);outline-offset:4px}
.nav-cta{padding:9px 14px;border:1px solid var(--line-light);border-radius:5px}
.persona-hero{position:relative;overflow:hidden;min-height:92vh;display:flex;align-items:center;padding:150px 0 90px;background:var(--evergreen);color:var(--eggshell)}
.persona-hero::before{content:"";position:absolute;right:-12vw;top:8vh;width:min(52vw,680px);aspect-ratio:1;border:clamp(40px,8vw,110px) solid var(--accent);border-radius:50%;opacity:.96}
.persona-hero::after{content:"";position:absolute;right:10vw;bottom:-15vh;width:210px;aspect-ratio:1;background:var(--tangerine);transform:rotate(22deg);opacity:.82}
.persona-hero-grid{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1fr) 210px;gap:70px;align-items:end}
.eyebrow{margin:0 0 24px;color:var(--accent);font-size:.75rem;font-weight:850;letter-spacing:.14em;text-transform:uppercase}
h1{max-width:900px;margin:0;font-size:clamp(3.2rem,7.5vw,7.4rem);font-weight:760;line-height:.91;letter-spacing:-.07em}
.hero-intro{max-width:650px;margin:32px 0 0;color:rgba(245,242,225,.7);font-size:clamp(1.05rem,1.7vw,1.3rem)}
.audience-index{font-size:clamp(5rem,13vw,10rem);font-weight:800;line-height:.8;letter-spacing:-.08em;color:var(--accent)}
.back-link{display:inline-flex;align-items:center;gap:10px;margin-top:38px;color:var(--eggshell);font-weight:800;text-decoration:none}
/* En pied de page, le retour est sur fond clair : il ne peut pas rester creme. */
.back-shell{padding:44px 0}
.back-link--foot{margin-top:0;color:var(--evergreen)}
.back-link:hover{text-decoration:underline;text-underline-offset:5px}
.arguments{padding:118px 0}
.arguments-head{display:grid;grid-template-columns:.75fr 1.25fr;gap:70px;align-items:start}
.arguments h2,.next-step h2{margin:0;font-size:clamp(2.4rem,5vw,5rem);line-height:.98;letter-spacing:-.06em}
.arguments-lead{max-width:640px;margin:0;color:rgba(12,29,21,.68);font-size:1.13rem}
.argument-grid{display:grid;grid-template-columns:repeat(3,1fr);margin-top:76px;border-top:1px solid var(--line)}
.argument{min-height:250px;padding:24px 24px 24px 0;border-bottom:1px solid var(--line)}
.argument+ .argument{padding-left:24px;border-left:1px solid var(--line)}
.argument span{display:block;color:var(--tangerine-ink);font-size:.72rem;font-weight:850;letter-spacing:.13em;text-transform:uppercase}
.argument h3{margin:70px 0 10px;font-size:clamp(1.5rem,2.4vw,2.35rem);line-height:1;letter-spacing:-.045em}
.argument p{margin:0;color:rgba(12,29,21,.68)}
/* Reponses concretes : ce qu'un proprietaire demande avant tout le reste.
   Le dernier item porte .fact--open, pour une question sans reponse assumee. */
.facts{padding:0 0 118px}
.facts h2{margin:0 0 18px;font-size:clamp(2rem,4vw,3.6rem);line-height:1;letter-spacing:-.05em}
.facts-lead{max-width:620px;margin:0 0 54px;color:rgba(12,29,21,.68);font-size:1.05rem}
.fact-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;background:var(--line)}
.fact{padding:32px;background:var(--eggshell)}
.fact h3{margin:0 0 10px;font-size:1.22rem;line-height:1.2;letter-spacing:-.03em}
.fact p{margin:0;color:rgba(12,29,21,.7);font-size:.95rem}
.fact--open{background:rgba(214,73,51,.07)}
.fact--open h3{color:var(--tangerine-ink)}
/* Le pilote en deux colonnes : ce que chacun met sur la table. */
.share-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:44px;margin-top:40px}
.share h3{margin:0 0 16px;font-size:.74rem;font-weight:850;letter-spacing:.13em;text-transform:uppercase}
.share ul{margin:0;padding:0;list-style:none}
.share li{padding:11px 0;border-top:1px solid rgba(12,29,21,.22);font-size:.95rem;font-weight:700}
.share-note{max-width:640px;margin:44px 0 0;padding-top:22px;border-top:2px solid rgba(12,29,21,.28);color:rgba(12,29,21,.74);font-size:.95rem}
.cta-actions{display:flex;flex-wrap:wrap;align-items:center;gap:14px}
.button--ghost{border-color:rgba(245,242,225,.4);background:transparent;color:var(--eggshell)}
.button--ghost:hover{border-color:var(--eggshell);background:rgba(245,242,225,.1)}
.next-step{padding:108px 0;background:var(--accent)}
.next-step-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:70px;align-items:end}
.next-copy{max-width:560px;margin:0;color:rgba(12,29,21,.72);font-size:1.12rem}
.next-list{display:flex;flex-wrap:wrap;gap:10px;margin-top:36px}
.next-list span{padding:8px 13px;border:1px solid rgba(12,29,21,.25);border-radius:999px;font-size:.8rem;font-weight:760}
.persona-cta{padding:110px 0;background:var(--evergreen);color:var(--eggshell)}
.persona-cta-grid{display:flex;align-items:end;justify-content:space-between;gap:60px}
.persona-cta h2{max-width:780px;margin:0;font-size:clamp(2.5rem,5.5vw,5.4rem);line-height:.95;letter-spacing:-.06em}
.button{min-height:52px;display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:12px 19px;border-radius:5px;background:var(--pollen);color:var(--evergreen);font-weight:850;text-decoration:none;white-space:nowrap;transition:transform .2s ease,background .2s ease}
.button:hover{transform:translateY(-3px);background:var(--white)}
@media(max-width:850px){
  :root{--page:calc(100% - 30px)}
  .persona-hero{min-height:auto;padding:132px 0 82px}
  .persona-hero-grid{grid-template-columns:1fr}
  .audience-index{display:none}
  .persona-hero::before{right:-50vw;top:15vh;width:120vw;opacity:.3}
  .arguments,.next-step,.persona-cta{padding:82px 0}
  .arguments-head,.next-step-grid{grid-template-columns:1fr;gap:28px}
  .argument-grid{grid-template-columns:1fr;margin-top:52px}
  .argument{min-height:190px;padding:24px 0}
  .argument+ .argument{padding-left:0;border-left:0}
  .argument h3{margin-top:42px}
  .persona-cta-grid{align-items:flex-start;flex-direction:column}
  .facts{padding-bottom:82px}
  .fact-grid,.share-grid{grid-template-columns:1fr}
  .share-grid{gap:34px}
  .fact{padding:26px 0}
  .cta-actions{width:100%;flex-direction:column;align-items:stretch}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{transition-duration:.01ms!important}
}