/* _shared.css — landings produits, tarifs, sécurité
   Cohabite avec /index.css (site vitrine). Ne redéfinit pas les tokens racines. */

:root{
  --p-primary: #6d28d9;
  --p-primary-strong: #5b21b6;
  --p-lavender: #ede9fe;
  --p-lavender-2: #f5f3ff;
  --p-ink: #0f172a;
  --p-muted: #64748b;
  --p-border: rgba(15,23,42,.08);
  --p-radius: 16px;
  --p-shadow: 0 12px 32px -14px rgba(76,29,149,.20);
  --p-shadow-hover: 0 20px 45px -14px rgba(76,29,149,.30);
}

*,*::before,*::after{box-sizing:border-box}
html,body{margin:0}
body{
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Inter,system-ui,sans-serif;
  color:var(--p-ink);
  background:linear-gradient(180deg,#faf9ff 0%,#ffffff 40%);
  line-height:1.6;
}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
h1,h2,h3,h4{margin:0 0 .5em;line-height:1.2;letter-spacing:-.02em;color:var(--p-ink)}
p{margin:0 0 1em}

/* ---------- NAV UNIFIÉE ---------- */
.nav{
  position:sticky;top:0;z-index:50;
  display:flex;align-items:center;justify-content:space-between;
  padding:14px 32px;background:rgba(255,255,255,.9);
  backdrop-filter:saturate(180%) blur(12px);
  border-bottom:1px solid var(--p-border);
}
.nav-logo{display:flex;align-items:center;gap:10px;font-weight:700;font-size:1.1rem;color:var(--p-ink)}
.nav-logo small{color:var(--p-primary);font-weight:600}
.nav-links{display:flex;align-items:center;gap:24px;font-size:.94rem;color:#334155}
.nav-links a{transition:color .15s;font-weight:500}
.nav-links a:hover{color:var(--p-primary)}
.nav-links .nav-cta{
  background:var(--p-primary);color:#fff !important;padding:9px 18px;
  border-radius:999px;font-weight:600;
}
.nav-links .nav-cta:hover{background:var(--p-primary-strong)}
@media(max-width:820px){
  .nav{padding:12px 18px}
  .nav-links{gap:14px;font-size:.85rem}
  .nav-links a:not(.nav-cta){display:none}
}

/* ---------- CONTAINERS & HERO ---------- */
.section{max-width:1100px;margin:0 auto;padding:64px 24px}
.hero-p{max-width:1100px;margin:0 auto;padding:72px 24px 40px;text-align:center}
.eyebrow{
  display:inline-block;padding:6px 14px;border-radius:999px;
  background:var(--p-lavender);color:var(--p-primary);
  font-size:.82rem;font-weight:600;letter-spacing:.02em;margin-bottom:18px;
}
.h1-p{font-size:clamp(2rem,4.5vw,3.2rem);font-weight:800;margin-bottom:16px}
.h1-p em{font-style:normal;background:linear-gradient(135deg,var(--p-primary),#a78bfa);-webkit-background-clip:text;background-clip:text;color:transparent}
.lead{font-size:1.1rem;color:var(--p-muted);max-width:680px;margin:0 auto 28px}
.hero-cta{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin-top:20px}

/* ---------- BOUTONS ---------- */
.btn{
  display:inline-flex;align-items:center;gap:8px;
  padding:12px 22px;border-radius:999px;font-weight:600;font-size:.95rem;
  border:1px solid transparent;cursor:pointer;transition:all .15s;
  font-family:inherit;
}
.btn-primary{background:var(--p-primary);color:#fff}
.btn-primary:hover{background:var(--p-primary-strong);transform:translateY(-1px)}
.btn-ghost{background:#fff;color:var(--p-ink);border-color:var(--p-border)}
.btn-ghost:hover{border-color:var(--p-primary);color:var(--p-primary)}
.btn-white{background:#fff;color:var(--p-primary);font-weight:700}
.btn-white:hover{background:var(--p-lavender-2)}

/* ---------- CARDS ---------- */
.grid-3{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px}
.grid-2{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:24px}
.card{
  background:#fff;border:1px solid var(--p-border);border-radius:var(--p-radius);
  padding:26px;box-shadow:var(--p-shadow);transition:transform .18s,box-shadow .18s;
}
.card:hover{transform:translateY(-3px);box-shadow:var(--p-shadow-hover)}
.card h3{font-size:1.15rem}
.card p{color:var(--p-muted);font-size:.94rem;margin:0}
.card-icon{
  width:44px;height:44px;border-radius:12px;
  background:var(--p-lavender);color:var(--p-primary);
  display:flex;align-items:center;justify-content:center;font-size:1.35rem;margin-bottom:14px;
}

/* ---------- PRICING CARDS ---------- */
.price-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:22px;margin:32px 0}
.price-card{
  background:#fff;border:1px solid var(--p-border);border-radius:20px;
  padding:32px;box-shadow:var(--p-shadow);position:relative;
}
.price-card.featured{border-color:var(--p-primary);border-width:2px}
.price-card .price-badge{
  position:absolute;top:-12px;right:24px;background:var(--p-primary);color:#fff;
  padding:4px 12px;border-radius:999px;font-size:.75rem;font-weight:600;
}
.price-name{font-size:1.4rem;font-weight:800;margin-bottom:4px}
.price-tag{font-size:2.4rem;font-weight:800;color:var(--p-primary);margin:10px 0}
.price-tag span{font-size:.9rem;color:var(--p-muted);font-weight:500}
.price-desc{color:var(--p-muted);font-size:.95rem;margin-bottom:20px}
.price-list{list-style:none;padding:0;margin:0 0 24px}
.price-list li{padding:8px 0;padding-left:26px;position:relative;color:#334155;font-size:.94rem}
.price-list li::before{content:"✓";position:absolute;left:0;color:var(--p-primary);font-weight:700}

/* ---------- TABLE ---------- */
.tbl-wrap{overflow-x:auto;margin:24px 0}
.tbl{width:100%;border-collapse:collapse;background:#fff;border-radius:var(--p-radius);overflow:hidden;box-shadow:var(--p-shadow)}
.tbl th,.tbl td{padding:14px 18px;text-align:left;border-bottom:1px solid var(--p-border);font-size:.94rem}
.tbl th{background:var(--p-lavender-2);color:var(--p-ink);font-weight:700;font-size:.88rem;text-transform:uppercase;letter-spacing:.03em}
.tbl tr:last-child td{border-bottom:none}
.tbl td.check{color:var(--p-primary);font-weight:700}
.tbl td.dash{color:#cbd5e1}

/* ---------- FAQ ---------- */
.faq-list{display:flex;flex-direction:column;gap:10px;max-width:820px;margin:0 auto}
.faq-list details{
  background:#fff;border:1px solid var(--p-border);border-radius:12px;
  padding:16px 20px;transition:border-color .15s;
}
.faq-list details[open]{border-color:var(--p-primary)}
.faq-list summary{cursor:pointer;font-weight:600;font-size:.98rem;list-style:none;display:flex;justify-content:space-between;align-items:center}
.faq-list summary::after{content:"+";color:var(--p-primary);font-size:1.4rem;font-weight:400;transition:transform .2s}
.faq-list details[open] summary::after{transform:rotate(45deg)}
.faq-list details p{margin-top:12px;color:var(--p-muted);font-size:.94rem}

/* ---------- TRUST BADGES ---------- */
.trust-strip{
  display:flex;flex-wrap:wrap;justify-content:center;gap:24px;
  padding:22px;background:var(--p-lavender-2);border-radius:var(--p-radius);
  margin:32px auto;max-width:900px;color:#475569;font-size:.9rem;
}
.trust-strip span{display:inline-flex;align-items:center;gap:8px}

/* ---------- CTA BAND (fond violet, texte blanc lisible) ---------- */
.cta-band{
  max-width:1000px;margin:80px auto 40px;padding:56px 32px;text-align:center;
  background:linear-gradient(135deg,var(--p-primary) 0%,#8b5cf6 100%);
  border-radius:24px;color:#ffffff;box-shadow:var(--p-shadow-hover);
}
.cta-band h2{color:#ffffff !important;font-size:clamp(1.5rem,3vw,2rem);font-weight:800;margin-bottom:10px}
.cta-band p{color:rgba(255,255,255,.92) !important;margin-bottom:24px;font-size:1.05rem}
.cta-band .btn-white,
.cta-band a.btn{background:#ffffff !important;color:var(--p-primary) !important;font-weight:700}
.cta-band .btn-white:hover,
.cta-band a.btn:hover{background:var(--p-lavender-2) !important;transform:translateY(-1px)}

/* ---------- SITE FOOTER 4 COLONNES ---------- */
.site-footer{
  margin-top:60px;background:#0f0a1e;color:#cbd5e1;padding:48px 24px 24px;
}
.foot-grid{
  max-width:1100px;margin:0 auto;
  display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:32px;
}
@media(max-width:780px){.foot-grid{grid-template-columns:1fr 1fr;gap:24px}}
@media(max-width:480px){.foot-grid{grid-template-columns:1fr}}
.site-footer .footer-brand{display:flex;align-items:center;gap:10px;color:#fff;font-weight:700;font-size:1.05rem}
.site-footer .footer-brand small{color:#a78bfa;font-weight:600}
.foot-tag{margin-top:10px;color:#94a3b8;font-size:.9rem;max-width:280px}
.site-footer h4{color:#fff;font-size:.82rem;text-transform:uppercase;letter-spacing:.06em;margin-bottom:14px}
.site-footer ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:8px}
.site-footer a{color:#cbd5e1;font-size:.9rem;transition:color .15s}
.site-footer a:hover{color:#a78bfa}
.foot-bar{
  max-width:1100px;margin:32px auto 0;padding-top:20px;
  border-top:1px solid rgba(255,255,255,.08);
  text-align:center;color:#94a3b8;font-size:.82rem;
}


/* ---------- CTA CONTACT (bouton blanc lisible dans .cta-band) ---------- */
.cta-band .btn-contact{
  background:#ffffff !important;
  color:var(--p-primary) !important;
  border:2px solid #ffffff !important;
  font-weight:700;
  padding:14px 26px;font-size:1rem;
}
.cta-band .btn-contact:hover{
  background:var(--p-lavender-2) !important;
  color:var(--p-primary-strong) !important;
}

/* ---------- Compat: masquer l'ancien header/footer ressources ---------- */
nav.res-nav, footer.res-foot{display:none !important}