/* ==========================================================================
   SOS Prescription — Design System (GeneratePress child theme)
   
   - Tokens : :root (Source de Vérité)
   - App CSS : body.sp-app { ... }
   - Marketing CSS : body.sp-mkt / .sp-mkt-* uniquement (anti-régression)
   ========================================================================== */

/* 00 — Tokens (Source de Vérité) */
:root{
  /* Brand / Core */
  --sp-main:#383C93;
  --sp-action:#4F46E5;
  --sp-success:#10B981;
  --sp-bg:#FFFFFF;

  /* Text */
  --sp-text:#111827;
  --sp-text-muted:#6B7280;

  /* Borders / Radius / Shadow */
  --sp-border:#E5E7EB;
  /* v1.2 — SaaS Premium (boutons arrondis) */
  --sp-radius:16px;
  --sp-radius-card:16px;
  --sp-shadow:0 1px 2px rgba(0,0,0,.06);
  --sp-shadow-md:0 10px 24px rgba(17,24,39,.10);
  --sp-shadow-lg:0 24px 60px rgba(17,24,39,.12);

  /* Typography (v1.2 — SaaS Premium) */
  --sp-font-sans: "Inter", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  --sp-font-logo:"Plus Jakarta Sans",var(--sp-font-sans);

  /* Compat: GeneratePress Site Library (Agency) + GenerateBlocks */
  /* Ces variables sont des alias (fallback) pour les contenus importés (Agency). */
  --accent: var(--sp-main);
  --accent-2: var(--sp-main);
  --accent-3: var(--sp-main);
  --accent-4: rgba(56,60,147,.04);
  --accent-5: rgba(56,60,147,.08);
  --base: var(--sp-bg);
  --base-2: #F8FAFC;
  --base-3: var(--sp-bg);
  --contrast-2: var(--sp-text);
  /* Agency utilise contrast-3 pour des titres/quotes : on le mappe sur un ink solide */
  --contrast-3: var(--sp-text);
  --gb-container-width: 1200px;
  --container-width: 1200px;
  --container-padding: 24px;
}

/* --------------------------------------------------------------------------
   Utilities (stable classes for patterns)
   -------------------------------------------------------------------------- */

.rounded-16{
  border-radius:16px !important;
}

.shadow-soft{
  box-shadow:var(--sp-shadow-md) !important;
}

/* =====================================================================
   v1.3.9 — Hard-CSS (Anti-GB dependency)
   But : préserver le rendu "logiciel" même si GenerateBlocks CSS est absent.
   ===================================================================== */

/* Footer : grille 3 colonnes (Vision | Liens | Légal) */
.sp-footer-area__grid{
  display:grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap:2rem;
}

/* Sidebar App : empilement cohérent des widgets, sans dépendre du markup GB */
.sp-app-sidebar{
  display:flex;
  flex-direction:column;
  gap:40px;
}

@media (max-width: 960px){
  .sp-footer-area__grid{
    grid-template-columns:1fr;
  }
}

/* ==========================================================================
   SOS — Agency SOS (SaaS Premium)
   Objectif :
   - Boutons plus "SaaS" (dégradé léger + glow, typographie plus fine)
   - Sidebar App aérée (cards légères, spacing)
   - Sections marketing dynamiques (diagonales Agency-like via variables)
   ========================================================================== */

/* Marketing : canvas (Agency-like). */
body.sp-mkt{
  background: var(--base-2);
  font-family: var(--sp-font-sans);
  color: var(--sp-text);
}

/* Menu principal (GeneratePress) — force typographie SOS (évite héritage preset Agency). */
body.sp-mkt #site-navigation,
body.sp-mkt .main-navigation{
  font-family: var(--sp-font-sans) !important;
}
body.sp-mkt #site-navigation a,
body.sp-mkt .main-navigation a{
  font-family: var(--sp-font-sans) !important;
  font-weight: 600;
  letter-spacing: .01em;
}

body.sp-mkt :where(h1, h2, h3, h4, h5, h6),
body.sp-app :where(h1, h2, h3, h4, h5, h6){
  font-family: var(--sp-font-logo);
  font-weight: 700;
}

/* 01 — Scoping + alias (variables plugin -> tokens thème) */
body.sp-app{
  font-family:var(--sp-font-sans);
  color:var(--sp-text);

  /* Master Plan Landing-First : bascule en fond blanc pur dès l'entrée dans l'App. */
  background:var(--sp-bg);

  /* Aliases attendus par le plugin */
  --sp-primary:var(--sp-main);
  --sp-primary-ink:var(--sp-main);
  --sp-ink:var(--sp-text);
  --sp-muted:var(--sp-text-muted);
  --sp-radius:var(--sp-radius-card);
}

/* Focus (vérification pharmacien) : fond neutre */
body.sp-app.sp-verify{ background:var(--sp-bg); }

/* 10 — Base / Normalize (scopé) */
body.sp-app a{
  color:var(--sp-main);
  text-decoration:none;
}
body.sp-app a:hover{
  text-decoration:underline;
}

/* Branding: ne jamais souligner le lien Home/Logo (même si on souligne les liens ailleurs). */
body.sp-app .inside-header a[rel="home"],
body.sp-mkt .inside-header a[rel="home"],
.site-logo a,
.site-title a{
  text-decoration: none;
}
body.sp-app .inside-header a[rel="home"]:hover,
body.sp-mkt .inside-header a[rel="home"]:hover,
.site-logo a:hover,
.site-title a:hover{
  text-decoration:none !important;
}

body.sp-app .sp-muted{
  color:var(--sp-text-muted);
}

body.sp-app .sp-small{
  font-size:0.875rem;
  color:var(--sp-text-muted);
}


body.sp-app .sp-container{
  max-width:1200px;
  margin:0 auto;
  padding:24px 18px;
}

/* Surface (fond) pour les pages App afin de retrouver le "panel" blanc du template Agency */
body.sp-app .sp-app-surface{
  background:transparent;
  border:0;
  border-radius:0;
  box-shadow:none;
  padding:0;
}

@media(max-width:768px){
  body.sp-app .sp-app-surface{
    padding:0;
  }
}

/* 11 — GeneratePress cleanup (sur vues App)
 * We keep GeneratePress sidebars/footer intact. The App template already renders
 * its own sidebar area and the global SOS footer (sp_footer) replaces the native
 * GP footer when active (see .sp-has-footer below).
 */
/* Navigation : sur l'App, on conserve le menu principal (preuve d'intégration + UX).
   Le menu App (pills) vient en complément sous le header. */

/* Sur les pages marketing, on masque le menu App (sécurité / anti-double menus). */
body.sp-mkt .sp-app-menu{
  display:none !important;
}


/* Si on utilise le footer SOS, on masque uniquement la zone "site-info" de GP
   (évite double footer sans casser les hooks/structures). */
body.sp-has-footer .site-footer .site-info{
  display:none !important;
}

/* 20 — Layout App (Shell + Sidebar sticky) */
body.sp-app .sp-app-shell{
  display:grid;
  /* Default: 1 colonne. Le template PHP ajoute des modifiers si sidebar active */
  grid-template-columns:minmax(0,1fr);
  gap:24px;
  align-items:start;
}

