/* =========================================================
   DESIGN CHIC MINIMAL + ANIMATIONS AVANCÉES SUR LES CARTES
   (bloc additionnel — le code d'origine reste intact)
   Principe : peu d'effets, mais des effets précis et orchestrés.
   ========================================================= */

/* ---------- Raffinements minimalistes globaux ---------- */
#glf{ --ease:cubic-bezier(.22,1,.36,1); }
#glf .glf-k{ letter-spacing:.22em; font-weight:700; }
#glf .glf-panel, #glf .glf-scard, #glf .glf-metric, #glf .glf-img-card, #glf .glf-photo{
  border-color:rgba(0,0,0,.08); border-radius:22px;
}
[data-theme="dark"] #glf .glf-panel,[data-theme="dark"] #glf .glf-scard,
[data-theme="dark"] #glf .glf-metric,[data-theme="dark"] #glf .glf-img-card,
[data-theme="dark"] #glf .glf-photo{ border-color:rgba(255,255,255,.1); }
#glf .glf-scard:hover{ transform:translateY(-6px); rotate:0deg; box-shadow:0 30px 60px -50px rgba(0,0,0,.5); }
#glf .glf-wave{ display:none; } /* on retire le blob décoratif : plus sobre */

/* Images : noir & blanc par défaut, couleur au survol — signature chic */
#glf .glf-img-card img, #glf .glf-photo img{
  filter:grayscale(1) contrast(1.04);
  transition:filter 1s var(--ease), transform 1.2s var(--ease);
}
#glf .glf-img-card:hover img, #glf .glf-photo:hover img{ filter:grayscale(0) contrast(1); }
#glf .glf-hero-img img{ filter:grayscale(.35); }

/* ---------- Barre de progression (fine, discrète) ---------- */
#glfProgress{ position:fixed; top:0; left:0; height:2px; width:100%; z-index:9999;
  transform-origin:0 50%; transform:scaleX(0); pointer-events:none;
  background:linear-gradient(90deg,var(--acc,#FF8A3D),var(--acc2,#FF6B1A)); }

/* ---------- H1 lettre par lettre (inchangé, plus doux) ---------- */
#glf .glf-word{ display:inline-block; white-space:nowrap; }
#glf .glf-ch{ display:inline-block; opacity:0; transform:translateY(.6em); filter:blur(5px); }
#glf .glf-ch.on{ opacity:1; transform:none; filter:blur(0);
  transition:opacity .8s var(--ease),transform .8s var(--ease),filter .8s; }

/* =========================================================
   CARTES SERVICES (.glf-scard) — chorégraphie complète
   1. Entrée : révélation par clip-path + trait qui se dessine
   2. Survol : bordure lumineuse qui se trace, contenu qui se
      réorganise, pastille qui pivote, flèche qui apparaît
   ========================================================= */

/* 1 — Entrée orchestrée (remplace le simple fade du data-rv) */
.glf-js #glf .glf-cards .glf-scard[data-rv]{
  opacity:0; transform:translateY(34px); filter:none;
  clip-path:inset(14% 6% 14% 6% round 22px);
}
.glf-js #glf .glf-cards .glf-scard[data-rv].in{
  opacity:1; transform:none; clip-path:inset(0 0 0 0 round 22px);
  transition:opacity .9s var(--ease),transform .9s var(--ease),clip-path 1.1s var(--ease);
  transition-delay:var(--d,0s);
}

