/* ============================================================
   pm.css — design system ProprietaireMalin (agent copilote)
   Premium, épuré, lisible. Un seul accent : le vert.
   Utilisé par : home, guides, simulateurs, espace.
   ============================================================ */
:root{
  --green:#2F6B4F; --green-d:#1B4332; --green-h:#265A42;
  --mint:#EAF6EF; --mint-line:#CDE6D6; --gold:#E8B434;
  --ink:#141A17; --ink2:#586158; --ink3:#8A948C;
  --line:#E7EBE8; --line2:#F0F3F1; --bg:#FBFCFB; --card:#FFFFFF;
  --brick:#B23A34; --brick-bg:#FBECEA; --amber:#9A6708; --amber-bg:#FEF3C7; --amber-line:#F0E0B8;
  --r:12px; --r-lg:16px; --r-xl:18px;
  --font:'Inter',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  --wrap:720px;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
body{font-family:var(--font);color:var(--ink);background:var(--bg);font-size:16px;line-height:1.65;-webkit-font-smoothing:antialiased}
a{color:var(--green);text-decoration:none}
img{max-width:100%}
.pm-wrap{max-width:var(--wrap);margin:0 auto;padding:0 22px}

/* Header */
.pm-nav{position:sticky;top:0;z-index:40;background:rgba(251,252,251,.9);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.pm-nav-in{max-width:var(--wrap);margin:0 auto;padding:0 22px;height:58px;display:flex;align-items:center;justify-content:space-between}
.pm-logo{display:flex;align-items:center;gap:9px;font-weight:600;font-size:16px;letter-spacing:-.02em;color:var(--ink)}
.pm-logo b{color:var(--green)}
.pm-logo svg{width:28px;height:28px}
.pm-nav-links{display:flex;align-items:center;gap:18px;font-size:13.5px}
.pm-nav-links a:not(.pm-btn){color:var(--ink2)}
.pm-nav-links a:not(.pm-btn):hover{color:var(--ink)}

/* Buttons */
.pm-btn{display:inline-block;background:var(--green);color:#fff;font-family:inherit;font-weight:600;font-size:15px;padding:12px 22px;border:none;border-radius:var(--r);cursor:pointer;text-align:center;transition:background .15s,transform .1s}
.pm-btn:hover{background:var(--green-h);color:#fff}
.pm-btn:active{transform:scale(.99)}
.pm-btn-sm{padding:8px 15px;font-size:13.5px;border-radius:9px}
.pm-btn-ghost{background:#fff;border:1px solid var(--line);color:var(--ink)}
.pm-btn-ghost:hover{background:var(--bg);border-color:var(--mint-line);color:var(--ink)}
.pm-btn-gold{background:var(--gold);color:#3A2A03}.pm-btn-gold:hover{background:#d9a828;color:#3A2A03}

/* Badges & pills */
.pm-badge{display:inline-flex;align-items:center;gap:7px;background:#fff;border:1px solid var(--mint-line);color:var(--green-d);font-size:12.5px;font-weight:500;padding:5px 13px 5px 9px;border-radius:100px}
.pm-badge .d{width:7px;height:7px;border-radius:50%;background:var(--green);position:relative}
.pm-badge .d::after{content:"";position:absolute;inset:-4px;border-radius:50%;border:1.5px solid var(--green);opacity:.5;animation:pm-pulse 2.2s ease-out infinite}
@keyframes pm-pulse{0%{transform:scale(.5);opacity:.6}100%{transform:scale(1.7);opacity:0}}

/* Typo blocks */
.pm-h1{font-size:clamp(27px,5vw,38px);font-weight:600;letter-spacing:-.035em;line-height:1.1;text-wrap:balance}
.pm-h1 .u{color:var(--green)}
.pm-lead{font-size:18px;color:var(--ink2);line-height:1.55;text-wrap:balance}
.pm-h2{font-size:24px;font-weight:600;letter-spacing:-.02em}
.pm-eyebrow{font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--green)}

/* Cards & grid */
.pm-card{background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg);padding:20px}
.pm-grid{display:grid;gap:14px}
.pm-grid-3{grid-template-columns:repeat(auto-fill,minmax(200px,1fr))}
.pm-grid-2{grid-template-columns:repeat(auto-fill,minmax(240px,1fr))}
.pm-metric .l{font-size:12px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--ink3);margin-bottom:6px}
.pm-metric .v{font-size:24px;font-weight:600;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.pm-metric .s{font-size:12.5px;color:var(--ink2);margin-top:4px}

/* Agent block (le pont vers le SaaS) */
.pm-agent{background:var(--green-d);color:#fff;border-radius:var(--r-xl);padding:26px;position:relative;overflow:hidden}
.pm-agent .rad{position:absolute;top:-30px;right:-30px;width:150px;height:150px;border-radius:50%;border:1px solid rgba(255,255,255,.1)}
.pm-agent .rad::after{content:"";position:absolute;inset:34px;border-radius:50%;border:1px solid rgba(255,255,255,.1)}
.pm-agent .tag{display:inline-flex;align-items:center;gap:7px;font-size:12px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:#F3D07A;margin-bottom:10px;position:relative}
.pm-agent .tag .d{width:7px;height:7px;border-radius:50%;background:var(--gold);animation:pm-blink 1.6s infinite}
@keyframes pm-blink{50%{opacity:.3}}
.pm-agent h3{font-size:20px;font-weight:600;margin-bottom:8px;position:relative}
.pm-agent p{color:rgba(255,255,255,.8);font-size:15px;margin-bottom:16px;position:relative}
.pm-agent .pm-btn{position:relative}

/* FAQ */
.pm-faq details{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:14px 18px;margin-bottom:10px}
.pm-faq summary{font-weight:600;cursor:pointer;font-size:16px;list-style:none;display:flex;justify-content:space-between;align-items:center}
.pm-faq summary::-webkit-details-marker{display:none}
.pm-faq summary::after{content:"+";color:var(--green);font-size:20px;font-weight:400}
.pm-faq details[open] summary::after{content:"–"}
.pm-faq details p{margin:10px 0 0;font-size:15px;color:var(--ink2)}

/* Footer */
.pm-footer{border-top:1px solid var(--line);margin-top:40px;padding:24px 0 40px}
.pm-footer-in{max-width:var(--wrap);margin:0 auto;padding:0 22px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px}
.pm-footer .brand{font-weight:600}.pm-footer .brand b{color:var(--green)}
.pm-footer nav{display:flex;gap:16px;font-size:13px}
.pm-footer nav a{color:var(--ink3)}

/* Utils */
.pm-center{text-align:center}
.pm-mt-s{margin-top:10px}.pm-mt{margin-top:20px}.pm-mt-l{margin-top:34px}
.pm-muted{color:var(--ink3);font-size:12.5px;line-height:1.6}
@media(prefers-reduced-motion:reduce){*{animation:none!important}}
@media(max-width:600px){.pm-nav-links a:not(.pm-btn){display:none}}