/* 22 — Navigation App (menu horizontal optionnel) */
body.sp-app .sp-app-menu{
  background:var(--sp-bg);
  border-bottom:1px solid var(--sp-border);
}

/* Conteneur "grid aligned" pour le menu App (pills) */
body.sp-app .sp-app-menu-bar{
  max-width:var(--container-width);
  margin:0 auto;
  padding:10px var(--container-padding);
  box-sizing:border-box;
}
body.sp-app .sp-app-menu__items{
  list-style:none;
  margin:0;
  padding:0;
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  overflow-x:auto;
}
body.sp-app .sp-app-menu__items li{
  margin:0;
}
body.sp-app .sp-app-menu__items a{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:8px 12px;
  border-radius:99px;
  border:1px solid var(--sp-border);
  background:#ffffff;
  color:var(--sp-text);
  font-weight:700;
  font-size:14px;
  line-height:1;
  text-decoration:none;
}
body.sp-app .sp-app-menu__items a:hover{
  border-color:var(--sp-main);
  color:var(--sp-main);
  text-decoration:none;
}
body.sp-app .sp-app-menu__items :where(.current-menu-item, .current_page_item) > a{
  border-color:var(--sp-main);
  color:var(--sp-main);
  background:rgba(56,60,147,.06);
}

body.sp-app .sp-app-shell.sp-app-shell--sidebar-right{
  grid-template-columns:minmax(0,1fr) 320px;
}

body.sp-app .sp-app-shell.sp-app-shell--sidebar-left{
  grid-template-columns:320px minmax(0,1fr);
}

body.sp-app .sp-app-main{
  min-width:0;
}

body.sp-app .sp-app-sidebar{
  position:sticky;
  top:24px;
}

@media (max-width: 960px){
  body.sp-app .sp-app-shell{
    grid-template-columns:1fr;
  }
  body.sp-app .sp-app-sidebar{
    position:static;
    top:auto;
  }
}


/* 21 — GeneratePress Sidebar (App pages sans template) */
@media (min-width: 961px){
  body.sp-app:not(.sp-app-shell) :where(
    #right-sidebar,
    #right-sidebar .inside-right-sidebar,
    #left-sidebar,
    #left-sidebar .inside-left-sidebar
  ){
    position:sticky;
    top:24px;
  }
}

body.sp-app:not(.sp-app-shell) :where(#right-sidebar, #left-sidebar) .widget{
  margin-bottom:40px !important;
}

/* Espacement widgets (pages App avec template shell) */
body.sp-app.sp-app-shell .sp-app-sidebar .widget{
  /* v1.3.9 : la sidebar est un flex column avec gap: 40px (Hard-CSS). */
  margin-bottom:0 !important;
}

/* 30 — Components: Cards */
body.sp-app :where(.sp-card){
  background:var(--sp-bg);
  border:1px solid var(--sp-border);
  border-radius:var(--sp-radius-card);
  box-shadow:var(--sp-shadow);
}

/* Widgets sidebar: no shadow (clean, light) */
body.sp-app :where(.sp-app-sidebar) :where(.sp-card){
  box-shadow:none;
}

body.sp-app :where(.sp-card-header, .sp-card__header){
  padding:18px 18px 12px 18px;
  border-bottom:1px solid var(--sp-border);
}

body.sp-app :where(.sp-card-body, .sp-card__body){
  padding:18px;
}

body.sp-app :where(.sp-card-title, .sp-card__title){
  font-weight:700;
  font-size:18px;
  line-height:1.2;
  margin:0 0 4px 0;
}

body.sp-app :where(.sp-card-subtitle, .sp-card__subtitle){
  font-weight:400;
  font-size:14px;
  line-height:1.4;
  color:var(--sp-text-muted);
  margin:0;
}

/* 30.1 — Components: System Status */
body.sp-app :where(.sp-system-status) :where(.sp-card__body){
  padding:14px 16px;
}

body.sp-app :where(.sp-status){
  display:flex;
  align-items:center;
  gap:10px;
  font-size:14px;
  line-height:1;
}

body.sp-app :where(.sp-status__dot){
  width:10px;
  height:10px;
  border-radius:999px;
  background:#10b981;
  box-shadow:0 0 0 4px rgba(16,185,129,0.15);
}

body.sp-app :where(.sp-status__label){
  color:var(--sp-text-muted);
}

/* 31 — Components: Buttons */
body.sp-app :where(.sp-btn){
  user-select:none;
}

/* Boutons WP (block) : la vraie surface cliquable est .wp-block-button__link */
body.sp-app :where(.sp-btn) .wp-block-button__link,
body.sp-app :where(a.sp-btn){
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:12px 18px;
  border-radius:8px;
  font-weight:600;
  font-size:15px;
  line-height:1;
  cursor:pointer;
  border:1px solid transparent;
  text-decoration:none;
  transition:transform .15s ease, box-shadow .15s ease, filter .15s ease, background .15s ease, border-color .15s ease;
}

@media (prefers-reduced-motion: reduce){
  body.sp-app :where(.sp-btn) .wp-block-button__link,
  body.sp-app :where(a.sp-btn){
    transition:none;
  }
}

body.sp-app :where(.sp-btn-primary, .sp-btn--primary) .wp-block-button__link,
body.sp-app :where(a.sp-btn-primary, a.sp-btn--primary){
  background:linear-gradient(135deg, var(--sp-main) 0%, var(--sp-action) 100%);
  color:#ffffff;
  border-color:rgba(255,255,255,0.10);
  box-shadow:
    0 4px 6px -1px rgba(56, 60, 147, 0.20),
    0 2px 4px -1px rgba(56, 60, 147, 0.10);
}
body.sp-app :where(.sp-btn-primary, .sp-btn--primary) .wp-block-button__link:hover,
body.sp-app :where(a.sp-btn-primary, a.sp-btn--primary):hover{
  background:linear-gradient(135deg, var(--sp-main) 0%, var(--sp-action) 100%);
  filter:brightness(1.01);
  transform:translateY(-2px);
  box-shadow:0 10px 15px -3px rgba(56, 60, 147, 0.30);
  text-decoration:none;
}

body.sp-app :where(.sp-btn-secondary, .sp-btn--secondary) .wp-block-button__link,
body.sp-app :where(a.sp-btn-secondary, a.sp-btn--secondary){
  background:#ffffff;
  color:var(--sp-main);
  border-color:rgba(17,24,39,.12);
  box-shadow:0 8px 18px rgba(17,24,39,.06);
}
body.sp-app :where(.sp-btn-secondary, .sp-btn--secondary) .wp-block-button__link:hover,
body.sp-app :where(a.sp-btn-secondary, a.sp-btn--secondary):hover{
  border-color:rgba(56,60,147,.35);
  box-shadow:0 12px 24px rgba(17,24,39,.08);
  transform:translateY(-1px);
  text-decoration:none;
}