/* Trait supérieur qui se dessine à l'entrée */
#glf .glf-scard{ isolation:isolate; }
#glf .glf-scard .glf-line{
  position:absolute; left:1rem; right:1rem; top:0; height:1px;
  background:linear-gradient(90deg,var(--acc,#FF8A3D),transparent);
  transform:scaleX(0); transform-origin:0 50%;
}
#glf .glf-scard.in .glf-line{ transform:scaleX(1); transition:transform 1.2s var(--ease) calc(var(--d,0s) + .45s); }

/* 2 — Bordure qui se trace au survol (conic + @property) */
@property --tr{ syntax:'<percentage>'; initial-value:0%; inherits:false; }
#glf .glf-scard:before{
  content:""; position:absolute; inset:0; border-radius:inherit; padding:1px; z-index:1;
  background:conic-gradient(from -90deg, var(--acc,#FF8A3D) var(--tr), transparent 0);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor; mask-composite:exclude;
  pointer-events:none; --tr:0%; transition:--tr 1s var(--ease), opacity .4s; opacity:0;
}
#glf .glf-scard:hover:before{ --tr:100%; opacity:1; }
#glf .glf-scard.accent:before{ background:conic-gradient(from -90deg, #fff var(--tr), transparent 0); }

/* Halo qui suit la souris (très léger) */
#glf .glf-scard:after, #glf .glf-metric:after, #glf .glf-panel:after{
  content:""; position:absolute; inset:0; border-radius:inherit; pointer-events:none;
  opacity:0; transition:opacity .5s;
  background:radial-gradient(300px circle at var(--mx,50%) var(--my,50%), rgba(255,138,61,.1), transparent 60%);
}
#glf .glf-metric{ position:relative; overflow:hidden; }
#glf .glf-scard:hover:after, #glf .glf-metric:hover:after, #glf .glf-panel:hover:after{ opacity:1; }

/* Chorégraphie du contenu au survol */
#glf .glf-scard .circle{ transition:transform .7s var(--ease), background .5s, color .5s; }
#glf .glf-scard:hover .circle{ transform:rotate(360deg) scale(1.08); background:var(--acc); color:#160B03; }
#glf .glf-scard.accent:hover .circle{ background:#000; color:#fff; }
#glf .glf-scard.dark:hover .circle{ background:#fff; color:#000; }
#glf .glf-scard h3{ transition:transform .6s var(--ease); }
#glf .glf-scard:hover h3{ transform:translateY(-4px); }
#glf .glf-scard p{ transition:transform .6s var(--ease) .05s, color .5s; }
#glf .glf-scard:hover p{ transform:translateY(-4px); }
#glf .glf-scard:hover p{ color:var(--ink); }
#glf .glf-scard.dark:hover p{ color:rgba(255,255,255,.85); }
#glf .glf-scard.accent:hover p{ color:rgba(0,0,0,.85); }

/* Flèche cachée qui apparaît en bas de carte */
#glf .glf-scard .glf-go{
  position:absolute; right:1rem; bottom:1rem; width:32px; height:32px; border-radius:50%;
  display:grid; place-items:center; font-size:.85rem;
  border:1px solid currentColor; opacity:0; transform:translateY(8px) rotate(-45deg);
  transition:opacity .5s var(--ease) .08s, transform .55s var(--ease) .08s;
}
#glf .glf-scard:hover .glf-go{ opacity:1; transform:translateY(0) rotate(0deg); }

/* Reflet lumineux qui balaie la carte une seule fois au survol */
#glf .glf-scard .glf-sheen{
  position:absolute; inset:0; pointer-events:none; overflow:hidden; border-radius:inherit;
}
#glf .glf-scard .glf-sheen:before{
  content:""; position:absolute; top:-20%; bottom:-20%; width:38%; left:-60%;
  background:linear-gradient(105deg,transparent,rgba(255,255,255,.32),transparent);
  transform:skewX(-18deg);
}
#glf .glf-scard:hover .glf-sheen:before{ animation:glfSheen 1s var(--ease) forwards; }
@keyframes glfSheen{ to{ left:130%; } }

/* =========================================================
   AUTRES CARTES — mêmes principes, dosés
   ========================================================= */

/* Métriques : trait accent qui se dessine à l'apparition */
#glf .glf-metric{ overflow:hidden; }
#glf .glf-metric:before{
  content:""; position:absolute; left:1rem; top:0; height:2px; width:34px;
  background:var(--acc,#FF8A3D); transform:scaleX(0); transform-origin:0 50%; border-radius:99px;
}
#glf [data-rv].in .glf-metric:before, #glf .glf-metric.in:before{
  transform:scaleX(1); transition:transform .9s var(--ease) .5s; }
