/* Page publique : une lecture éditoriale, illustrée par les agents originaux. */
:root{--paper:#f5f3ed;--cream:#fffcf6;--card:#fffefa;--muted:#67645c;--line:#ded8cc;--mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
html{scroll-behavior:smooth;scroll-padding-top:28px}
body{background-image:none}
.wrap{max-width:1240px;padding:0 36px}
header{padding:27px 0;border-bottom:1px solid var(--line)}
.brand{letter-spacing:.06em}
.brand small{font-size:9px;letter-spacing:.12em}
.site-nav{display:flex;gap:28px;align-items:center;font-size:12px;font-weight:650}
.site-nav a{text-decoration:none;color:var(--muted)}
.site-nav a:hover{color:var(--red)}
.btn{border-radius:5px;font-size:13px;box-shadow:2px 2px 0 var(--ink);padding:12px 18px}
header .btn{padding:9px 14px;font-size:12px;background:transparent}
.hero{grid-template-columns:minmax(0,1fr) minmax(0,1.06fr);gap:54px;padding:88px 0 70px}
.hero .eyebrow{font-size:9px;letter-spacing:.14em;line-height:1.8}
.hero h1{font-family:Georgia,'Times New Roman',serif;font-weight:400;font-size:clamp(36px,4.4vw,59px);line-height:1.08;letter-spacing:-.055em;margin:20px 0 24px}
.hero h1 em{font-weight:400;color:var(--red)}
.hero .lead{font-size:15px;line-height:1.85;max-width:42ch}
.cta{align-items:center;gap:14px 20px;margin-top:28px}
.text-link{font-size:11.5px;font-weight:700;text-decoration:none;padding:9px 0}
.text-link:hover{text-decoration:underline;text-underline-offset:4px}
.text-link span{margin-left:6px;color:var(--red)}
.hero-note{font-size:11px;color:var(--muted);margin-top:18px}
.hero-note span{color:var(--green);font-weight:900;margin-right:5px}
.hero-preview{background:#e9e2d3;border:1px solid #d1c7b5;border-radius:12px;padding:17px;box-shadow:8px 10px 0 #e9e4d8;transform:rotate(-1deg)}
.preview-head{display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:11px;font-weight:750;margin:0 2px 14px}
.preview-head>span{display:flex;align-items:center;gap:8px}
.preview-dot{width:7px;height:7px;border-radius:50%;background:var(--green)}
.preview-head button{padding:4px 9px;border:1px solid #bcb29e;border-radius:4px;background:transparent;font:inherit;font-size:10px;cursor:pointer}
.scene-slot{border:2px solid var(--ink);box-shadow:2px 2px 0 var(--ink);border-radius:4px;overflow:hidden}
.preview-work{display:flex;align-items:center;gap:12px;background:var(--cream);border:1px solid var(--line);border-radius:7px;padding:16px 14px;margin-top:15px}
.preview-check{display:grid;place-items:center;flex:none;width:32px;height:32px;border-radius:7px;background:#e7eddf;color:#48694c;font-weight:900}
.preview-work>div{flex:1;min-width:0}
.preview-work .eyebrow{font-size:8px;display:block;margin-bottom:3px}
.preview-work b{display:block;font-size:12px}
.preview-work p{font-size:10px;color:var(--muted);margin-top:2px}
.preview-work .tag{font-size:8px;letter-spacing:.04em;border:0;border-radius:4px;background:#f2e4c0;color:#846126;padding:4px 6px}
.preview-caption{font-size:9px;color:var(--muted);text-align:center;margin-top:11px}
.integrations{padding:18px 0 30px;border-bottom:1px solid var(--line);text-align:center}
.integrations>span{font-size:9px;text-transform:uppercase;letter-spacing:.13em;color:var(--muted)}
.integrations>div{display:flex;justify-content:center;flex-wrap:wrap;gap:18px 35px;margin-top:19px}
.integrations b{font-size:15px;letter-spacing:-.03em;color:#55564f;font-weight:750}
section{padding:55px 0}
section>h2,.faq h2{font-family:Georgia,'Times New Roman',serif;font-weight:400;font-size:34px;letter-spacing:-.035em;line-height:1.2;margin:12px 0 26px}
.promise{display:grid;grid-template-columns:1fr 2fr;gap:45px;padding:32px 36px;margin:42px 0 10px;border:0;border-radius:10px;background:var(--ink);box-shadow:none;color:var(--cream)}
.promise .eyebrow{color:var(--gold);font-size:9px;margin-bottom:10px}
.promise h2{font-family:Georgia,'Times New Roman',serif;font-size:27px;font-weight:400;color:var(--cream);text-transform:none;letter-spacing:-.025em;line-height:1.2}
.promise ul{list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;padding:0;margin:0;align-items:start}
.promise li{font-size:12px;line-height:1.6}
.promise li strong{display:block;font-size:12px;margin-bottom:7px;color:#f8edcf}
.promise li span{display:block;color:#c0bdb4;font-size:11px;line-height:1.7}
#agents .grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.card{border:1px solid var(--line);border-radius:10px;box-shadow:none;padding:23px;background:var(--cream)}
.agent{position:relative;gap:10px;align-content:start;padding-top:24px;padding-bottom:24px;transition:transform .16s,border-color .16s}
.agent:hover{transform:translateY(-3px);border-color:#b2a58e}
.agent-head{align-items:center;margin-top:4px}
.agent-head h3{font-family:Georgia,'Times New Roman',serif;font-size:24px;font-weight:400;letter-spacing:-.025em}
.agent .fonction{font-size:9px;letter-spacing:.1em;line-height:1.7}
.agent p{font-size:12px;line-height:1.8}
.tag{border:0;border-radius:4px;font-size:8px;letter-spacing:.06em;padding:3px 6px;background:#edf0e5}
.tag.ok{color:#426348}
.tag.soon{background:#ece9e2;color:#716b62}
.landing-portrait{width:42px;height:50px;image-rendering:pixelated;position:absolute;top:17px;right:21px}
.agent .agent-head{padding-top:43px}
.outils .card{border:1px solid var(--line);background:transparent}
.outils h3{font-size:16px;letter-spacing:-.02em}
.outils .fonction{font-size:9px;letter-spacing:.1em;color:#4c7157}
.outils p{font-size:12px;line-height:1.85}
#fonctionnement{border-top:1px solid var(--line);margin-top:12px}
.steps{gap:0;border:1px solid var(--line);border-radius:10px;overflow:hidden}
.step{border:0;border-right:1px solid var(--line);background:var(--cream);padding:26px;gap:14px;align-content:start}
.step:last-child{border-right:0}
.step:before{background:#f0e2bc;border:0;border-radius:5px;font:15px var(--mono);width:31px;height:31px;margin-bottom:4px}
.step h3{font-size:16px;letter-spacing:-.02em}
.step p{font-size:12px;line-height:1.8}
.never .card{border:1px solid var(--line);border-top:3px solid #b47363;box-shadow:none}
.never h3{font-size:14px;margin-bottom:12px}
.never p{font-size:12px;line-height:1.8}
.faq{display:grid;grid-template-columns:1fr 1.45fr;gap:55px;border-top:1px solid var(--line);margin-top:15px}
.faq h2{margin-bottom:13px}
.faq .muted{font-size:12px;max-width:30ch;line-height:1.8}
.faq details{border-bottom:1px solid var(--line);padding:0 0 18px;margin-bottom:20px}
.faq summary{font-weight:700;font-size:13px;cursor:pointer;line-height:1.7;list-style:none;display:flex;justify-content:space-between;gap:20px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:'+';font-size:19px;font-weight:400;color:var(--red);line-height:1.2}
.faq details[open] summary::after{content:'−'}
.faq details p{font-size:12px;color:var(--muted);line-height:1.9;margin-top:13px}
.faq details a{display:inline-block;font-size:12px;margin-top:12px;color:var(--red)}
.formation{border:1px solid #d7c69c;background:#efe5cb;border-radius:10px;box-shadow:none;padding:32px}
.formation h2{font-family:Georgia,'Times New Roman',serif;font-size:29px;font-weight:400;letter-spacing:-.025em;margin-bottom:12px}
.formation p{font-size:12px;line-height:1.8;max-width:68ch}
footer{border-top:1px solid var(--line);font-size:10px;padding:24px 0 36px;gap:18px;line-height:1.7}
footer>span:first-child{max-width:46ch}
footer a{text-underline-offset:3px}
a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid #466b82;outline-offset:4px}
@media(max-width:1000px){.hero{gap:30px}.wrap{padding:0 25px}.site-nav{gap:18px}.promise{grid-template-columns:1fr;gap:24px}.promise h2 br{display:none}.hero-preview{padding:12px}.preview-work{padding:12px 9px;gap:8px}.preview-work .tag{display:none}}
@media(max-width:720px){
  .wrap{padding:0 20px}.site-nav{display:none}header{padding:20px 0}
  .hero{grid-template-columns:1fr;padding:48px 0 38px;gap:35px}.hero h1{font-size:46px;max-width:13ch;margin:17px 0 20px}.hero .lead{font-size:14px;max-width:44ch}
  .hero-preview{max-width:560px;transform:none;padding:14px;box-shadow:5px 5px 0 #e9e4d8}.preview-work .tag{display:inline-flex}
  .integrations{padding-top:14px}.integrations>div{gap:14px 24px}.integrations b{font-size:13px}
  section{padding:35px 0}section>h2,.faq h2{font-size:29px}.promise{padding:26px;margin-top:30px}.promise ul{grid-template-columns:1fr;gap:20px}.promise li strong{margin-bottom:4px}
  #agents .grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.agent{padding:18px}.agent-head{align-items:flex-start;flex-wrap:wrap;gap:8px}.agent .fonction{font-size:8px}.agent p{font-size:11.5px}
  .outils,.steps,.never{grid-template-columns:1fr}.step{border-right:0;border-bottom:1px solid var(--line);padding:24px}.step:last-child{border-bottom:0}
  .faq{grid-template-columns:1fr;gap:22px}.faq .muted{max-width:none}.formation{padding:26px}.formation h2{font-size:27px}.formation .btn{justify-self:start}
}
@media(max-width:380px){.hero h1{font-size:39px}#agents .grid{grid-template-columns:1fr}.preview-work .tag{display:none}.wrap{padding:0 16px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.agent{transition:none}.agent:hover{transform:none}}