/* 32 — Components: Inputs */
body.sp-app :where(.sp-input, .sp-textarea){
  width:100%;
  border:1px solid var(--sp-border);
  border-radius:var(--sp-radius);
  padding:10px 12px;
  font-size:14px;
  line-height:1.4;
  color:var(--sp-text);
  background:#ffffff;
  box-sizing:border-box;
}
body.sp-app :where(.sp-input, .sp-textarea):focus{
  outline:none;
  border-color:var(--sp-main);
  box-shadow:0 0 0 3px rgba(56,60,147,.12);
}

/* 33 — Components: Badges */
body.sp-app :where(.sp-badge){
  display:inline-flex;
  align-items:center;
  gap:6px;
  background:#EFF6FF;
  color:var(--sp-main);
  border-radius:99px;
  padding:2px 12px;
  font-weight:700;
  font-size:12px;
  line-height:18px;
}

body.sp-app :where(.sp-badge-success){
  background:#ECFDF5;
  color:#065F46;
}
body.sp-app :where(.sp-badge-warning){
  background:#FFFBEB;
  color:#92400E;
}
body.sp-app :where(.sp-badge-danger){
  background:#FEF2F2;
  color:#991B1B;
}

/* 33b — Sidebar states (auth/roles)
   Patterns statiques : on masque/affiche via classes body.
*/
body.sp-app.sp-guest .sp-show-when-auth{ display:none !important; }
body.sp-app.sp-auth .sp-show-when-guest{ display:none !important; }
body.sp-app:not(.sp-role-doctor) .sp-show-when-role-doctor{ display:none !important; }
body.sp-app:not(.sp-role-patient) .sp-show-when-role-patient{ display:none !important; }
body.sp-app:not(.sp-role-pharmacien) .sp-show-when-role-pharmacien{ display:none !important; }

/* 33c — App Sidebar components (cards/rows/fields)
   Objectif : rendre les patterns sidebar lisibles sans dépendance.
*/
body.sp-app :where(.sp-app-card){
  background:#ffffff;
  border:1px solid var(--sp-border);
  border-radius:var(--sp-radius-card);
  box-shadow:0 1px 3px 0 rgba(0,0,0,0.05);
  overflow:hidden;
}

body.sp-app :where(.sp-app-card__header){
  padding:16px 18px;
  border-bottom:1px solid rgba(17,24,39,.08);
  display:flex;
  align-items:center;
  gap:10px;
  background:linear-gradient(180deg, rgba(79,70,229,.06) 0%, rgba(79,70,229,0) 100%);
}

body.sp-app :where(.sp-app-card__header .sp-ico){
  width:18px;
  height:18px;
  opacity:.85;
}

body.sp-app :where(.sp-app-card__body){
  padding:14px 18px 18px;
}

body.sp-app :where(.sp-app-card__h){
  font-weight:700;
  font-size:18px;
  line-height:1.2;
  margin:0;
}

body.sp-app :where(.sp-app-help){
  margin:10px 0 0 0;
  color:var(--sp-text-muted);
  font-size:13px;
  line-height:1.5;
}

body.sp-app :where(.sp-app-kv){
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:12px;
}

body.sp-app :where(.sp-app-sep){
  margin:14px 0;
}

body.sp-app :where(.sp-app-linkrow){
  display:flex;
  align-items:center;
  gap:10px;
  padding:8px 0;
}

body.sp-app :where(.sp-app-linkrow a){
  font-weight:700;
  text-decoration:none;
  color:var(--sp-text);
}
body.sp-app :where(.sp-app-linkrow a:hover){
  text-decoration:underline;
  color:var(--sp-main);
}

body.sp-app :where(.sp-app-field){
  margin-top:12px;
}
body.sp-app :where(.sp-app-field label){
  display:block;
  font-weight:700;
  font-size:12px;
  margin:0 0 6px 0;
}
body.sp-app :where(.sp-app-field input){
  width:100%;
  border:1px solid var(--sp-border);
  border-radius:var(--sp-radius);
  padding:10px 12px;
  font-size:14px;
  line-height:1.4;
  color:var(--sp-text);
  background:#ffffff;
  box-sizing:border-box;
}
body.sp-app :where(.sp-app-field input:focus){
  outline:none;
  border-color:var(--sp-main);
  box-shadow:0 0 0 3px rgba(56,60,147,.12);
}

body.sp-app :where(.sp-app-support__mini details){
  margin-top:12px;
  padding-top:12px;
  border-top:1px solid var(--sp-border);
}
body.sp-app :where(.sp-app-support__mini summary){
  cursor:pointer;
  font-weight:700;
}
body.sp-app :where(.sp-app-support__mini summary:focus-visible){
  outline:2px solid rgba(56,60,147,.35);
  outline-offset:4px;
  border-radius:8px;
}

/* Alias badges (compat patterns App Sidebar) */
body.sp-app :where(.sp-app-badge){
  display:inline-flex;
  align-items:center;
  gap:6px;
  background:#EFF6FF;
  color:var(--sp-main);
  border-radius:99px;
  padding:2px 12px;
  font-weight:700;
  font-size:12px;
  line-height:18px;
}
body.sp-app :where(.sp-app-badge--success){
  background:#ECFDF5;
  color:#065F46;
}

/* 34 — Components: Alerts */
body.sp-app :where(.sp-alert){
  border-left:4px solid var(--sp-border);
  background:#F9FAFB;
  border-radius:12px;
  padding:12px 14px;
  color:var(--sp-text);
}
body.sp-app :where(.sp-alert-success){
  border-left-color:#10B981;
}
body.sp-app :where(.sp-alert-warning){
  border-left-color:#F59E0B;
}
body.sp-app :where(.sp-alert-info){
  border-left-color:var(--sp-main);
}
body.sp-app :where(.sp-alert-danger){
  border-left-color:#EF4444;
}

/* 40 — Icons (scoped)
   Objectif : icônes facilement remplaçables (swap des SVG dans /assets/icons).
   Utilisation : <span class="sp-ico sp-ico--doctor" aria-hidden="true"></span>
*/

body.sp-app :where(.sp-ico),
body.sp-mkt :where(.sp-ico){
  display:inline-block;
  width:1.125em;
  height:1.125em;
  background-color:currentColor;
  vertical-align:-0.125em;
  -webkit-mask-repeat:no-repeat;
  mask-repeat:no-repeat;
  -webkit-mask-position:center;
  mask-position:center;
  -webkit-mask-size:contain;
  mask-size:contain;
}

body.sp-app :where(.sp-ico--doctor),
body.sp-mkt :where(.sp-ico--doctor){
  -webkit-mask-image:url('../icons/doctor.svg');
  mask-image:url('../icons/doctor.svg');
}
body.sp-app :where(.sp-ico--patient),
body.sp-mkt :where(.sp-ico--patient){
  -webkit-mask-image:url('../icons/patient.svg');
  mask-image:url('../icons/patient.svg');
}
body.sp-app :where(.sp-ico--pharmacy),
body.sp-mkt :where(.sp-ico--pharmacy){
  -webkit-mask-image:url('../icons/pharmacy.svg');
  mask-image:url('../icons/pharmacy.svg');
}
body.sp-app :where(.sp-ico--arrow-right),
body.sp-mkt :where(.sp-ico--arrow-right){
  -webkit-mask-image:url('../icons/arrow-right.svg');
  mask-image:url('../icons/arrow-right.svg');
}