#glf .glf-metric{ transition:transform .5s var(--ease), border-color .5s; }
#glf .glf-metric:hover{ transform:translateY(-4px); border-color:rgba(255,138,61,.5); }

/* Cartes flottantes du hero : verre plus fin */
#glf .glf-float-card{ border-radius:16px; background:rgba(255,255,255,.09); border-color:rgba(255,255,255,.18); }

/* Lignes de la timeline : fond qui glisse + flèche remplie */
#glf .glf-row{ position:relative; }
#glf .glf-row:before{
  content:""; position:absolute; inset:0; background:var(--soft,#FFF6EF); z-index:-1;
  border-radius:14px; transform:scaleX(0); transform-origin:0 50%; transition:transform .55s var(--ease);
}
#glf .glf-row:hover:before{ transform:scaleX(1); }
#glf .glf-row:hover{ padding-left:1rem; padding-right:.6rem; color:var(--ink); border-color:transparent; }
#glf .glf-row:hover h3{ color:var(--acc); }
#glf .glf-row .go{ transition:.45s var(--ease); }
#glf .glf-row:hover .go{ background:var(--ink); color:var(--paper); transform:rotate(45deg); }

/* Carte finale : liseré tournant très fin et lent (présence discrète) */
@property --rot{ syntax:'<angle>'; initial-value:0deg; inherits:false; }
#glf .glf-final-card:after{
  content:""; position:absolute; inset:-1px; z-index:0; border-radius:inherit; padding:1px;
  background:conic-gradient(from var(--rot,0deg), transparent 0 74%, rgba(255,138,61,.9) 86%, transparent 94%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor; mask-composite:exclude;
  animation:glfRot 9s linear infinite;
}
@keyframes glfRot{ to{ --rot:360deg; } }
@supports not (background:conic-gradient(from var(--rot,0deg),#000,#fff)){ #glf .glf-final-card:after{ display:none; } }

/* Boutons : sobres, un seul accent — reflet périodique sur le CTA principal */
#glf .glf-btn{ position:relative; overflow:hidden; }
#glf .glf-btn:active{ transform:translateY(-1px) scale(.98); }
#glf .glf-btn.primary:before{
  content:""; position:absolute; top:-30%; bottom:-30%; width:34%; left:-60%;
  background:linear-gradient(105deg,transparent,rgba(255,255,255,.5),transparent);
  transform:skewX(-18deg); animation:glfBtnSheen 4.5s ease-in-out 2s infinite;
}
@keyframes glfBtnSheen{ 0%,58%{ left:-60%; } 78%,100%{ left:130%; } }

/* Soulignement fin des titres à l'apparition */
#glf .glf-head h2, #glf .glf-result h2, #glf .glf-panel h2{ position:relative; display:inline-block; }
#glf .glf-head h2:after, #glf .glf-result h2:after, #glf .glf-panel h2:after{
  content:""; position:absolute; left:0; bottom:-.16em; height:1px; width:100%;
  background:currentColor; opacity:.25; transform:scaleX(0); transform-origin:0 50%;
}
#glf [data-rv].in h2:after, #glf .glf-head[data-rv].in h2:after{
  transform:scaleX(1); transition:transform 1.2s var(--ease) .4s; }



/* =========================================================
   SECTION AUDIENCE — "À qui s'adresse ce service ?" + Pourquoi SYO
   ========================================================= */
.glf-audience{ padding:1rem 0 2.6rem; border-top:1px solid var(--line); }
.glf-aud-head{ max-width:60ch; margin-bottom:1.4rem; }
.glf-aud-head h2{ margin-top:.5rem; font-size:clamp(1.3rem,3vw,2.2rem); line-height:1.05; letter-spacing:-.03em; font-weight:760; }
.glf-chips{ display:flex; flex-wrap:wrap; gap:.6rem; }
.glf-chips span{ display:inline-flex; align-items:center; gap:.5rem; border:1px solid var(--line); border-radius:999px;
  padding:.55rem .95rem; font-size:.82rem; font-weight:700; background:var(--card); transition:.35s cubic-bezier(.16,1,.3,1); }
