/* =========================================================
   APPLICATIONS MOBILES & DESKTOP — design flexible premium + animations
   Charte SYO Web : orange / blanc / noir
   ========================================================= */
#rf{
  --paper:#FFFFFF; --soft:#FFF6EF; --card:#FFFFFF; --ink:#000000; --dim:#6E6E73;
  --line:rgba(0,0,0,.11);   --acc:#FF8A3D; --acc2:#F57323; --dark:#080808;
  position:relative; overflow:hidden; background:var(--paper); color:var(--ink);
  font-family:"Schibsted Grotesk",system-ui,-apple-system,Segoe UI,sans-serif;
}
#intro,#cur-dot,#cur-ring{display:none!important}
body.locked{overflow:auto!important;height:auto!important}
[data-theme="dark"] #rf{ --paper:#000; --soft:#0E0B08; --card:#141212; --ink:#fff; --dim:#A1A1A6; --line:rgba(255,255,255,.14); --dark:#050505; }
#rf *{ box-sizing:border-box; }
#rf a{ color:inherit; text-decoration:none; }
#rf .mono{ font-family:"JetBrains Mono",monospace; }
.rf-wrap{ width:min(1180px,calc(100% - 32px)); margin:0 auto; }
.rf-js [data-rv]{ opacity:0; transform:translateY(28px) scale(.985); filter:blur(8px); }
.rf-js [data-rv].in{ opacity:1; transform:none; filter:blur(0); transition:opacity .9s cubic-bezier(.16,1,.3,1),transform .9s cubic-bezier(.16,1,.3,1),filter .9s; transition-delay:var(--d,0s); }
.rf-pill{ display:inline-flex; align-items:center; gap:.45rem; min-height:34px; padding:.38rem .82rem; border:1px solid var(--line); border-radius:999px; font-size:.68rem; font-weight:700; color:var(--dim); background:rgba(255,255,255,.68); backdrop-filter:blur(14px); }
[data-theme="dark"] #rf .rf-pill{ background:rgba(255,255,255,.04); }
.rf-pill:before{ content:""; width:7px; height:7px; border-radius:50%; background:var(--acc); box-shadow:0 0 0 5px rgba(255,138,61,.12); }
.rf-btn{ display:inline-flex; align-items:center; justify-content:center; gap:.6rem; height:44px; padding:0 1.25rem; border-radius:999px; border:1px solid var(--line); font-size:.78rem; font-weight:800; transition:.35s cubic-bezier(.16,1,.3,1); }
.rf-btn.primary{ border-color:transparent; background:linear-gradient(135deg,var(--acc),var(--acc2)); color:#160B03; box-shadow:0 18px 36px -20px rgba(255,107,26,.8); }
.rf-btn:hover{ transform:translateY(-3px); }
.rf-btn .ar{ width:24px; height:24px; border-radius:50%; background:#000; color:#fff; display:grid; place-items:center; transition:.35s; }
.rf-btn:hover .ar{ transform:rotate(45deg); }
.rf-k{ color:var(--acc); font-family:"JetBrains Mono",monospace; font-size:.68rem; text-transform:uppercase; letter-spacing:.13em; font-weight:800; }

/* HERO similaire au screen */
.rf-hero{ padding:calc(var(--header-h,80px) + 22px) 0 2.6rem; }
.rf-hero-card{ position:relative; min-height:620px; border-radius:0 0 34px 34px; overflow:hidden; display:grid; align-items:end; isolation:isolate; background:#111; }
.rf-hero-card:after{ content:""; position:absolute; inset:0; z-index:1; background:linear-gradient(90deg,rgba(0,0,0,.58),rgba(0,0,0,.18) 50%,rgba(0,0,0,.05)); }
.rf-hero-img{ position:absolute; inset:0; z-index:0; }
.rf-hero-img img{ width:100%; height:100%; object-fit:cover; transform:scale(1.06); animation:rfKen 12s ease-in-out infinite alternate; }
@keyframes rfKen{ to{ transform:scale(1.13) translate3d(-1.5%,1%,0); } }
.rf-hero-content{ position:relative; z-index:2; padding:clamp(1.3rem,4vw,3.2rem); color:#fff; max-width:800px; }
.rf-hero-content h1{ font-size:clamp(2.45rem,6vw,5.9rem); line-height:.86; letter-spacing:-.065em; font-weight:850; max-width:8.6ch; }
.rf-hero-content h1 span{ color:var(--acc); }
.rf-hero-content p{ margin-top:1rem; max-width:58ch; font-size:.88rem; line-height:1.65; color:rgba(255,255,255,.82); }
.rf-cta{ display:flex; gap:.7rem; flex-wrap:wrap; margin-top:1.35rem; }
.rf-floating{ position:absolute; right:clamp(1rem,4vw,3rem); bottom:clamp(1rem,4vw,3rem); z-index:3; display:grid; gap:.65rem; width:min(290px,42vw); }
.rf-float-card{ border:1px solid rgba(255,255,255,.25); background:rgba(255,255,255,.12); backdrop-filter:blur(16px); color:#fff; border-radius:20px; padding:.85rem; transform-style:preserve-3d; animation:rfFloat 5s ease-in-out infinite; }
.rf-float-card:nth-child(2){ animation-delay:-1.7s; }
.rf-float-card b{ display:block; font-size:.9rem; } .rf-float-card span{ display:block; margin-top:.2rem; font-size:.68rem; color:rgba(255,255,255,.75); }
@keyframes rfFloat{ 0%,100%{ transform:translateY(0) rotate(.2deg); } 50%{ transform:translateY(-10px) rotate(-.6deg); } }

/* Benefit top */
.rf-benefit{ padding:2rem 0; }
.rf-bgrid{ display:grid; grid-template-columns:1.1fr .9fr; gap:1rem; align-items:stretch; }
.rf-panel{ border:1px solid var(--line); border-radius:28px; background:var(--card); padding:1.35rem; position:relative; overflow:hidden; }
.rf-panel h2{ font-size:clamp(1.45rem,3.2vw,2.7rem); line-height:1; letter-spacing:-.045em; font-weight:780; max-width:12ch; }
.rf-panel p{ margin-top:.8rem; color:var(--dim); line-height:1.65; font-size:.84rem; max-width:62ch; }
.rf-mini-list{ margin-top:1rem; display:grid; gap:.55rem; }
.rf-mini-list li{ display:flex; justify-content:space-between; align-items:center; border:1px solid var(--line); border-radius:14px; padding:.7rem .85rem; color:var(--dim); font-size:.78rem; background:var(--paper); }
.rf-mini-list b{ color:var(--ink); }
.rf-img-card{ min-height:320px; border-radius:28px; overflow:hidden; position:relative; border:1px solid var(--line); background:var(--soft); }
.rf-img-card img{ width:100%; height:100%; object-fit:cover; transition:transform 1s cubic-bezier(.16,1,.3,1); }
.rf-img-card:hover img{ transform:scale(1.08); }
.rf-tag{ position:absolute; left:1rem; top:1rem; background:#fff; color:#000; border-radius:999px; padding:.45rem .8rem; font-size:.7rem; font-weight:800; box-shadow:0 15px 35px -22px #000; }

/* Program */
.rf-program{ padding:1rem 0 2.2rem; }
.rf-prog-grid{ display:grid; grid-template-columns:.55fr .9fr .85fr; gap:1rem; }
.rf-num{ border-top:1px solid var(--line); padding-top:1rem; }
.rf-num b{ font-size:clamp(2rem,5vw,4rem); font-weight:300; letter-spacing:-.05em; }
.rf-dark{ background:var(--dark); color:#fff; border-radius:28px; padding:1.35rem; min-height:300px; position:relative; overflow:hidden; }
.rf-dark:before{ content:""; position:absolute; inset:auto -25% -40% auto; width:70%; height:70%; background:radial-gradient(circle,var(--acc),transparent 65%); opacity:.35; filter:blur(20px); }
.rf-dark h3{ position:relative; font-size:clamp(1.15rem,2.3vw,1.8rem); line-height:1.05; letter-spacing:-.035em; max-width:11ch; }
.rf-dark p{ position:relative; margin-top:.8rem; color:rgba(255,255,255,.7); line-height:1.55; font-size:.8rem; }
.rf-orbit{ position:absolute; inset:auto 1.1rem 1.1rem auto; width:125px; height:125px; border-radius:50%; border:1px solid rgba(255,255,255,.16); animation:rfSpin 18s linear infinite; }
.rf-orbit:before,.rf-orbit:after{ content:""; position:absolute; width:10px; height:10px; border-radius:50%; background:var(--acc); top:8px; left:55px; box-shadow:0 0 22px var(--acc); }
.rf-orbit:after{ top:auto; bottom:12px; left:24px; background:#fff; box-shadow:none; }
@keyframes rfSpin{ to{ transform:rotate(360deg); } }

.rf-service{ padding:2.2rem 0; }
.rf-head{ display:flex; justify-content:space-between; gap:1rem; align-items:end; margin-bottom:1rem; }
.rf-head h2{ font-size:clamp(1.45rem,3.5vw,2.85rem); line-height:1; letter-spacing:-.045em; font-weight:780; }
.rf-cards{ display:grid; grid-template-columns:repeat(4,1fr); gap:.8rem; }
.rf-scard{ position:relative; min-height:250px; border:1px solid var(--line); border-radius:26px; overflow:hidden; padding:1rem; background:var(--card); transition:.5s cubic-bezier(.16,1,.3,1); }
.rf-scard:hover{ transform:translateY(-8px) rotate(-.6deg); box-shadow:0 32px 80px -55px #000; border-color:rgba(255,138,61,.55); }
.rf-scard.accent{ background:linear-gradient(135deg,var(--acc),var(--acc2)); color:#150900; }
.rf-scard.dark{ background:#050505; color:#fff; }
.rf-scard .circle{ width:36px; height:36px; border-radius:50%; background:rgba(255,138,61,.14); display:grid; place-items:center; font-weight:900; color:var(--acc); }
.rf-scard.accent .circle{ background:#fff; color:#000; } .rf-scard.dark .circle{ background:var(--acc); color:#000; }
.rf-scard h3{ margin-top:2.4rem; font-size:1.08rem; letter-spacing:-.02em; line-height:1.05; }
.rf-scard p{ margin-top:.65rem; font-size:.75rem; line-height:1.55; color:var(--dim); }
.rf-scard.dark p{ color:rgba(255,255,255,.68); } .rf-scard.accent p{ color:rgba(0,0,0,.7); }
.rf-wave{ position:absolute; right:-35px; bottom:-30px; width:140px; height:140px; opacity:.18; border-radius:45% 55% 35% 65%; border:1px solid currentColor; animation:rfBlob 7s ease-in-out infinite; }
@keyframes rfBlob{ 50%{ border-radius:60% 40% 55% 45%; transform:rotate(30deg) scale(1.12); } }

/* Flexible results */
.rf-results{ padding:1.2rem 0 2.6rem; }
.rf-res-grid{ display:grid; grid-template-columns:1fr 1.15fr; gap:1rem; align-items:center; }
.rf-photo{ border-radius:28px; min-height:360px; overflow:hidden; border:1px solid var(--line); background:var(--soft); }
.rf-photo img{ width:100%; height:100%; object-fit:cover; }
.rf-result h2{ font-size:clamp(1.6rem,4vw,3.4rem); line-height:.95; letter-spacing:-.05em; font-weight:760; max-width:11ch; }
.rf-result p{ margin-top:.9rem; color:var(--dim); font-size:.84rem; line-height:1.65; max-width:62ch; }
.rf-metrics{ display:grid; grid-template-columns:repeat(3,1fr); gap:.7rem; margin-top:1rem; }
.rf-metric{ border:1px solid var(--line); border-radius:20px; padding:1rem; background:var(--card); }
.rf-metric b{ display:block; font-size:1.6rem; font-weight:650; letter-spacing:-.04em; } .rf-metric span{ font-size:.68rem; color:var(--dim); }

.rf-timeline{ padding:2.2rem 0 3rem; border-top:1px solid var(--line); }
.rf-rows{ display:grid; gap:.5rem; }
.rf-row{ display:grid; grid-template-columns:110px 1fr 44px; align-items:center; gap:1rem; border-bottom:1px solid var(--line); padding:.8rem 0; transition:.35s; }
.rf-row:hover{ padding-left:.8rem; color:var(--acc); }
.rf-row .n{ font-size:.72rem; color:var(--dim); } .rf-row h3{ font-size:1.02rem; letter-spacing:-.015em; } .rf-row p{ font-size:.75rem; color:var(--dim); line-height:1.45; }
.rf-row .go{ width:38px; height:38px; border-radius:50%; background:var(--soft); display:grid; place-items:center; }

.rf-final{ padding:0 0 3.5rem; }
.rf-final-card{ border-radius:32px; background:#050505; color:#fff; padding:clamp(1.4rem,4vw,3rem); display:grid; grid-template-columns:1fr auto; gap:1rem; align-items:center; overflow:hidden; position:relative; }
.rf-final-card:before{ content:""; position:absolute; right:-10%; top:-50%; width:45%; height:180%; background:radial-gradient(circle,var(--acc),transparent 65%); opacity:.35; filter:blur(12px); }
.rf-final h2{ position:relative; font-size:clamp(1.6rem,4vw,3.3rem); line-height:.98; letter-spacing:-.045em; }
.rf-final p{ position:relative; margin-top:.6rem; color:rgba(255,255,255,.68); font-size:.84rem; }

@media(max-width:900px){
  .rf-floating{ position:relative; right:auto; bottom:auto; width:auto; margin:1rem; }
  .rf-hero-card{ min-height:auto; align-items:start; }
  .rf-bgrid,.rf-prog-grid,.rf-res-grid,.rf-final-card{ grid-template-columns:1fr; }
  .rf-cards{ grid-template-columns:repeat(2,1fr); }
}
@media(max-width:560px){
  .rf-hero{ padding-top:calc(var(--header-h,72px) + 14px); }
  .rf-hero-content h1{ font-size:clamp(2.1rem,15vw,4.2rem); }
  .rf-cards,.rf-metrics{ grid-template-columns:1fr; }
  .rf-row{ grid-template-columns:1fr 38px; }
  .rf-row .n{ grid-column:1/-1; }
}
@media(prefers-reduced-motion:reduce){
  #rf *{ animation:none !important; transition:none !important; }
  .rf-js [data-rv]{ opacity:1; transform:none; filter:none; }
}