body.sp-app :where(.sp-ico--shield-check),
body.sp-mkt :where(.sp-ico--shield-check){
  -webkit-mask-image:url('../icons/shield-check.svg');
  mask-image:url('../icons/shield-check.svg');
}
body.sp-app :where(.sp-ico--clipboard-check),
body.sp-mkt :where(.sp-ico--clipboard-check){
  -webkit-mask-image:url('../icons/clipboard-check.svg');
  mask-image:url('../icons/clipboard-check.svg');
}
body.sp-app :where(.sp-ico--clock),
body.sp-mkt :where(.sp-ico--clock){
  -webkit-mask-image:url('../icons/clock.svg');
  mask-image:url('../icons/clock.svg');
}
body.sp-app :where(.sp-ico--file-text),
body.sp-mkt :where(.sp-ico--file-text){
  -webkit-mask-image:url('../icons/file-text.svg');
  mask-image:url('../icons/file-text.svg');
}
body.sp-app :where(.sp-ico--eye),
body.sp-mkt :where(.sp-ico--eye){
  -webkit-mask-image:url('../icons/eye.svg');
  mask-image:url('../icons/eye.svg');
}
body.sp-app :where(.sp-ico--search),
body.sp-mkt :where(.sp-ico--search){
  -webkit-mask-image:url('../icons/search.svg');
  mask-image:url('../icons/search.svg');
}
body.sp-app :where(.sp-ico--message-circle),
body.sp-mkt :where(.sp-ico--message-circle){
  -webkit-mask-image:url('../icons/message-circle.svg');
  mask-image:url('../icons/message-circle.svg');
}

body.sp-app :where(.sp-ico--user-circle),
body.sp-mkt :where(.sp-ico--user-circle){
  -webkit-mask-image:url('../icons/user-circle.svg');
  mask-image:url('../icons/user-circle.svg');
}
body.sp-app :where(.sp-ico--badge-check),
body.sp-mkt :where(.sp-ico--badge-check){
  -webkit-mask-image:url('../icons/badge-check.svg');
  mask-image:url('../icons/badge-check.svg');
}
body.sp-app :where(.sp-ico--credit-card),
body.sp-mkt :where(.sp-ico--credit-card){
  -webkit-mask-image:url('../icons/credit-card.svg');
  mask-image:url('../icons/credit-card.svg');
}
body.sp-app :where(.sp-ico--plus-circle),
body.sp-mkt :where(.sp-ico--plus-circle){
  -webkit-mask-image:url('../icons/plus-circle.svg');
  mask-image:url('../icons/plus-circle.svg');
}
body.sp-app :where(.sp-ico--settings),
body.sp-mkt :where(.sp-ico--settings){
  -webkit-mask-image:url('../icons/settings.svg');
  mask-image:url('../icons/settings.svg');
}
body.sp-app :where(.sp-ico--pill),
body.sp-mkt :where(.sp-ico--pill){
  -webkit-mask-image:url('../icons/pill.svg');
  mask-image:url('../icons/pill.svg');
}
body.sp-app :where(.sp-ico--life-buoy),
body.sp-mkt :where(.sp-ico--life-buoy){
  -webkit-mask-image:url('../icons/life-buoy.svg');
  mask-image:url('../icons/life-buoy.svg');
}

/* Helpers App : intro + petits boutons de navigation au-dessus des shortcodes */
body.sp-app .sp-app-intro{
  color:var(--sp-text-muted);
  font-size:1.0625rem;
  line-height:1.6;
  max-width:72ch;
}

body.sp-app .sp-app-nav .wp-block-button__link{
  display:inline-flex;
  align-items:center;
  gap:10px;
}

body.sp-app .sp-app-nav .wp-block-button__link::after{
  content:"";
  width:1em;
  height:1em;
  background-color:currentColor;
  -webkit-mask-image:url('../icons/arrow-right.svg');
  mask-image:url('../icons/arrow-right.svg');
  -webkit-mask-repeat:no-repeat;
  mask-repeat:no-repeat;
  -webkit-mask-position:center;
  mask-position:center;
  -webkit-mask-size:contain;
  mask-size:contain;
}

/* Helpers Marketing : bouton CTA avec icône */
body.sp-mkt .sp-mkt-btn-icon .wp-block-button__link{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:14px 28px;
  border-radius:8px;
  background:linear-gradient(135deg, var(--sp-main) 0%, var(--sp-action) 100%);
  color:#ffffff;
  font-weight:600;
  font-size:16px;
  border:1px solid transparent;
  box-shadow:
    0 4px 6px -1px rgba(56, 60, 147, 0.20),
    0 2px 4px -1px rgba(56, 60, 147, 0.10);
  text-decoration:none;
  transition:transform .2s ease, box-shadow .2s ease, filter .2s ease, background .2s ease;
}

body.sp-mkt .sp-mkt-btn-icon .wp-block-button__link:hover,
body.sp-mkt .sp-mkt-btn-icon .wp-block-button__link:focus,
body.sp-mkt .sp-mkt-btn-icon .wp-block-button__link:focus-visible{
  color:#ffffff;
  text-decoration:none;
  background:linear-gradient(135deg, var(--sp-main) 0%, var(--sp-action) 100%);
  filter:brightness(1.01);
  transform:translateY(-2px);
  box-shadow:0 10px 15px -3px rgba(56, 60, 147, 0.30);
}

body.sp-mkt .sp-mkt-btn-icon .wp-block-button__link::after{
  content:"";
  width:1em;
  height:1em;
  background-color:currentColor;
  -webkit-mask-image:url('../icons/arrow-right.svg');
  mask-image:url('../icons/arrow-right.svg');
  -webkit-mask-repeat:no-repeat;
  mask-repeat:no-repeat;
  -webkit-mask-position:center;
  mask-position:center;
  -webkit-mask-size:contain;
  mask-size:contain;
}

/* Utilitaire : bouton "SaaS" (peut être utilisé dans un bloc HTML / pattern custom). */
body :where(a.sp-btn-saas){
  background:linear-gradient(135deg, var(--sp-main) 0%, var(--sp-action) 100%);
  color:#ffffff !important;
  padding:14px 28px;
  border-radius:8px;
  font-weight:600;
  font-size:16px;
  text-decoration:none;
  display:inline-flex;
  align-items:center;
  gap:8px;
  border:1px solid rgba(255,255,255,0.10);
  box-shadow:
    0 4px 6px -1px rgba(56, 60, 147, 0.20),
    0 2px 4px -1px rgba(56, 60, 147, 0.10);
  transition:transform .2s ease, box-shadow .2s ease, filter .2s ease;
}
body :where(a.sp-btn-saas:hover, a.sp-btn-saas:focus, a.sp-btn-saas:focus-visible){
  background:linear-gradient(135deg, var(--sp-main) 0%, var(--sp-action) 100%);
  filter:brightness(1.01);
  transform:translateY(-2px);
  box-shadow:0 10px 15px -3px rgba(56, 60, 147, 0.30);
  text-decoration:none;
}
body :where(a.sp-btn-saas:focus-visible){
  outline:2px solid rgba(56,60,147,.35);
  outline-offset:3px;
}

