@charset "UTF-8";
/* ============================================================
   EXPERIMENT — thème "Revolut x Airbnb", site entier.
   Chargé en dernier dans chaque page : surcharge uniquement des
   tokens visuels partagés (fond, nav, boutons, titres) sans
   toucher au HTML ni aux styles spécifiques de chaque page.
   Fichier de test local — à retirer si non retenu.
   ============================================================ */

:root {
  --ra-coral: #0D9488;      /* teal — confiance + argent/croissance */
  --ra-coral-dark: #0F766E;
  --ra-purple: #0369A1;     /* bleu profond — sérieux, fiabilité */
  --ra-grad: linear-gradient(135deg, var(--ra-coral) 0%, var(--ra-purple) 100%);
}

/* ── Fond : premium sombre, orbes recolorées (partout où le motif existe) ── */
body {
  background: linear-gradient(160deg, #0b0710 0%, #140a14 55%, #1a0d16 100%) !important;
  animation: none !important;
}
body::before {
  background: radial-gradient(circle, rgba(13,148,136,0.16) 0%, transparent 70%) !important;
}
body::after {
  background: radial-gradient(circle, rgba(3,105,161,0.16) 0%, transparent 70%) !important;
}

/* ── Topnav (fichier partagé /css/topnav.css) : pill flottante ── */
.topnav {
  top: 0.75rem !important;
  left: 1rem !important; right: 1rem !important;
  border-radius: 1.5rem !important;
  border: 1px solid rgba(255,255,255,0.08) !important;
  background: rgba(20,10,18,0.7) !important;
}
.topnav-cta,
.topnav-trial,
.topnav-download.active,
.topnav a.active {
  background: var(--ra-grad) !important;
  border-radius: 999px !important;
  box-shadow: 0 6px 20px rgba(13,148,136,0.35) !important;
}

/* ── Titres : dégradé corail → violet (uniquement les éléments qui portent
   le texte directement — jamais un conteneur multi-lignes comme .hero-title,
   sinon background-clip:text s'applique au conteneur et casse l'affichage) ── */
.hero-title-grad,
.hero-grad {
  background: linear-gradient(270deg, #0D9488 0%, #0369A1 50%, #0D9488 100%) !important;
  background-size: 300% 300% !important;
  -webkit-background-clip: text !important; -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
}

/* ── Boutons : pilule dégradée (primaires) ou pilule outline (secondaires) ── */
[class*="btn-primary"],
[class*="btn-hero-trial"],
[class*="btn-pay"],
[class*="btn-submit"],
[class*="btn-download"],
[class*="btn-reseau"],
[class*="btn-register"],
[class*="btn-login"] {
  border-radius: 999px !important;
  background: var(--ra-grad) !important;
  border-color: transparent !important;
  box-shadow: 0 6px 24px rgba(13,148,136,0.35) !important;
}
[class*="btn-primary"]:hover,
[class*="btn-hero-trial"]:hover,
[class*="btn-pay"]:hover,
[class*="btn-submit"]:hover,
[class*="btn-download"]:hover,
[class*="btn-reseau"]:hover,
[class*="btn-register"]:hover,
[class*="btn-login"]:hover {
  filter: brightness(1.08);
  box-shadow: 0 12px 32px rgba(13,148,136,0.5) !important;
}
[class*="btn-secondary"] {
  border-radius: 999px !important;
  border-color: rgba(13,148,136,0.4) !important;
  color: #5eead4 !important;
  background: transparent !important;
}

/* ── Liens de contact sav@ ── */
a[href^="mailto:sav"] { color: var(--ra-coral) !important; font-weight: 700; }

/* ── Cartes : tous les composants "*card*" du site (os-card, plan-card,
   licence-card, feat-card, form-card, profile-card, reseau-card, summary-card,
   info-card, legal-card, m-card, home-tcard, y compris leurs sous-parties
   card-header/body/footer — juste le radius pour elles, sans le glow hover
   qui n'a de sens que sur le conteneur externe) ── */
[class*="card"] {
  border-radius: 1.5rem !important;
}
.os-card:hover, .plan-card:hover, .licence-card:hover, .feat-card:hover,
.form-card:hover, .profile-card:hover, .reseau-card:hover, .summary-card:hover,
.info-card:hover, .legal-card:hover, .m-card:hover, .home-tcard:hover,
.value-card:hover {
  border-color: rgba(13,148,136,0.3) !important;
  box-shadow: 0 16px 40px rgba(0,0,0,0.35), 0 0 0 1px rgba(13,148,136,0.12) !important;
}

/* ── Boîtes (info/erreur/CTA/contact/suggestion) ── */
[class*="-box"] {
  border-radius: 1.25rem !important;
}
.info-box, .cta-box, .contact-box {
  border-color: rgba(13,148,136,0.2) !important;
  background: rgba(13,148,136,0.06) !important;
}
.error-box {
  border-color: rgba(13,148,136,0.35) !important;
}

/* ── Badges / chips / puces / eyebrow ── */
[class*="badge"], [class*="chip"], .hero-eyebrow, .hero-founder-note {
  border-radius: 999px !important;
}
[class*="badge"] {
  background: rgba(13,148,136,0.12) !important;
  border-color: rgba(13,148,136,0.3) !important;
  color: #5eead4 !important;
}

/* ── Items (FAQ, stats, confiance) : radius doux ── */
.faq-item, .stat-item, .trust-item {
  border-radius: 1.25rem !important;
}

/* ── Champs de formulaire : radius + focus corail ── */
input, select, textarea {
  border-radius: 0.9rem !important;
}
input:focus, select:focus, textarea:focus {
  border-color: var(--ra-coral) !important;
  box-shadow: 0 0 0 3px rgba(13,148,136,0.18) !important;
  outline: none !important;
}

/* ── Étapes numérotées (install-steps, activation licence, etc.) ── */
.step-num, [class*="step-num"] {
  background: var(--ra-grad) !important;
}
[class*="install-steps"] {
  border-radius: 1.5rem !important;
}