.glf-chips span i{ font-style:normal; font-weight:500; font-size:.72rem; color:var(--dim); }
.glf-chips span:hover{ border-color:rgba(255,138,61,.55); transform:translateY(-3px); box-shadow:0 20px 40px -30px rgba(0,0,0,.45); }
.glf-why{ display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; margin-top:1.6rem; }
.glf-why > div{ border:1px solid var(--line); border-radius:18px; padding:1.1rem; background:var(--card); }
.glf-why b{ display:block; font-size:.95rem; letter-spacing:-.01em; }
.glf-why span{ display:block; margin-top:.35rem; font-size:.8rem; line-height:1.5; color:var(--dim); }
@media(max-width:820px){ .glf-why{ grid-template-columns:1fr; } }

/* =========================================================
   SIGNATURE LEADS FRANCE — tunnel de conversion (barres + compteurs)
   ========================================================= */
#glf .glf-funnel{ padding:.9rem; }
#glf .glf-funnel-head{ display:flex; align-items:center; gap:.45rem; font-size:.72rem; font-weight:800;
  letter-spacing:.02em; color:#fff; margin-bottom:.65rem; }
#glf .glf-fdot{ width:8px; height:8px; border-radius:50%; background:var(--acc,#FF8A3D);
  box-shadow:0 0 0 0 rgba(255,138,61,.6); animation:glfFdot 1.9s ease-out infinite; }
@keyframes glfFdot{ 0%{ box-shadow:0 0 0 0 rgba(255,138,61,.55); } 70%,100%{ box-shadow:0 0 0 9px rgba(255,138,61,0); } }
#glf .glf-funnel-row{ position:relative; display:flex; justify-content:space-between; align-items:center;
  padding:.42rem .6rem; margin:.3rem auto; border-radius:8px; overflow:hidden; width:100%;
  font-size:.68rem; color:rgba(255,255,255,.9); }
#glf .glf-funnel-row:before{ content:""; position:absolute; inset:0; z-index:0; border-radius:8px; width:0;
  background:linear-gradient(90deg,rgba(255,138,61,.55),rgba(255,107,26,.28)); }
#glf .glf-funnel.in .glf-funnel-row:before{ width:var(--w,100%); transition:width 1.1s cubic-bezier(.19,1,.22,1) var(--fd,0s); }
#glf .glf-funnel-row span, #glf .glf-funnel-row b{ position:relative; z-index:1; }
#glf .glf-funnel-row b{ font-weight:850; font-size:.8rem; letter-spacing:-.02em; }
/* largeur visuelle décroissante = forme d'entonnoir */
#glf .glf-funnel-row{ width:var(--w,100%); }

@media(prefers-reduced-motion:reduce){
  #glf .glf-fdot{ animation:none !important; }
  #glf .glf-funnel .glf-funnel-row:before{ width:var(--w,100%) !important; }
}

/* Accessibilité : tout se coupe si l'utilisateur préfère moins de mouvement */
@media(prefers-reduced-motion:reduce){
  #glfProgress{ display:none !important; }
  #glf .glf-ch{ opacity:1 !important; transform:none !important; filter:none !important; }
  .glf-js #glf .glf-cards .glf-scard[data-rv]{ opacity:1; transform:none; clip-path:none; }
  #glf .glf-scard .glf-line{ transform:scaleX(1); }
  #glf .glf-final-card:after, #glf .glf-btn.primary:before{ animation:none !important; }
  #glf .glf-img-card img, #glf .glf-photo img{ filter:none; }
}


/* =========================================================
   CONTENU ÉDITORIAL — ACQUISITION MARCHÉ FRANÇAIS
   ========================================================= */