body.sp-mkt .sp-mkt-cols .wp-block-heading .sp-ico{
  margin-right:10px;
}

/* 60 — Marketing Layout (Patterns)
   Objectif : garder un style “Agency-inspired” tout en restant scoppé (anti-régression). */
body.sp-mkt .sp-mkt-section{
  padding:72px 0;
}
body.sp-mkt .sp-mkt-section:first-child{
  padding-top:72px;
}
body.sp-mkt .sp-mkt-muted{
  color:var(--sp-text-muted);
  max-width:72ch;
}
body.sp-mkt .sp-mkt-lead{
  font-size:1.125rem;
  line-height:1.65;
  max-width:70ch;
}

body.sp-mkt .sp-mkt-badge{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:8px 12px;
  border-radius:999px;
  border:1px solid var(--sp-border);
  background:rgba(56,60,147,.04);
  color:var(--sp-text);
  font-weight:700;
  font-size:14px;
  margin:0 0 18px 0;
}

/* --------------------------------------------------------------------------
   v1.2 — SaaS Premium Landing (seed: accueil-gb.html)
   Notes:
   - Uses stable classes (no dependency on GenerateBlocks uniqueId)
   - Styling is scoped to body.sp-mkt (anti-régression)
   -------------------------------------------------------------------------- */

body.sp-mkt .sp-container{
  max-width:var(--gb-container-width);
  margin:0 auto;
  padding:0 24px;
}

