/* Les guides de l'app (outils/guides-apps.mjs, 21/10/2026). Chargé après accueil.css et aide.css.
   Mobile d'abord (360/390 px), puis s'élargit. La couleur de l'app arrive en --app (r,g,b) et --app-encre.
   En bas : la version imprimée (A4, claire), d'où outils/guides-pdf.mjs tire les PDF. */
.guide-app{--app:94,234,168;--app-encre:#04150d}
.guide-app main{--app-c:rgb(var(--app))}

/* ── Le haut d'un guide ── */
.ga-hero{background:radial-gradient(50% 45% at 0% 0%,rgba(94,234,168,.07),transparent 70%)}
.ga-hero-grille{display:grid;gap:28px;align-items:center}
@media (min-width:900px){.ga-hero-grille{grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);gap:48px}}
.ga-hero .aide-kick{color:var(--app-c)}
.ga-marque{display:flex;align-items:center;gap:12px;margin:0 0 16px;font-size:22px;font-weight:680;color:#fff;letter-spacing:-.02em}
.ga-marque img{width:48px;height:48px;border-radius:14px;box-shadow:0 10px 30px -12px rgba(var(--app),.7)}
.ga-hero h1{font-size:clamp(30px,5.6vw,52px);line-height:1.04;letter-spacing:-.045em;font-weight:680;color:#fff;text-wrap:balance}
.ga-hero .aide-sous{max-width:640px}
.ga-hero .aide-sous strong{color:#fff;font-weight:620}
.ga-actions{display:flex;flex-direction:column;gap:10px;margin-top:24px}
@media (min-width:560px){.ga-actions{flex-direction:row;flex-wrap:wrap}}
.ga-actions .bouton{min-height:52px;padding:0 22px;font-size:15.5px}
.ga-btn-app{background:var(--app-c);color:var(--app-encre);box-shadow:0 18px 50px -20px rgba(var(--app),.8),inset 0 1px 0 rgba(255,255,255,.35)}
.ga-btn-app:hover{background:var(--app-c);filter:brightness(1.08)}
/* La sculpture : détourée, sans cadre, un halo doux de la couleur de l'app (comme .pa-art des fiches d'app). */
.ga-art{position:relative;display:flex;justify-content:center;isolation:isolate;justify-self:center;width:100%;-webkit-mask-image:radial-gradient(closest-side,#000 62%,transparent);mask-image:radial-gradient(closest-side,#000 62%,transparent)}
.ga-art picture{display:contents}
.ga-art canvas{margin-inline:auto}
.ga-art::before{content:"";position:absolute;inset:12% 10%;z-index:-1;border-radius:50%;background:radial-gradient(closest-side,rgba(var(--app),.32),transparent);filter:blur(30px)}
.ga-art img{display:block;width:min(400px,100%);height:auto}
.ga-art img.ga-art-icone{width:min(150px,46%);margin:70px 0;border-radius:26%}
@media (max-width:899px){.ga-art{order:-1;margin-bottom:-18px}.ga-art img{width:min(280px,72%)}.ga-art img.ga-art-icone{width:120px;margin:24px 0}}
@media (max-width:560px){.ga-art img{width:min(210px,58%)}}

/* ── Les blocs ── */
.ga-corps{max-width:980px}
.ga-bloc{margin-top:clamp(40px,7vw,64px)}
.ga-bloc>h2{margin:0 0 18px;font-size:clamp(23px,3.4vw,31px);line-height:1.15;letter-spacing:-.03em;font-weight:650;color:#fff;text-wrap:balance}
.ga-capture{margin:0;border-radius:18px;overflow:hidden;border:1px solid var(--a-bord);background:#0a1320;box-shadow:0 40px 90px -40px rgba(0,0,0,.95),0 0 0 1px rgba(var(--app),.08)}
.ga-fenetre{display:flex;gap:6px;padding:10px 12px;background:rgba(255,255,255,.04);border-bottom:1px solid var(--a-bord)}
.ga-fenetre i{width:9px;height:9px;border-radius:50%;background:rgba(255,255,255,.18)}
.ga-capture img{display:block;width:100%;height:auto}

/* Ce que tu peux faire */
.ga-cas{display:grid;gap:12px}
@media (min-width:760px){.ga-cas{grid-template-columns:1fr 1fr;gap:16px}.ga-cas.un{grid-template-columns:1fr}}
html[data-espace="agence"] .ga-cas-carte[data-cote="agence"]{order:-1}
.ga-cas-carte{padding:20px;border-radius:var(--a-r);border:1px solid var(--a-bord);background:var(--a-carte)}
html[data-espace="entreprise"] .ga-cas-carte[data-cote="entreprise"],html[data-espace="agence"] .ga-cas-carte[data-cote="agence"]{border-color:rgba(var(--app),.45);background:linear-gradient(160deg,rgba(var(--app),.09),rgba(255,255,255,.02))}
.ga-cas-carte h3{display:flex;align-items:center;gap:10px;margin:0 0 12px;font-size:17px;font-weight:650;color:#fff}
.ga-cas-ic{display:grid;place-items:center;flex:none;width:38px;height:38px;border-radius:12px;background:rgba(var(--app),.14);color:var(--app-c)}
.ga-cas-carte ul{margin:0;padding:0;list-style:none;display:grid;gap:10px}
.ga-cas-carte li{position:relative;padding-left:24px;color:var(--a-texte);font-size:16px;line-height:1.5}
.ga-cas-carte li::before{content:"";position:absolute;left:3px;top:.55em;width:10px;height:10px;border-radius:3px;background:var(--app-c);opacity:.85;transform:rotate(45deg)}

/* L'équipe */
.ga-agents{display:grid;gap:12px}
@media (min-width:860px){.ga-agents{grid-template-columns:repeat(auto-fit,minmax(360px,1fr))}}
.ga-agent{display:flex;gap:16px;align-items:flex-start;padding:20px;border-radius:var(--a-r);border:1px solid var(--a-bord);background:radial-gradient(90% 120% at 0% 0%,color-mix(in srgb,var(--ag) 14%,transparent),transparent 60%),var(--a-carte)}
.ga-agent-fig{flex:none;width:76px;height:76px;border-radius:50%;box-shadow:0 0 0 2px color-mix(in srgb,var(--ag) 55%,transparent),0 16px 40px -14px var(--ag)}
@media (min-width:560px){.ga-agent-fig{width:96px;height:96px}}
.ga-agent-txt{min-width:0}
.ga-agent h3{margin:2px 0 6px;font-size:19px;font-weight:680;color:#fff}
.ga-agent h3 small{display:inline-block;margin-left:6px;padding:2px 9px;border-radius:999px;font-size:12px;font-weight:600;letter-spacing:.02em;vertical-align:middle;color:var(--ag);background:color-mix(in srgb,var(--ag) 14%,transparent)}
.ga-agent p{margin:0;color:var(--a-texte);font-size:15.5px;line-height:1.55}
.ga-demande-t{margin-top:12px!important;font-size:12px!important;font-weight:650;letter-spacing:.1em;text-transform:uppercase;color:#8597ab!important}
.ga-demandes{margin:8px 0 0;padding:0;list-style:none;display:flex;flex-wrap:wrap;gap:8px}
.ga-demandes li{padding:8px 12px;border-radius:14px 14px 14px 4px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);color:#e9eff5;font-size:14.5px;line-height:1.35}
.ga-sans-agent{margin:0;padding:18px 20px;border-radius:var(--a-r);border:1px dashed var(--a-bord);color:var(--a-texte)}

/* Le pas à pas */
.ga-sous-titre{margin:0 0 16px;font-size:17px;font-weight:600;color:#aebccb}
.ga-etapes-corps{color:var(--a-texte);font-size:16px;line-height:1.6}
.ga-etapes-corps>*{margin:0 0 14px}
.ga-etapes-corps strong{color:#fff;font-weight:620}
.ga-etapes-corps a,.ga-prix a{color:var(--menthe);text-decoration:underline;text-decoration-color:rgba(94,234,168,.4);text-underline-offset:3px}
.ga-etapes{list-style:none;padding:0;display:grid;gap:10px;counter-reset:e}
@media (min-width:760px){.ga-etapes{grid-template-columns:1fr 1fr}}
.ga-etapes li{counter-increment:e;display:flex;gap:14px;align-items:flex-start;padding:16px;border-radius:18px;border:1px solid var(--a-bord);background:var(--a-carte)}
.ga-etapes li::before{content:counter(e);flex:none;display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:var(--app-c);color:var(--app-encre);font-size:15px;font-weight:750}
.ga-etapes li span{min-width:0;overflow-wrap:anywhere}
.ga-etapes-corps ul{padding:0;list-style:none}
.ga-etapes-corps ul li{position:relative;padding-left:20px;margin:8px 0}
.ga-etapes-corps ul li::before{content:"";position:absolute;left:4px;top:.65em;width:7px;height:7px;border-radius:50%;background:var(--app-c)}

/* Le prix */
.ga-prix{padding:20px;border-radius:var(--a-r);border:1px solid rgba(var(--app),.28);background:linear-gradient(160deg,rgba(var(--app),.08),rgba(255,255,255,.02));color:var(--a-texte);font-size:16px;line-height:1.6}
.ga-prix>*{margin:0 0 12px}
.ga-prix>*:last-child{margin-bottom:0}
.ga-prix strong{color:#fff;font-weight:650}
.ga-prix ul{padding:0;list-style:none;display:grid;gap:8px}
.ga-prix ul li{position:relative;padding-left:20px}
.ga-prix ul li::before{content:"";position:absolute;left:3px;top:.62em;width:8px;height:8px;border-radius:50%;background:var(--app-c)}
.ga-niveaux{display:grid;gap:4px;margin-top:12px;padding:14px 16px;border-radius:14px;border-left:3px solid var(--app-c);background:rgba(255,255,255,.04)}
.ga-niveaux b{color:#fff;font-size:15.5px}
.ga-niveaux span{color:var(--a-texte);font-size:15px;line-height:1.5}
.ga-url{display:none!important}
.ga-imprime-tete,.ga-imprime-pied{display:none}

/* ── Toutes les apps ── */
.ga-hero-index{background:radial-gradient(60% 55% at 50% 0%,rgba(94,234,168,.12),transparent 70%)}
.ga-choix{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:22px}
.ga-choix>span{width:100%;font-size:14px;color:#9fb0c3;font-weight:550}
@media (min-width:560px){.ga-choix>span{width:auto;margin-right:4px}}
.ga-choix button{display:inline-flex;align-items:center;gap:8px;min-height:46px;padding:0 16px;border-radius:999px;border:1px solid var(--a-bord);background:var(--a-carte);color:#fff;font:600 15px inherit;font-family:inherit;cursor:pointer;transition:border-color .2s,background .2s}
.ga-choix button:hover{border-color:rgba(94,234,168,.45)}
.ga-choix button[aria-pressed="true"]{border-color:rgba(94,234,168,.65);background:linear-gradient(160deg,rgba(94,234,168,.16),rgba(47,208,192,.05));color:var(--menthe)}
.no-js .ga-choix{display:none}
.ga-rayon{margin-top:clamp(36px,6vw,56px)}
.ga-rayon-tete h2{margin:0;font-size:clamp(22px,3.4vw,30px);letter-spacing:-.03em;font-weight:650;color:#fff}
.ga-rayon-tete p{margin:6px 0 16px;color:#9fb0c3;font-size:15px}
.ga-rayon-tete em{font-style:normal;color:var(--menthe);font-weight:600;font-size:13px;margin-left:6px;white-space:nowrap}
.ga-cartes{list-style:none;margin:0;padding:0;display:grid;gap:12px}
@media (min-width:700px){.ga-cartes{grid-template-columns:1fr 1fr;gap:14px}}
@media (min-width:1080px){.ga-cartes{grid-template-columns:repeat(3,1fr)}}
.ga-carte{position:relative;isolation:isolate;overflow:hidden;display:flex;flex-direction:column;gap:12px;padding:18px;border-radius:var(--a-r);border:1px solid var(--a-bord);background:radial-gradient(90% 80% at 100% 0%,rgba(var(--app),.1),transparent 60%),var(--a-carte);transition:border-color .2s,transform .25s var(--ease)}
.ga-carte::after{content:"";position:absolute;z-index:-1;top:-14px;right:-22px;width:96px;aspect-ratio:460/571;background:var(--art,none) center/contain no-repeat;opacity:.55;mix-blend-mode:lighten;-webkit-mask-image:radial-gradient(closest-side,#000 60%,transparent);mask-image:radial-gradient(closest-side,#000 60%,transparent);pointer-events:none}
.ga-carte-tete{padding-right:44px}
.ga-carte:hover{border-color:rgba(var(--app),.5);transform:translateY(-2px)}
.ga-carte-lien{position:absolute;inset:0;z-index:1;border-radius:inherit}
.ga-carte-lien:focus-visible{outline:2px solid var(--menthe);outline-offset:2px}
.ga-carte-tete{display:flex;gap:12px;align-items:flex-start}
.ga-carte-tete img{flex:none;width:48px;height:48px;border-radius:14px}
.ga-carte-tete h3{margin:2px 0 4px;font-size:18px;font-weight:680;color:#fff}
.ga-carte-tete p{margin:0;font-size:14px;line-height:1.45;color:#9fb0c3}
.ga-c-cas{margin:0;font-size:14.5px;line-height:1.5;color:#dbe4ee}
.ga-c-cas b{display:inline-block;margin-right:6px;padding:1px 8px;border-radius:999px;font-size:11.5px;font-weight:650;letter-spacing:.04em;color:var(--app-c);background:rgba(var(--app),.13)}
html[data-espace="entreprise"] .ga-c-cas[data-cote="agence"],html[data-espace="agence"] .ga-c-cas[data-cote="entreprise"]{display:none}
html[data-espace] .ga-c-cas b{display:none}
.ga-carte-pied{margin-top:auto;display:flex;align-items:center;justify-content:space-between;gap:10px;padding-top:10px;border-top:1px solid var(--a-bord)}
.ga-carte-agents{display:flex;align-items:center;min-width:0;font-size:13px;color:#9fb0c3}
.ga-carte-agents img{width:28px;height:28px;border-radius:50%;border:2px solid #0b1420}
.ga-carte-agents img+img{margin-left:-8px}
.ga-carte-agents span{margin-left:8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ga-carte-actions{display:flex;align-items:center;gap:10px;flex:none}
.ga-lire{display:inline-flex;align-items:center;gap:4px;color:var(--menthe);font-weight:600;font-size:14px;white-space:nowrap}
.ga-pdf{position:relative;z-index:2;display:inline-flex;align-items:center;gap:4px;min-height:36px;padding:0 10px;border-radius:999px;border:1px solid var(--a-bord);color:#dbe4ee;font-size:13px;font-weight:600}
.ga-pdf svg{width:16px;height:16px}
.ga-pdf:hover{border-color:rgba(94,234,168,.5);color:var(--menthe)}
@media (max-width:380px){.ga-lire{display:none}}

/* ── Les renvois posés dans les pages du centre d'aide ── */
.ga-renvoi-env{margin-top:clamp(28px,5vw,44px)}
.ga-renvoi{display:flex;align-items:center;gap:14px;padding:16px 18px;margin:0 0 6px;border-radius:var(--a-r);border:1px solid rgba(94,234,168,.3);background:linear-gradient(120deg,rgba(94,234,168,.1),rgba(47,208,192,.03) 60%);color:var(--menthe)}
.ga-renvoi:hover{border-color:rgba(94,234,168,.55)}
.ga-renvoi>span:nth-child(2){flex:1;min-width:0}
.ga-renvoi b{display:block;color:#fff;font-size:16px;font-weight:650}
.ga-renvoi small{display:block;margin-top:3px;color:#a7b6c6;font-size:13.5px;line-height:1.45}
.ga-renvoi-ic{display:grid;place-items:center;flex:none;width:42px;height:42px;border-radius:13px;background:linear-gradient(135deg,#8ff5c6,#2fd0c0);color:#04150d}
.aide-env>.ga-renvoi{margin-bottom:8px}
.aide-etroit>.ga-renvoi,.aide-env>.ga-renvoi{margin-top:4px;margin-bottom:18px}
.ga-bandeau{display:flex;flex-wrap:wrap;align-items:center;gap:10px 12px;margin:22px 0 0;padding:14px 16px;border-radius:16px;border:1px solid rgba(var(--app),.35);background:linear-gradient(120deg,rgba(var(--app),.1),transparent 70%)}
.ga-bandeau img{width:40px;height:40px;border-radius:12px;flex:none}
.ga-bandeau span{flex:1;min-width:180px;color:#dfe7f0;font-size:15px;line-height:1.45}
.ga-bandeau a{display:inline-flex;align-items:center;gap:6px;color:var(--menthe);font-weight:650;font-size:14.5px;white-space:nowrap}

/* ── La version imprimée (PDF A4) ── */
@page{size:A4;margin:13mm 14mm 14mm}
@media print{
  html,body{background:#fff!important;color:#141a24!important}
  body.guide-app{font-size:11pt}
  #entete,footer,.habillage,.aide-fil,.ga-actions,.aide-ecrire,.aide-recherche,.crisp-client,#crisp-chatbox,[class*="cookie"],[id*="cookie"],[data-cookies],.ylc-aide,.ga-fenetre{display:none!important}
  .guide-app main{padding:0!important;overflow:visible!important}
  .aide-env{width:100%!important;max-width:none!important;margin:0!important}
  .ga-imprime-tete{display:flex!important;justify-content:space-between;align-items:center;margin:0 0 6mm;padding-bottom:3mm;border-bottom:1.5px solid rgb(var(--app));font-size:9pt;color:#5a6576}
  .ga-imprime-ylc{font-weight:800;letter-spacing:.08em;color:#141a24}
  .ga-imprime-pied{display:block!important;margin:8mm 0 0;padding-top:3mm;border-top:1px solid #d9dee6;font-size:9pt;color:#5a6576}
  .ga-hero{padding:0!important;background:none!important}
  .ga-hero-grille{grid-template-columns:1fr 46mm!important;gap:8mm!important}
  .ga-hero .aide-kick{color:#5a6576!important;font-size:8.5pt;margin-bottom:3mm}
  .ga-marque{color:#141a24;font-size:15pt;margin-bottom:3mm}
  .ga-marque img{width:11mm;height:11mm;box-shadow:none}
  .ga-hero h1{color:#141a24!important;font-size:24pt!important;letter-spacing:-.03em}
  .ga-hero .aide-sous{color:#333d4d!important;font-size:11.5pt;margin-top:3mm}
  .ga-hero .aide-sous strong{color:#141a24}
  .ga-art{order:0!important;margin:0!important;justify-self:end!important;-webkit-mask-image:none;mask-image:none}
  .ga-art::before{display:none}
  .ga-art img{width:46mm!important;max-width:46mm}
  .ga-art img.ga-art-icone{width:26mm!important;margin:6mm 0!important}
  .ga-corps{max-width:none}
  .ga-bloc{margin-top:8mm;break-inside:auto}
  .ga-bloc>h2{color:#141a24!important;font-size:15pt;margin-bottom:3.5mm;break-after:avoid}
  .ga-ecran{break-inside:avoid}
  .ga-capture{box-shadow:none;border:1px solid #d9dee6;border-radius:3mm;background:#fff}
  .ga-cas-carte,.ga-agent,.ga-etapes li,.ga-prix,.ga-sans-agent,.ga-niveaux,.aide-lien-article{background:#fff!important;border:1px solid #d9dee6!important;break-inside:avoid;box-shadow:none}
  .ga-cas{grid-template-columns:1fr 1fr!important;gap:4mm}
  .ga-cas.un{grid-template-columns:1fr!important}
  .ga-cas-carte{padding:4mm}
  .ga-cas-carte h3,.ga-agent h3{color:#141a24!important;font-size:11.5pt}
  .ga-cas-carte li,.ga-agent p,.ga-etapes-corps,.ga-prix,.ga-niveaux span,.ga-sans-agent{color:#2b3442!important;font-size:10pt}
  .ga-cas-ic{background:rgba(var(--app),.15);color:#141a24}
  .ga-agent{padding:4mm;background:#fff!important}
  .ga-agent-fig{width:20mm;height:20mm;box-shadow:none}
  .ga-demande-t{color:#5a6576!important}
  .ga-agent h3 small{color:#141a24;background:color-mix(in srgb,var(--ag) 35%,#fff)}
  .ga-demandes li{background:#f3f5f8;border-color:#d9dee6;color:#141a24;font-size:9.5pt}
  .ga-sous-titre{color:#5a6576;font-size:11pt}
  .ga-etapes{grid-template-columns:1fr 1fr!important;gap:3mm}
  .ga-etapes li{padding:3mm}
  .ga-etapes li::before{width:7mm;height:7mm;font-size:10pt;-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .ga-etapes-corps strong,.ga-prix strong,.ga-niveaux b{color:#141a24!important}
  .ga-etapes-corps a,.ga-prix a{color:#141a24}
  .aide-note{background:#f3f5f8;border-left-color:rgb(var(--app));break-inside:avoid}
  .aide-note p{color:#2b3442;font-size:10pt}
  .ga-prix{padding:4mm}
  .ga-plus .aide-liste{grid-template-columns:1fr 1fr!important;gap:2.5mm}
  .aide-lien-article{padding:3mm 4mm;color:#5a6576}
  .aide-lien-article b{color:#141a24!important;font-size:10pt}
  .aide-lien-article svg{display:none}
  .ga-url{display:block!important;color:#5a6576!important;font-size:8.5pt!important}
  *{-webkit-print-color-adjust:exact;print-color-adjust:exact}
  a{text-decoration:none!important}
}