#glf .glf-hero-card{
  min-height:650px; grid-template-columns:minmax(0,1fr) minmax(310px,370px);
  align-items:center; gap:clamp(.5rem,2vw,1.5rem);
}
#glf .glf-hero-content{ max-width:none; padding-right:0; }
#glf .glf-hero-content h1{ max-width:13ch; font-size:clamp(2.25rem,5.7vw,5.35rem); }
#glf .glf-hero-content p{ max-width:72ch; font-size:clamp(.84rem,1.15vw,1rem); }
#glf .glf-hero-content p + p{ margin-top:.55rem; }
#glf .glf-hero-content .glf-hero-emphasis{ margin-top:1rem; color:#fff; font-weight:700; }

/* Formulaire visible dès le début de la page */
#glf .glf-lead-card{
  position:relative; z-index:3; margin:clamp(1.2rem,3vw,2.2rem) clamp(1.2rem,3vw,2.2rem) clamp(1.2rem,3vw,2.2rem) 0;
  padding:1.25rem; border:1px solid rgba(255,255,255,.7); border-radius:24px;
  color:#111; background:rgba(255,255,255,.94); backdrop-filter:blur(20px);
  box-shadow:0 30px 80px -30px rgba(0,0,0,.65); overflow:hidden;
}
#glf .glf-lead-card:before{
  content:""; position:absolute; inset:0 0 auto; height:4px;
  background:linear-gradient(90deg,var(--acc),var(--acc2));
}
#glf .glf-lead-eyebrow{
  display:flex; align-items:center; gap:.5rem; color:#6E6E73;
  font-size:.64rem; font-weight:850; letter-spacing:.12em; text-transform:uppercase;
}
#glf .glf-lead-eyebrow:before{
  content:""; width:8px; height:8px; border-radius:50%; background:var(--acc);
  box-shadow:0 0 0 5px rgba(255,138,61,.14);
}
#glf .glf-lead-card h2{
  margin:.75rem 0 .35rem; font-size:clamp(1.35rem,2.4vw,1.75rem);
  line-height:1.05; letter-spacing:-.04em;
}
#glf .glf-lead-intro{ margin:0 0 1rem; color:#6E6E73; font-size:.76rem; line-height:1.5; }
#glf .glf-lead-form{ display:grid; gap:.72rem; }
#glf .glf-lead-field{ display:grid; gap:.3rem; }
#glf .glf-lead-field label{ color:#333; font-size:.68rem; font-weight:800; }
#glf .glf-lead-field input{
  width:100%; height:47px; padding:0 .85rem; border:1px solid rgba(0,0,0,.13);
  border-radius:13px; outline:none; color:#111; background:#fff;
  font:inherit; font-size:.78rem; transition:border-color .25s,box-shadow .25s,transform .25s;
}
#glf .glf-lead-field input::placeholder{ color:#96969b; }
#glf .glf-lead-field input:focus{
  border-color:var(--acc); box-shadow:0 0 0 4px rgba(255,138,61,.14); transform:translateY(-1px);
}
#glf .glf-lead-submit{
  width:100%; height:49px; margin-top:.12rem; padding:0 1rem; border:0; border-radius:14px;
  display:flex; align-items:center; justify-content:center; gap:.65rem; cursor:pointer;
  color:#160B03; background:linear-gradient(135deg,var(--acc),var(--acc2));
  box-shadow:0 17px 32px -20px rgba(255,107,26,.9); font:inherit; font-size:.78rem; font-weight:900;
  transition:transform .25s,box-shadow .25s,filter .25s;
}
#glf .glf-lead-submit:hover{ transform:translateY(-2px); box-shadow:0 22px 38px -20px rgba(255,107,26,1); filter:saturate(1.08); }
#glf .glf-lead-submit:focus-visible{ outline:3px solid rgba(255,138,61,.35); outline-offset:3px; }
#glf .glf-lead-submit[disabled]{ cursor:wait; opacity:.75; transform:none; }
#glf .glf-lead-note{ margin:.05rem 0 0; color:#777; font-size:.62rem; line-height:1.45; text-align:center; }
#glf .glf-lead-status{
  margin:0 0 .8rem; padding:.7rem .78rem; border-radius:12px; font-size:.7rem; font-weight:750; line-height:1.45;
}
#glf .glf-lead-status.success{ color:#176338; background:#EAF8F0; border:1px solid #BCE8CD; }
#glf .glf-lead-status.error{ color:#8B2E24; background:#FFF0ED; border:1px solid #F2C8C2; }
#glf .glf-honeypot{ position:absolute!important; left:-10000px!important; width:1px!important; height:1px!important; overflow:hidden!important; }