body.sp-mkt .sp-bg-canvas{
  background:
    radial-gradient(1200px 600px at 20% 15%, rgba(79, 70, 229, 0.10) 0%, rgba(79, 70, 229, 0) 60%),
    radial-gradient(900px 500px at 85% 20%, rgba(56, 60, 147, 0.10) 0%, rgba(56, 60, 147, 0) 55%),
    linear-gradient(180deg, var(--sp-canvas) 0%, #ffffff 100%);
}

body.sp-mkt .sp-hero{
  padding:88px 0 64px;
}

body.sp-mkt .sp-eyebrow{
  color:var(--sp-text-muted);
  font-size:0.95rem;
  margin:0 0 14px;
}

body.sp-mkt .sp-hero__title{
  font-family:var(--sp-font-head);
  font-weight:700;
  letter-spacing:-0.02em;
  line-height:1.08;
  margin:0 0 16px;
}

body.sp-mkt .sp-hero__sub{
  font-size:1.125rem;
  line-height:1.6;
  color:var(--sp-text-muted);
  margin:0 0 24px;
  max-width:64ch;
}

body.sp-mkt .sp-hero__media{
  background:var(--sp-surface);
  border:1px solid rgba(229, 231, 235, 0.80);
  padding:18px;
}

body.sp-mkt .sp-hero__media img{
  max-width:100%;
  height:auto;
  display:block;
}

body.sp-mkt .sp-section{
  padding:72px 0;
}

body.sp-mkt .sp-section--diagonal{
  position:relative;
  overflow:hidden;
}

body.sp-mkt .sp-section--diagonal::before{
  content:"";
  position:absolute;
  inset:-180px -40px auto -40px;
  height:420px;
  background:linear-gradient(135deg, rgba(56,60,147,0.08) 0%, rgba(79,70,229,0.00) 65%);
  transform:skewY(-8deg);
  transform-origin:0 0;
  pointer-events:none;
}

body.sp-mkt .sp-section__title{
  font-family:var(--sp-font-head);
  font-weight:700;
  letter-spacing:-0.015em;
}

body.sp-mkt .sp-kpi-list{
  list-style:none;
  padding:0;
  margin:18px 0 0;
}

body.sp-mkt .sp-kpi-list li{
  padding:10px 0;
  border-bottom:1px solid rgba(229, 231, 235, 0.70);
}

body.sp-mkt .sp-kpi-list li:last-child{
  border-bottom:0;
}

body.sp-mkt .sp-steps .sp-step{
  background:var(--sp-surface);
  border:1px solid rgba(229, 231, 235, 0.80);
  padding:22px;
  border-radius:var(--sp-radius-card);
  box-shadow:var(--sp-shadow-sm);
}

body.sp-mkt .sp-cta{
  text-align:center;
  background:
    radial-gradient(900px 400px at 50% 0%, rgba(56,60,147,0.10) 0%, rgba(56,60,147,0) 65%),
    linear-gradient(180deg, #ffffff 0%, var(--sp-canvas) 100%);
}

/* Primary button (rounded-16) */
body.sp-mkt .sp-btn-primary .wp-block-button__link,
body.sp-mkt .gb-button-btn-primary .wp-block-button__link{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding:14px 28px;
  border-radius:16px;
  background:linear-gradient(135deg, var(--sp-main) 0%, var(--sp-action) 100%);
  color:#ffffff;
  font-weight:600;
  border:1px solid transparent;
  text-decoration:none;
  box-shadow:
    0 4px 6px -1px rgba(56, 60, 147, 0.20),
    0 2px 4px -1px rgba(56, 60, 147, 0.10);
  transition:transform .2s ease, box-shadow .2s ease, filter .2s ease;
}

body.sp-mkt .sp-btn-primary .wp-block-button__link:hover,
body.sp-mkt .gb-button-btn-primary .wp-block-button__link:hover,
body.sp-mkt .sp-btn-primary .wp-block-button__link:focus,
body.sp-mkt .sp-btn-primary .wp-block-button__link:focus-visible{
  color:#ffffff;
  text-decoration:none;
  filter:brightness(1.02);
  transform:translateY(-2px);
  box-shadow:0 10px 15px -3px rgba(56, 60, 147, 0.30);
}
body.sp-mkt .sp-mkt-badge__dot{
  width:10px;
  height:10px;
  border-radius:999px;
  background:var(--sp-main);
  box-shadow:0 0 0 4px rgba(56,60,147,.12);
}

body.sp-mkt .sp-mkt-card{
  background:var(--sp-bg);
  border:1px solid var(--sp-border);
  border-radius:var(--sp-radius-card);
  box-shadow:var(--sp-shadow);
  padding:22px;
}
body.sp-mkt .sp-mkt-card > *:last-child{
  margin-bottom:0;
}

body.sp-mkt .sp-mkt-hero--modern{
  position:relative;
  overflow:hidden;
  background:linear-gradient(180deg, rgba(56,60,147,.06) 0%, rgba(56,60,147,0) 65%);
}
body.sp-mkt .sp-mkt-hero--modern::before{
  content:"";
  position:absolute;
  right:-140px;
  top:-220px;
  width:520px;
  height:520px;
  border-radius:999px;
  background:rgba(56,60,147,.10);
  opacity:.85;
  pointer-events:none;
}
body.sp-mkt .sp-mkt-hero__inner{
  position:relative;
  z-index:1;
}
body.sp-mkt .sp-mkt-hero__cols{
  gap:32px;
}
@media (max-width: 960px){
  body.sp-mkt .sp-mkt-hero__cols{
    gap:20px;
  }
}

body.sp-mkt .sp-mkt-kpis{
  margin-top:18px;
  gap:12px;
}
body.sp-mkt .sp-mkt-kpi{
  display:flex;
  align-items:baseline;
  gap:10px;
  padding:10px 12px;
  border-radius:14px;
  background:rgba(56,60,147,.04);
  border:1px solid var(--sp-border);
}
body.sp-mkt .sp-mkt-kpi__value{
  font-weight:800;
  font-size:20px;
  margin:0;
}
body.sp-mkt .sp-mkt-kpi__label{
  margin:0;
  color:var(--sp-text-muted);
  font-size:14px;
  font-weight:600;
}

body.sp-mkt .sp-mkt-linklist{
  list-style:none;
  padding:0;
  margin:0 0 18px 0;
}
body.sp-mkt .sp-mkt-linklist li{
  margin:0 0 10px 0;
}
body.sp-mkt .sp-mkt-linklist a{
  display:flex;
  gap:10px;
  align-items:center;
  padding:10px 12px;
  border-radius:12px;
  border:1px solid var(--sp-border);
  background:#fff;
  text-decoration:none;
  color:var(--sp-text);
  font-weight:700;
}
body.sp-mkt .sp-mkt-linklist a:hover{
  border-color:var(--sp-main);
  color:var(--sp-main);
}

body.sp-mkt .sp-mkt-grid{
  display:grid;
  gap:18px;
}
body.sp-mkt .sp-mkt-grid--3{
  grid-template-columns:repeat(3,minmax(0,1fr));
}
@media (max-width: 960px){
  body.sp-mkt .sp-mkt-grid--3{
    grid-template-columns:1fr;
  }
}

body.sp-mkt .sp-mkt-cards{
  gap:18px;
}
body.sp-mkt .sp-mkt-cards .wp-block-column{
  display:flex;
}
body.sp-mkt .sp-mkt-cards .wp-block-column > .wp-block-group{
  width:100%;
}

body.sp-mkt .sp-mkt-diagonal{
  position:relative;
  overflow:hidden;
}
body.sp-mkt .sp-mkt-diagonal::before{
  content:"";
  position:absolute;
  inset:-60px;
  background:linear-gradient(135deg, rgba(56,60,147,.06) 0%, rgba(56,60,147,.06) 46%, rgba(56,60,147,0) 47%);
  z-index:0;
  pointer-events:none;
}
body.sp-mkt .sp-mkt-diagonal > *{
  position:relative;
  z-index:1;
}

body.sp-mkt .sp-mkt-tint{
  background:rgba(56,60,147,.04);
}

body.sp-mkt .sp-mkt-step__badge{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:8px 12px;
  border-radius:999px;
  background:rgba(56,60,147,.06);
  border:1px solid var(--sp-border);
  font-weight:800;
  font-size:14px;
  margin:0 0 12px 0;
}
body.sp-mkt .sp-mkt-step__num{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:26px;
  height:26px;
  border-radius:999px;
  background:var(--sp-main);
  color:#fff;
}

body.sp-mkt .sp-mkt-checklist{
  list-style:none;
  padding:0;
  margin:0;
}
body.sp-mkt .sp-mkt-checklist li{
  display:flex;
  gap:10px;
  align-items:flex-start;
  padding:8px 0;
  border-bottom:1px solid rgba(229,231,235,.7);
  margin:0;
}
body.sp-mkt .sp-mkt-checklist li:last-child{
  border-bottom:0;
}

body.sp-mkt .sp-mkt-cta--band{
  background:linear-gradient(180deg, rgba(56,60,147,.06), rgba(56,60,147,0));
  border-top:1px solid rgba(229,231,235,.8);
  border-bottom:1px solid rgba(229,231,235,.8);
}

body.sp-mkt .sp-mkt-faq__item{
  padding:0;
  overflow:hidden;
}
body.sp-mkt .sp-mkt-faq__item summary{
  cursor:pointer;
  padding:16px 18px;
  font-weight:800;
}
body.sp-mkt .sp-mkt-faq__item[open] summary{
  border-bottom:1px solid var(--sp-border);
}
body.sp-mkt .sp-mkt-faq__item > *:not(summary){
  padding:16px 18px;
}

body.sp-mkt .sp-mkt-price__value{
  font-size:20px;
  font-weight:900;
  color:var(--sp-main);
  margin-top:-6px;
}
body.sp-mkt .sp-mkt-card--featured{
  border-color:rgba(56,60,147,.35);
  box-shadow:0 8px 18px rgba(17,24,39,.08);
}
body.sp-mkt .sp-mkt-badge--soft{
  background:rgba(56,60,147,.06);
}

/* 62 — Marketing : Landing "Agency SOS" (SaaS)
   Utilisée par le pattern "Page — Accueil (Agency SOS)".
   Objectif : retrouver une vibe Agency (diagonales + respiration) avec des composants plus SaaS.
*/
body.sp-mkt .sp-mkt-landing-agency-sos{
  overflow-x:hidden;
}

body.sp-mkt .sp-mkt-landing-agency-sos :where(.sp-saas-container){
  font-family:var(--sp-font-sans);
  color:var(--sp-text);
  line-height:1.6;
}

body.sp-mkt .sp-mkt-landing-agency-sos :where(.sp-hero-saas){
  text-align:center;
  padding:96px 18px;
  background:radial-gradient(circle at top right, var(--base-2) 0%, #ffffff 62%);
}
body.sp-mkt .sp-mkt-landing-agency-sos :where(.sp-hero-saas h1){
  font-size:clamp(40px, 5vw, 64px);
  letter-spacing:-0.02em;
  line-height:1.05;
  margin:0 0 18px 0;
  color:#0f172a;
}
body.sp-mkt .sp-mkt-landing-agency-sos :where(.sp-hero-saas p){
  font-size:1.25rem;
  color:#64748b;
  max-width:64ch;
  margin:0 auto 36px;
}

body.sp-mkt .sp-mkt-landing-agency-sos :where(.sp-who-agency){
  position:relative;
  padding:96px 18px;
  background-color:#ffffff;
  overflow:hidden;
}
body.sp-mkt .sp-mkt-landing-agency-sos :where(.sp-who-agency::before){
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(170deg, var(--base-2) 55%, #ffffff 55%);
  z-index:0;
}

body.sp-mkt .sp-mkt-landing-agency-sos :where(.sp-who-content){
  position:relative;
  z-index:1;
  max-width:1100px;
  margin:0 auto;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:60px;
  align-items:center;
}
@media (max-width: 960px){
  body.sp-mkt .sp-mkt-landing-agency-sos :where(.sp-who-content){
    grid-template-columns:1fr;
    gap:36px;
  }
}

body.sp-mkt .sp-mkt-landing-agency-sos :where(.sp-who-intro h2){
  font-size:clamp(30px, 4vw, 42px);
  margin:0 0 12px 0;
  color:#1e293b;
}
body.sp-mkt .sp-mkt-landing-agency-sos :where(.sp-who-intro p){
  margin:0;
  color:#64748b;
  font-size:1.125rem;
}

body.sp-mkt .sp-mkt-landing-agency-sos :where(.sp-who-list){
  display:flex;
  flex-direction:column;
  gap:28px;
}
body.sp-mkt .sp-mkt-landing-agency-sos :where(.sp-who-item){
  display:flex;
  align-items:flex-start;
  gap:18px;
}
body.sp-mkt .sp-mkt-landing-agency-sos :where(.sp-who-icon){
  background:#ffffff;
  width:50px;
  height:50px;
  border-radius:12px;
  display:flex;
  align-items:center;
  justify-content:center;
  box-shadow:0 4px 6px rgba(0,0,0,0.05);
  color:var(--sp-main);
  flex-shrink:0;
}
body.sp-mkt .sp-mkt-landing-agency-sos :where(.sp-who-icon .sp-ico){
  width:22px;
  height:22px;
}
body.sp-mkt .sp-mkt-landing-agency-sos :where(.sp-who-item h3){
  font-size:20px;
  margin:0 0 6px 0;
  color:#0f172a;
}
body.sp-mkt .sp-mkt-landing-agency-sos :where(.sp-who-item p){
  margin:0;
  font-size:14px;
  color:#64748b;
}

body.sp-mkt .sp-mkt-landing-agency-sos :where(.sp-projects-agency){
  padding:96px 18px;
  background:#ffffff;
  text-align:center;
}
body.sp-mkt .sp-mkt-landing-agency-sos :where(.sp-projects-agency h2){
  font-size:clamp(30px, 4vw, 42px);
  color:#1e293b;
  margin:0 0 54px 0;
}
body.sp-mkt .sp-mkt-landing-agency-sos :where(.sp-projects-grid){
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(280px, 1fr));
  gap:30px;
  max-width:1200px;
  margin:0 auto;
}
body.sp-mkt .sp-mkt-landing-agency-sos :where(.sp-project-card){
  text-align:left;
}
body.sp-mkt .sp-mkt-landing-agency-sos :where(.sp-project-visual){
  height:220px;
  width:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  margin-bottom:40px !important;
  border-radius:18px;
  transition:transform .3s ease;
}
body.sp-mkt .sp-mkt-landing-agency-sos :where(.sp-project-visual:hover){
  transform:translateY(-5px);
}
body.sp-mkt .sp-mkt-landing-agency-sos :where(.sp-project-number){
  font-size:60px;
  font-weight:700;
  color:rgba(255,255,255,0.40);
  border:4px solid rgba(255,255,255,0.40);
  border-radius:50%;
  width:100px;
  height:100px;
  display:flex;
  align-items:center;
  justify-content:center;
}
/* Couleurs alternées (Agency-like) */
body.sp-mkt .sp-mkt-landing-agency-sos :where(.bg-step-1){ background-color: var(--sp-action); }
body.sp-mkt .sp-mkt-landing-agency-sos :where(.bg-step-2){ background-color: var(--sp-success); }
body.sp-mkt .sp-mkt-landing-agency-sos :where(.bg-step-3){ background-color: #3B82F6; }

body.sp-mkt .sp-mkt-landing-agency-sos :where(.sp-project-title){
  font-size:20px;
  margin:0 0 10px 0;
  color:#334155;
}
body.sp-mkt .sp-mkt-landing-agency-sos :where(.sp-project-desc){
  font-size:15px;
  color:#64748b;
  line-height:1.55;
  margin:0;
}

body.sp-mkt .sp-mkt-landing-agency-sos :where(.sp-security-callout){
  text-align:center;
  padding:72px 18px;
  background:#ffffff;
}
body.sp-mkt .sp-mkt-landing-agency-sos :where(.sp-security-icon){
  width:60px;
  height:60px;
  background:#EFF6FF;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  margin:0 auto 18px;
  color:var(--sp-main);
}
body.sp-mkt .sp-mkt-landing-agency-sos :where(.sp-security-icon .sp-ico){
  width:26px;
  height:26px;
}
body.sp-mkt .sp-mkt-landing-agency-sos :where(.sp-security-callout h2){
  font-size:32px;
  margin:0 0 12px 0;
}
body.sp-mkt .sp-mkt-landing-agency-sos :where(.sp-security-callout p){
  color:#64748b;
  font-size:18px;
  margin:0;
}

body.sp-mkt .sp-mkt-landing-agency-sos :where(.sp-cta-final){
  text-align:center;
  padding:84px 18px;
  background:var(--base-2);
  border-top:1px solid rgba(226,232,240,.9);
  border-bottom:1px solid rgba(226,232,240,.9);
}
body.sp-mkt .sp-mkt-landing-agency-sos :where(.sp-cta-final h2){
  font-size:36px;
  margin:0 0 16px 0;
}
body.sp-mkt .sp-mkt-landing-agency-sos :where(.sp-cta-final p){
  font-size:18px;
  color:#64748b;
  margin:0 0 34px 0;
}


/* 50 — Tailwind "compat" (si le plugin/React sort des classes utilitaires) */
body.sp-app :where(.bg-blue-600){
  background-color:var(--sp-main) !important;
}
body.sp-app :where(.text-blue-600){
  color:var(--sp-main) !important;
}
body.sp-app :where(.text-blue-700, .text-blue-900){
  color:var(--sp-main) !important;
}
body.sp-app :where(.border-blue-600){
  border-color:var(--sp-main) !important;
}
body.sp-app :where(.bg-blue-50){
  background-color:rgba(56,60,147,.08) !important;
}

/* 90 — Utilities */
body.sp-app .sp-row{
  display:flex;
  gap:12px;
  align-items:center;
  flex-wrap:wrap;
}
body.sp-app .sp-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;
}
@media (max-width: 960px){
  body.sp-app .sp-grid{
    grid-template-columns:1fr;
  }
}

body.sp-app .sp-widget-title,
body.sp-mkt .sp-widget-title{
  font-weight:700;
  font-size:14px;
  margin:0 0 8px 0;
}
body.sp-app .sp-widget,
body.sp-mkt .sp-widget{
  margin-bottom:12px;
}

body.sp-app .sp-widget .wp-block-group,
body.sp-mkt .sp-widget .wp-block-group{
  margin:0;
}

/* 95 — Sidebar Patterns (Gutenberg / Widgets) */
body.sp-app .sp-sidebar-stack{
  display:flex;
  flex-direction:column;
  gap:12px;
}
body.sp-app .sp-sidebar-stack > *{
  margin:0 !important;
}
body.sp-app .sp-sidebar-stack .wp-block-button__link{
  width:100%;
  text-align:center;
}

/* 110 — Footer (Site Template) */
/* Header (Swiss SaaS look) : jamais de soulignement sur les liens du menu principal */
body :where(.site-header, .main-navigation) a,
body :where(.site-header, .main-navigation) a:hover,
body :where(.site-header, .main-navigation) a:focus,
body :where(.site-header, .main-navigation) a:active{
  text-decoration:none !important;
}

/* Fix ciblé : le lien Home/Logo (a[rel="home"]) ne doit jamais être souligné */
a[rel="home"],
a[rel="home"]:hover,
a[rel="home"]:focus,
a[rel="home"]:active{
  text-decoration:none !important;
}

body.sp-has-footer .site-footer .site-info{
  display:none;
}

body.sp-has-footer .sp-footer-area{
  border-top:1px solid rgba(17,24,39,.10);
  background:var(--base, var(--sp-bg));
}

body.sp-has-footer .sp-footer-area__inner{
  max-width:var(--container-width);
  margin:0 auto;
  padding:42px var(--container-padding) 30px;
  box-sizing:border-box;
}

/* Pied de page 3 colonnes (Widget Footer) — Vision | Liens | Légal */
body.sp-has-footer .sp-footer-area__grid,
body.sp-has-footer .sp-footer-inner{
  display:grid;
  grid-template-columns:1fr 1fr 1fr;
  gap:2rem;
  align-items:start;
}

@media (max-width: 900px){
  body.sp-has-footer .sp-footer-area__grid,
  body.sp-has-footer .sp-footer-inner{
    grid-template-columns:1fr;
    gap:24px;
  }
}

body.sp-has-footer .sp-footer-area__title{
  margin:0 0 12px;
  font-size:0.95rem;
}

body.sp-has-footer .sp-footer-area__text{
  margin:0 0 14px;
  color:var(--contrast-2);
}

body.sp-has-footer .sp-footer-area__links{
  list-style:none;
  padding:0;
  margin:0;
  display:flex;
  flex-direction:column;
  gap:8px;
}

body.sp-has-footer .sp-footer-area__links a{
  text-decoration:none;
}

body.sp-has-footer .sp-footer-area__links a:hover{
  text-decoration:underline;
}

/* Separator du footer : éviter une barre trop épaisse (WP peut styliser fortement <hr>) */
body.sp-has-footer .sp-footer__sep{
  border:0 !important;
  height:0 !important;
  margin:28px 0 18px !important;
  border-top:1px solid rgba(17,24,39,.10) !important;
  background:transparent !important;
  opacity:1 !important;
}

/* Sidebar (GeneratePress) : espacement + fond léger pour que les cards "respirent" */
body.sp-app :where(.inside-right-sidebar, .inside-left-sidebar){
  display:flex;
  flex-direction:column;
  gap:24px;
  padding:16px;
  background:var(--base-2);
  border-radius:18px;
}

body.sp-app :where(.inside-right-sidebar .sp-widget, .inside-left-sidebar .sp-widget){
  margin:0;
}

/* Cards App Sidebar : ombre un peu plus lisible sur fond base-2 */
body.sp-app :where(.sp-app-card){
  box-shadow:0 1px 3px 0 rgba(0,0,0,0.05);
}

body.sp-has-footer .sp-footer-area a{
  color:inherit;
  text-decoration:none;
}

body.sp-has-footer .sp-footer-area a:hover{
  text-decoration:underline;
}

body.sp-has-footer .sp-footer-area .sp-footer__legal{
  opacity:0.75;
  font-size:0.95rem;
}

/* --------------------------------------------------------------------------
 * PLAN B (v1.4.0) — CSS de secours "Hard"
 * Objectif : garantir un rendu "logiciel" même en cas de styles tiers
 * absents ou écrasés (cache, compilation, etc.).
 * -------------------------------------------------------------------------- */

/* Force Menu Style */
.main-navigation a{
  font-family:'Plus Jakarta Sans', sans-serif !important;
  font-weight:600 !important;
  text-decoration:none !important;
}

.main-navigation a:hover,
.main-navigation a:focus{
  text-decoration:none !important;
}

/* Fix Boutons décalés */
.wp-block-button{
  display:inline-block;
  margin:0;
}

.wp-block-button__link{
  display:inline-flex;
  align-items:center;
  justify-content:center;
}

/* ========================================================================== 
   V1 — Swiss SaaS (Hard-CSS)
   Objectif : CTA & sections marketing robustes (sans dépendance GenerateBlocks)
   ========================================================================== */

/* CTA grid (2 cartes) */
body.sp-mkt .sp-cta-grid{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:16px;
  margin-top:20px;
}
body.sp-mkt .sp-cta-card{
  display:block;
  padding:18px 18px;
  border-radius: var(--sp-radius-card, 16px);
  border:1px solid rgba(15,23,42,.10);
  background:#fff;
  text-decoration:none;
  color:inherit;
  box-shadow: var(--shadow-soft, 0 10px 30px rgba(2,6,23,.06));
}
body.sp-mkt .sp-cta-card:hover{
  border-color: rgba(15,23,42,.18);
}
body.sp-mkt .sp-cta-card__title{
  font-weight:700;
  font-size:16px;
  line-height:1.25;
}
body.sp-mkt .sp-cta-card__desc{
  margin-top:6px;
  font-size:14px;
  line-height:1.4;
  color: rgba(15,23,42,.75);
}
body.sp-mkt .sp-hero-link{
  margin-top:14px;
  font-size:14px;
  color: rgba(15,23,42,.75);
}
body.sp-mkt .sp-hero-link a{
  text-decoration:none;
  border-bottom:1px solid rgba(15,23,42,.25);
}
body.sp-mkt .sp-hero-link a:hover{
  border-bottom-color: rgba(15,23,42,.45);
}

@media (max-width: 720px){
  body.sp-mkt .sp-cta-grid{ grid-template-columns:1fr; }
}

/* Panneau de confiance (colonne droite hero) */
body.sp-mkt .sp-hero-panel{
  padding:22px;
  border-radius: var(--sp-radius-card, 16px);
  border:1px solid rgba(15,23,42,.10);
  background:#fff;
  box-shadow: var(--shadow-soft, 0 10px 30px rgba(2,6,23,.06));
}
body.sp-mkt .sp-hero-panel h3{
  margin:0 0 10px;
  font-size:15px;
  font-weight:700;
}
body.sp-mkt .sp-hero-panel p{
  margin:0;
  font-size:14px;
  line-height:1.5;
  color: rgba(15,23,42,.75);
}
body.sp-mkt .sp-hero-panel__list{
  margin:14px 0 0;
  padding:0;
  list-style:none;
  display:flex;
  flex-direction:column;
  gap:10px;
}
body.sp-mkt .sp-hero-panel__item{
  display:flex;
  gap:10px;
  align-items:flex-start;
}
body.sp-mkt .sp-hero-panel__dot{
  width:8px;
  height:8px;
  border-radius:999px;
  background:#10b981;
  margin-top:6px;
  flex:none;
}

/* Feature grid (4 cartes) */
body.sp-mkt .sp-feature-grid{
  display:grid !important;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap:24px;
}
@media (max-width: 720px){
  body.sp-mkt .sp-feature-grid{ grid-template-columns:1fr; }
}

/* Sidebar (App) — widgets importés via Element */
body.sp-app .sp-quick-actions{display:flex;flex-direction:column;gap:12px;margin-top:10px;}
body.sp-app .sp-trust{display:flex;flex-direction:column;gap:10px;margin-top:10px;}
body.sp-app .sp-trust__item{position:relative;padding-left:18px;font-size:14px;line-height:1.4;color:rgba(15,23,42,.75);} 
body.sp-app .sp-trust__item:before{content:"";position:absolute;left:0;top:6px;width:8px;height:8px;border-radius:999px;background:#10b981;}