/* =====================================================================================
   RIO — SITE V2 · PROPOSITIONS LIBRES (version 2)
   Se charge après charte-rio.css. Même charte Graphite ; six ajouts, tous réversibles :
   retirer ce fichier et charte-rio-plus.js ramène exactement à la version 1.
     1. Filet lumineux : le filet de la carte s'allume sous le pointeur (ou au focus clavier)
     2. Entrée en cascade des grilles de cartes, une seule fois
     3. Offre mise en avant : halo d'accent et éclairage par le haut
     4. Capsule intelligente : s'efface à la descente, revient à la montée, fil de progression
     5. Retour en haut
     6. Barre d'action sur téléphone
   Tout respecte prefers-reduced-motion ; sans JavaScript, le site reste celui de la version 1.
   ===================================================================================== */

/* 1 — filet lumineux ------------------------------------------------------------------ */
.detail-card,.plan,.trust-item,.flow-row,.lineage,.editorial-feature,.editorial-secondary,.focus-sources,.contact-form,.cta-band .container,.sector-journey>div{position:relative;--mx:50%;--my:0%}
.detail-card::after,.plan::after,.trust-item::after,.flow-row::after,.lineage::after,.editorial-feature::after,.editorial-secondary::after,.focus-sources::after,.contact-form::after,.cta-band .container::after{
  content:"";position:absolute;inset:-1px;border-radius:inherit;padding:1px;pointer-events:none;opacity:0;
  background:radial-gradient(260px circle at var(--mx) var(--my),rgba(94,234,212,.85),rgba(46,196,166,.25) 45%,transparent 70%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;
  mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);
  transition:opacity var(--dur) var(--ease)}
@media(hover:hover){
  .detail-card:hover::after,.plan:hover::after,.trust-item:hover::after,.flow-row:hover::after,.lineage:hover::after,.editorial-feature:hover::after,.editorial-secondary:hover::after,.focus-sources:hover::after,.contact-form:hover::after,.cta-band .container:hover::after{opacity:1}
  /* le filet suit le pointeur : le survol uniforme de la version 1 laisse la place */
  .detail-card:hover,.plan:hover,.trust-item:hover,.flow-row:hover,.editorial-feature:hover,.editorial-secondary:hover{
    border-color:var(--line);
    background:radial-gradient(420px circle at var(--mx) var(--my),rgba(46,196,166,.07),transparent 60%),var(--glass-hover)}
}
.detail-card:focus-within::after,.plan:focus-within::after,.trust-item:focus-within::after,.editorial-feature:focus-within::after,.editorial-secondary:focus-within::after,.contact-form:focus-within::after{opacity:1}

/* 2 — entrée en cascade (classes posées par le script, donc rien n'est caché sans lui) --- */
.rv{opacity:0;transform:translateY(16px)}
.rv.rv-in{opacity:1;transform:none;
  transition:opacity var(--dur-slow) cubic-bezier(0,0,.2,1) var(--rv-d,0ms),transform var(--dur-slow) cubic-bezier(0,0,.2,1) var(--rv-d,0ms)}

/* 3 — offre mise en avant ------------------------------------------------------------- */
.plan.featured{background:var(--light-top),radial-gradient(120% 70% at 50% 0,rgba(46,196,166,.14),transparent 60%),var(--glass);
  box-shadow:inset 0 0 0 1px var(--rio),0 30px 60px -30px rgba(46,196,166,.35)}
@media(min-width:801px){.plan.featured{transform:translateY(-10px)}.plan.featured.rv:not(.rv-in){transform:translateY(6px)}.plan.featured.rv.rv-in{transform:translateY(-10px)}}
.plan .price{font-variant-numeric:tabular-nums}

/* 4 — capsule intelligente ------------------------------------------------------------ */
.site-header{transition:transform var(--dur-slow) var(--ease),opacity var(--dur-slow) var(--ease)}
.site-header.cache{transform:translateY(calc(-100% - 24px));opacity:0}
.nav-shell::after{content:"";position:absolute;left:30px;right:30px;bottom:-1px;height:2px;border-radius:2px;pointer-events:none;
  background:linear-gradient(90deg,var(--rio),var(--rio-strong));transform:scaleX(var(--lu,0));transform-origin:left;opacity:.9}

/* 5 — retour en haut ------------------------------------------------------------------ */
.back-top{position:fixed;right:16px;bottom:calc(16px + env(safe-area-inset-bottom));z-index:55;width:46px;height:46px;padding:0;border-radius:var(--r-pill);
  display:grid;place-items:center;background:rgba(0,0,0,.6);color:var(--ink);border:1px solid var(--line-strong);
  -webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:var(--shadow-md);
  opacity:0;transform:translateY(10px);pointer-events:none;transition:opacity var(--dur) var(--ease),transform var(--dur) var(--ease),bottom var(--dur) var(--ease)}
.back-top svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.back-top.on{opacity:1;transform:none;pointer-events:auto}
@media(hover:hover){.back-top:hover{background:rgba(0,0,0,.8);border-color:rgba(255,255,255,.4)}}

/* 6 — barre d'action sur téléphone ----------------------------------------------------- */
.mobile-cta{display:none}
@media(max-width:760px){
  .mobile-cta{display:flex;position:fixed;left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom));z-index:54;padding:6px;border-radius:var(--r-pill);
    background:rgba(11,12,14,.82);border:1px solid var(--line-strong);box-shadow:var(--shadow-lg);
    -webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);
    opacity:0;transform:translateY(120%);pointer-events:none;transition:opacity var(--dur) var(--ease),transform var(--dur) var(--ease)}
  .mobile-cta.on{opacity:1;transform:none;pointer-events:auto}
  .mobile-cta .btn{flex:1;min-height:48px;font-size:15px}
  body:has(.mobile-cta.on) .back-top{bottom:calc(84px + env(safe-area-inset-bottom))}
}

@media(prefers-reduced-motion:reduce){
  .rv{opacity:1!important;transform:none!important}
  .site-header.cache{transform:none;opacity:1}
  .plan.featured{transform:none}
}