#glf .glf-rule-panel h2{ max-width:18ch; }
#glf .glf-rule-panel p{ max-width:74ch; }
#glf .glf-rule-panel p + p{ margin-top:.65rem; }

#glf .glf-service-intro{ max-width:78ch; margin:.3rem 0 1.25rem; color:var(--dim); line-height:1.65; font-size:.86rem; }
#glf .glf-cards{ grid-template-columns:repeat(3,1fr); }
#glf .glf-scard{ min-height:275px; }
#glf .glf-scard h3{ margin-top:2rem; }

#glf .glf-path-banner{
  border-radius:24px; padding:1.25rem; background:var(--dark); color:#fff;
  display:flex; align-items:center; justify-content:center; text-align:center;
  font-size:clamp(.8rem,1.5vw,1.05rem); font-weight:850; line-height:1.6;
  letter-spacing:.02em; box-shadow:0 28px 65px -52px #000;
}
#glf .glf-path-copy{ margin-top:1rem; color:var(--dim); line-height:1.65; font-size:.86rem; max-width:78ch; }

#glf .glf-why-copy{ max-width:78ch; }
#glf .glf-why-copy p{ margin-top:.8rem; color:var(--dim); line-height:1.65; font-size:.86rem; }

#glf .glf-final-card{ grid-template-columns:minmax(0,1fr) auto; }
#glf .glf-final-copy{ position:relative; z-index:1; max-width:78ch; }
#glf .glf-final-copy p{ max-width:74ch; }
#glf .glf-final-copy p + p{ margin-top:.55rem; }
#glf .glf-final-actions{ position:relative; z-index:2; }

#glf .glf-contact{ padding:0 0 2rem; }
#glf .glf-contact-card{
  border:1px solid var(--line); border-radius:26px; padding:1.25rem;
  background:var(--card); display:grid; grid-template-columns:repeat(3,1fr); gap:.8rem;
}
#glf .glf-contact-item{ border:1px solid var(--line); border-radius:18px; padding:1rem; background:var(--paper); }
#glf .glf-contact-item b{ display:block; font-size:.72rem; color:var(--acc); text-transform:uppercase; letter-spacing:.12em; }
#glf .glf-contact-item a{ display:block; margin-top:.45rem; font-weight:800; font-size:.9rem; overflow-wrap:anywhere; }
#glf .glf-disclaimer{ margin-top:1rem; color:var(--dim); font-size:.76rem; line-height:1.55; }

@media(max-width:900px){
  #glf .glf-cards{ grid-template-columns:repeat(2,1fr); }
  #glf .glf-final-card, #glf .glf-contact-card{ grid-template-columns:1fr; }
  #glf .glf-hero-card{ grid-template-columns:1fr; align-items:start; gap:0; }
  #glf .glf-hero-content{ padding-bottom:1.4rem; }
  #glf .glf-lead-card{ width:auto; margin:0 1.3rem 1.3rem; }
}
@media(max-width:560px){
  #glf .glf-cards{ grid-template-columns:1fr; }
  #glf .glf-hero-content h1{ max-width:none; }
  #glf .glf-hero-card{ min-height:auto; }
  #glf .glf-lead-card{ margin:0 .85rem .85rem; padding:1rem; border-radius:20px; }
}
