/* CHANGER CV Suite — Styles Préfixe : .cgsv (composants UI) + .cgs-cv (template CV) ─────────────────────────────────────────────────────── */ :root{ --ink:#16151C; --muted:#6B6880; --panel:#F4F1FF; --line:#DDD5FA; --violet:#5B44E0; --violet-soft:rgba(91,68,224,.10); --paper:#fff; --danger:#C0392B; --success:#0a7227; --font:'Instrument Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif; } /* ── CONTENEUR ─────────────────────────────────────────── */ .cgsv{ font-family:var(--font); color:var(--ink); padding:48px 20px; } @media(max-width:768px){ .cgsv{ padding:32px 0; } } /* ══════════════════════════════════════════════════════════ ONGLETS Filet et libellé, pas de pilule ni de pictogramme : le repère est typographique. Le verbe porte l'action, la ligne dessous précise l'objet — on comprend sans décoder une icône. ══════════════════════════════════════════════════════════ */ #cgsv .cgsv__tabs{ display:flex; gap:0; margin:0 0 -1px; border-bottom:1px solid var(--line); overflow-x:auto; scrollbar-width:none; } #cgsv .cgsv__tabs::-webkit-scrollbar{ display:none; } #cgsv .cgsv__tab{ position:relative; flex:none; display:flex; flex-direction:column; align-items:flex-start; gap:1px; background:none; border:0; cursor:pointer; font:inherit; padding:14px 26px 15px; margin:0; color:var(--muted); transition:color .18s ease; } #cgsv .cgsv__tab:first-child{ padding-left:0; } #cgsv .cgsv__tabName{ font-size:16px; font-weight:500; letter-spacing:-.01em; line-height:1.25; color:inherit; } #cgsv .cgsv__tabSub{ font-size:12.5px; font-weight:400; line-height:1.3; color:var(--muted); opacity:.72; transition:opacity .18s ease, color .18s ease; } /* Le trait actif se pose sur le filet, il ne flotte pas au-dessus */ #cgsv .cgsv__tab::after{ content:''; position:absolute; left:26px; right:26px; bottom:-1px; height:2px; background:var(--violet); transform:scaleX(0); transform-origin:left center; transition:transform .22s cubic-bezier(.4,0,.2,1); } #cgsv .cgsv__tab:first-child::after{ left:0; } #cgsv .cgsv__tab:hover{ color:var(--ink); } #cgsv .cgsv__tab:hover .cgsv__tabSub{ opacity:1; } #cgsv .cgsv__tab.is-active{ color:var(--ink); } #cgsv .cgsv__tab.is-active .cgsv__tabName{ font-weight:600; } #cgsv .cgsv__tab.is-active .cgsv__tabSub{ opacity:1; color:var(--violet); } #cgsv .cgsv__tab.is-active::after{ transform:scaleX(1); } #cgsv .cgsv__tab:focus-visible{ outline:2px solid var(--violet); outline-offset:-4px; border-radius:3px; } @media (max-width:768px){ #cgsv .cgsv__tabs{ padding:0 18px; margin:0 -18px -1px; scroll-snap-type:x proximity; } #cgsv .cgsv__tab{ padding:12px 20px 13px; scroll-snap-align:start; } #cgsv .cgsv__tab:first-child{ padding-left:0; } #cgsv .cgsv__tab::after{ left:20px; right:20px; } #cgsv .cgsv__tab:first-child::after{ left:0; } #cgsv .cgsv__tabName{ font-size:15px; } #cgsv .cgsv__tabSub{ font-size:11.5px; white-space:nowrap; } } /* ── PANNEAU ───────────────────────────────────────────── */ #cgsv .cgsv__panel{ background:var(--panel); border:1px solid var(--line); border-top:0; border-radius:0 0 20px 20px; padding:40px 44px; } @media(max-width:768px){ #cgsv .cgsv__panel{ border-radius:0; border-left:0; border-right:0; padding:28px 18px; } } .cgsv__eyebrow{ font-size:11px; letter-spacing:.10em; text-transform:uppercase; color:var(--violet); font-weight:600; margin:0 0 14px; } .cgsv__title{ font-size:clamp(22px,3vw,34px); line-height:1.15; letter-spacing:-.02em; font-weight:600; margin:0 0 10px; max-width:22ch; } .cgsv__lede{ font-size:16px; line-height:1.6; color:var(--muted); margin:0 0 28px; max-width:56ch; } /* ── FORMULAIRES ───────────────────────────────────────── */ .cgsv__field{ display:flex; flex-direction:column; gap:6px; } .cgsv__field label{ font-size:13px; font-weight:500; } .cgsv__field label span{ color:var(--muted); font-weight:400; } .cgsv__field input, .cgsv__field textarea, .cgsv__field select{ padding:11px 14px; border:1px solid var(--line); border-radius:10px; font:inherit; font-size:15px; background:var(--paper); color:var(--ink); resize:vertical; } .cgsv__field input:focus, .cgsv__field textarea:focus, .cgsv__field select:focus{ outline:2px solid var(--violet); outline-offset:1px; border-color:var(--violet); } .cgsv__grid2{ display:grid; grid-template-columns:1fr 1fr; gap:12px; } @media(max-width:560px){ .cgsv__grid2{ grid-template-columns:1fr; } } /* ── DRAG & DROP ───────────────────────────────────────── */ .cgsv__drop{ border:1.5px dashed var(--line); border-radius:16px; background:rgba(255,255,255,.6); padding:32px 20px; text-align:center; cursor:pointer; transition:border-color .2s, background .2s; } .cgsv__drop.is-over{ border-color:var(--violet); background:var(--violet-soft); } .cgsv__dropIcon{ width:28px; height:28px; color:var(--violet); margin-bottom:10px; } .cgsv__dropText{ font-size:15px; color:var(--muted); margin:0 0 12px; } .cgsv__file span, .cgsv__pill{ display:inline-flex; align-items:center; background:var(--ink); color:#fff; font:500 15px/1 var(--font); padding:11px 22px; border:0; border-radius:999px; cursor:pointer; transition:background .2s, transform .2s; } .cgsv__file span:hover, .cgsv__pill:hover{ background:var(--violet); transform:translateY(-1px); } .cgsv__file input:focus-visible+span{ outline:3px solid var(--violet); outline-offset:3px; } .cgsv__hint{ margin:10px 0 0; font-size:12px; color:var(--muted); } /* ── CONSENTEMENT ──────────────────────────────────────── */ .cgsv__consent{ display:flex; gap:10px; margin:18px 0 0; font-size:13px; line-height:1.5; color:var(--muted); } .cgsv__consent input{ margin-top:2px; flex:none; width:16px; height:16px; accent-color:var(--violet); } /* ── BOUTONS ───────────────────────────────────────────── */ .cgsv__cta{ display:inline-flex; align-items:center; gap:8px; background:var(--ink); color:#fff; border:0; text-decoration:none; font:500 15px/1 var(--font); padding:14px 24px; border-radius:999px; cursor:pointer; transition:background .2s, transform .2s; } .cgsv__cta:hover{ background:var(--violet); transform:translateY(-1px); } .cgsv__cta:disabled{ opacity:.5; pointer-events:none; } .cgsv__ghost{ background:none; border:1.5px solid var(--line); color:var(--ink); font:inherit; font-size:14px; padding:9px 18px; border-radius:999px; cursor:pointer; transition:border-color .2s, background .2s; } .cgsv__ghost:hover{ border-color:var(--violet); background:var(--violet-soft); } .cgsv__ghost:disabled{ opacity:.4; cursor:not-allowed; } .cgsv__printBtn{ display:inline-flex; align-items:center; gap:6px; background:var(--violet); color:#fff; border:0; font:500 14px/1 var(--font); padding:12px 20px; border-radius:999px; cursor:pointer; transition:background .2s; } .cgsv__printBtn:hover{ background:#4535c4; } /* ── ERREUR ────────────────────────────────────────────── */ .cgsv__error{ margin:14px 0 0; padding:11px 16px; background:#FDF0EE; border:1px solid #F3CFC9; border-radius:10px; color:var(--danger); font-size:14px; line-height:1.5; } /* ── ALT / DETAILS ─────────────────────────────────────── */ .cgsv__alt{ margin:14px 0 0; font-size:14px; } .cgsv__alt summary{ cursor:pointer; color:var(--violet); font-weight:500; } .cgsv__alt textarea{ width:100%; margin-top:10px; padding:12px; border:1px solid var(--line); border-radius:10px; font:inherit; font-size:14px; background:var(--paper); } /* ── LOADING ───────────────────────────────────────────── */ .cgsv__status{ display:flex; align-items:center; gap:10px; font-size:14px; color:var(--muted); padding:10px 16px; background:var(--paper); border:1px solid var(--line); border-radius:999px; width:fit-content; margin:0 0 18px; } .cgsv__spin{ width:14px; height:14px; flex:none; border:2px solid var(--violet-soft); border-top-color:var(--violet); border-radius:50%; animation:cgsv-spin .7s linear infinite; } @keyframes cgsv-spin{ to{ transform:rotate(360deg); } } /* ── DOC ANIMÉ ─────────────────────────────────────────── */ .cgsv__doc{ position:relative; overflow:hidden; background:var(--paper); border:1px solid var(--line); border-radius:12px; padding:18px; box-shadow:0 10px 28px -18px rgba(22,21,28,.3); } .cgsv__beam{ position:absolute; left:0; right:0; top:0; height:100px; pointer-events:none; background:linear-gradient(180deg,rgba(91,68,224,0),rgba(91,68,224,.15) 90%,rgba(91,68,224,.7)); animation:cgsv-sweep 2s cubic-bezier(.5,0,.2,1) infinite; } @keyframes cgsv-sweep{ from{ transform:translateY(-100px); } to{ transform:translateY(calc(100% + 100px)); } } .cgsv__docHead{ display:flex; align-items:center; gap:12px; margin-bottom:16px; } .cgsv__avatar{ width:40px; height:40px; border-radius:50%; background:var(--violet-soft); flex:none; } .cgsv__bar{ height:8px; border-radius:4px; background:#E9E7F2; } .cgsv__bar--name{ width:120px; height:12px; background:#D6D2E6; margin-bottom:6px; } .cgsv__bar--role{ width:80px; } .cgsv__line{ display:flex; align-items:center; gap:8px; padding:4px 0; } .cgsv__line .cgsv__bar{ flex:1; } .cgsv__dot{ width:5px; height:5px; border-radius:50%; background:#D6D2E6; flex:none; } /* ── TAGS SCAN ─────────────────────────────────────────── */ .cgsv__tags{ list-style:none; display:flex; flex-wrap:wrap; gap:7px; margin:0 0 20px; padding:0; } .cgsv__tags li{ font-size:13px; padding:6px 12px; background:var(--paper); border:1px solid var(--line); border-radius:999px; opacity:0; transform:translateY(8px); transition:opacity .4s ease, transform .4s cubic-bezier(.2,.7,.3,1); } .cgsv__tags li.is-in{ opacity:1; transform:none; } .cgsv__tags li.is-transfer{ border-color:var(--violet); } .cgsv__tags li.is-transfer::before{ content:''; display:inline-block; width:6px; height:6px; border-radius:50%; background:var(--violet); margin-right:7px; vertical-align:1px; } .cgsv__tags li.is-locked{ color:transparent; background:var(--line); border-color:var(--line); min-width:110px; user-select:none; } .cgsv__tags li.is-locked::before{ display:none; } .cgsv__found{ font-size:16px; line-height:1.5; margin:0 0 14px; } .cgsv__gate{ background:var(--paper); border:1px solid var(--line); border-radius:16px; padding:22px; display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-bottom:16px; } .cgsv__gate .cgsv__field{ grid-column:1/-1; } .cgsv__field--half{ grid-column:auto; } @media(max-width:500px){ .cgsv__gate{ grid-template-columns:1fr; } .cgsv__field--half{ grid-column:1/-1; } } .cgsv__gateTitle{ grid-column:1/-1; font-size:15px; font-weight:600; margin:0; } .cgsv__gate .cgsv__consent, .cgsv__gate .cgsv__error, .cgsv__gate .cgsv__cta{ grid-column:1/-1; } .cgsv__gate .cgsv__cta{ justify-self:start; } .cgsv__outLabel{ font-size:11px; letter-spacing:.09em; text-transform:uppercase; color:var(--muted); font-weight:600; margin:0 0 10px; } .cgsv__pistes{ list-style:none; margin:0 0 16px; padding:0; display:grid; gap:8px; } .cgsv__pistes li{ background:var(--paper); border:1px solid var(--line); border-radius:10px; padding:12px 14px; } .cgsv__pistes b{ display:block; font-size:14px; font-weight:600; margin-bottom:3px; } .cgsv__pistes span{ font-size:13px; color:var(--muted); line-height:1.45; } /* ── WIZARD BUILD ──────────────────────────────────────── */ .cgsv__wizard{ } .cgsv__progress{ background:var(--line); border-radius:999px; height:4px; margin-bottom:8px; overflow:hidden; } .cgsv__progressBar{ background:var(--violet); height:100%; border-radius:999px; transition:width .4s ease; } .cgsv__stepLabel{ font-size:12px; color:var(--muted); margin:0 0 20px; } .cgsv__wTitle{ font-size:18px; font-weight:600; margin:0 0 18px; } .cgsv__expBlock{ background:rgba(255,255,255,.6); border:1px solid var(--line); border-radius:12px; padding:16px; margin-bottom:12px; position:relative; } .cgsv__expNum{ font-size:12px; font-weight:600; color:var(--violet); text-transform:uppercase; letter-spacing:.07em; margin:0 0 12px; } .cgsv__removeBtn{ position:absolute; top:12px; right:12px; background:none; border:1px solid var(--line); border-radius:50%; width:24px; height:24px; cursor:pointer; font-size:16px; line-height:1; color:var(--muted); display:flex; align-items:center; justify-content:center; } .cgsv__removeBtn:hover{ background:#FDF0EE; border-color:var(--danger); color:var(--danger); } .cgsv__wizNav{ display:flex; gap:12px; margin-top:20px; } /* Photo */ .cgsv__photoZone{ margin-top:18px; } .cgsv__photoLabel{ font-size:13px; font-weight:500; margin:0 0 8px; } .cgsv__photoDrop{ border:1.5px dashed var(--line); border-radius:12px; padding:20px; text-align:center; display:flex; flex-direction:column; align-items:center; gap:6px; background:rgba(255,255,255,.5); max-width:260px; } .cgsv__photoDrop.is-over{ border-color:var(--violet); background:var(--violet-soft); } .cgsv__photoDrop p{ font-size:13px; color:var(--muted); margin:0; } .cgsv__photoPreview{ width:80px; height:80px; border-radius:50%; object-fit:cover; border:2px solid var(--violet); margin-top:4px; } /* ── CV PREVIEW ────────────────────────────────────────── */ .cgsv__cvActions{ display:flex; flex-wrap:wrap; gap:10px; align-items:center; margin:20px 0 16px; } .cgsv__cvPreview{ background:var(--paper); border:1px solid var(--line); border-radius:16px; padding:0; overflow:hidden; box-shadow:0 8px 32px -16px rgba(22,21,28,.25); } /* ── SCORE MATCHING ────────────────────────────────────── */ .cgsv__matchScore{ background:var(--paper); border:1px solid var(--line); border-radius:14px; padding:20px 24px; margin-bottom:16px; display:flex; gap:20px; align-items:flex-start; flex-wrap:wrap; } .cgsv__scoreNum{ font-size:48px; font-weight:700; color:var(--violet); line-height:1; flex:none; } .cgsv__scoreNum small{ font-size:20px; color:var(--muted); font-weight:400; } .cgsv__scoreDetails{ flex:1; display:grid; grid-template-columns:1fr 1fr; gap:12px; min-width:260px; } @media(max-width:560px){ .cgsv__scoreDetails{ grid-template-columns:1fr; } } .cgsv__scoreGood strong, .cgsv__scoreWeak strong{ font-size:12px; text-transform:uppercase; letter-spacing:.07em; display:block; margin-bottom:6px; } .cgsv__scoreGood strong{ color:var(--success); } .cgsv__scoreWeak strong{ color:#b45309; } .cgsv__scoreGood ul, .cgsv__scoreWeak ul{ list-style:none; padding:0; margin:0; } .cgsv__scoreGood li, .cgsv__scoreWeak li{ font-size:13px; line-height:1.4; margin-bottom:3px; padding-left:14px; position:relative; } .cgsv__scoreGood li::before{ content:'✓'; position:absolute; left:0; color:var(--success); } .cgsv__scoreWeak li::before{ content:'△'; position:absolute; left:0; color:#b45309; } /* ══════════════════════════════════════════════════════════ TEMPLATE CV Toutes les tailles derivent de --cv-scale : le moteur fitToOnePage() fait varier cette seule variable pour que le document tienne sur une page sans casser les rapports. ══════════════════════════════════════════════════════════ */ .cgs-cv{ --cv-scale:1; --cv-accent:#5B44E0; --cv-ink:#15141A; --cv-muted:#5A5766; --cv-rule:#DDDAE6; --cv-base:calc(10.2pt * var(--cv-scale)); --cv-gap:calc(15px * var(--cv-scale)); font-family:Calibri,Arial,Helvetica,sans-serif; font-size:var(--cv-base); line-height:1.45; color:var(--cv-ink); background:#fff; padding:calc(34px * var(--cv-scale)) calc(38px * var(--cv-scale)); } /* ── En-tête ── */ .cgs-cv__header{ display:flex; align-items:flex-start; gap:calc(16px * var(--cv-scale)); margin-bottom:var(--cv-gap); padding-bottom:calc(13px * var(--cv-scale)); border-bottom:2px solid var(--cv-accent); } .cgs-cv__photo{ width:calc(66px * var(--cv-scale)); height:calc(66px * var(--cv-scale)); border-radius:50%; object-fit:cover; flex:none; } .cgs-cv__ident{ flex:1; min-width:0; } .cgs-cv__ident h1{ font-size:calc(21pt * var(--cv-scale)); font-weight:700; letter-spacing:-.02em; line-height:1.05; margin:0 0 calc(3px * var(--cv-scale)); color:var(--cv-ink); } .cgs-cv__job{ font-size:calc(11.5pt * var(--cv-scale)); color:var(--cv-accent); font-weight:600; margin:0 0 calc(7px * var(--cv-scale)); } .cgs-cv__contact{ display:flex; flex-wrap:wrap; gap:calc(2px * var(--cv-scale)) calc(11px * var(--cv-scale)); font-size:calc(8.8pt * var(--cv-scale)); color:var(--cv-muted); margin:0; } .cgs-cv__contact span::before{ content:'|'; color:var(--cv-rule); margin-right:calc(11px * var(--cv-scale)); } .cgs-cv__contact span:first-child::before{ content:''; margin:0; } /* ── Sections ── */ .cgs-cv__section{ margin-bottom:var(--cv-gap); } .cgs-cv__section:last-child{ margin-bottom:0; } .cgs-cv__section h2{ font-size:calc(8.6pt * var(--cv-scale)); text-transform:uppercase; letter-spacing:.11em; color:var(--cv-accent); font-weight:700; margin:0 0 calc(8px * var(--cv-scale)); padding-bottom:calc(3px * var(--cv-scale)); border-bottom:1px solid var(--cv-rule); } .cgs-cv__resume{ margin:0; line-height:1.5; color:#2C2A35; } /* ── Expériences ── */ .cgs-cv__exp{ margin-bottom:calc(10px * var(--cv-scale)); } .cgs-cv__exp:last-child{ margin-bottom:0; } .cgs-cv__expHead{ display:flex; justify-content:space-between; align-items:baseline; gap:calc(10px * var(--cv-scale)); margin-bottom:calc(3px * var(--cv-scale)); } .cgs-cv__expHead strong{ font-size:calc(10.6pt * var(--cv-scale)); font-weight:700; } .cgs-cv__co{ color:var(--cv-muted); font-weight:500; } .cgs-cv__period{ font-size:calc(8.6pt * var(--cv-scale)); color:var(--cv-muted); white-space:nowrap; flex:none; font-variant-numeric:tabular-nums; } .cgs-cv__exp ul{ margin:0; padding-left:calc(15px * var(--cv-scale)); list-style:disc; } .cgs-cv__exp ul li{ margin-bottom:calc(2px * var(--cv-scale)); line-height:1.42; } /* ── Formation ── */ .cgs-cv__fmt{ display:flex; justify-content:space-between; align-items:baseline; gap:calc(10px * var(--cv-scale)); margin-bottom:calc(5px * var(--cv-scale)); } .cgs-cv__fmt:last-child{ margin-bottom:0; } /* ── Compétences · texte simple séparé par des puces (ATS) ── */ .cgs-cv__skills, .cgs-cv__langList{ display:flex; flex-wrap:wrap; gap:calc(3px * var(--cv-scale)) calc(7px * var(--cv-scale)); } .cgs-cv__skill, .cgs-cv__lang{ color:#2C2A35; } .cgs-cv__skill::after{ content:'·'; color:var(--cv-rule); margin-left:calc(7px * var(--cv-scale)); } .cgs-cv__skill:last-child::after{ content:''; } .cgs-cv__lang strong{ font-weight:600; } /* ══════════════════════════════════════════════════════════ VARIANTES ══════════════════════════════════════════════════════════ */ /* MODERNE — bandeau pleine largeur, le plus contemporain */ .cgs-cv--moderne{ padding-top:0; } .cgs-cv--moderne .cgs-cv__header{ background:var(--cv-accent); margin:0 calc(-38px * var(--cv-scale)) var(--cv-gap); padding:calc(30px * var(--cv-scale)) calc(38px * var(--cv-scale)) calc(24px * var(--cv-scale)); border-bottom:0; align-items:center; } .cgs-cv--moderne .cgs-cv__ident h1{ color:#fff; } .cgs-cv--moderne .cgs-cv__job{ color:rgba(255,255,255,.82); font-weight:500; } .cgs-cv--moderne .cgs-cv__contact{ color:rgba(255,255,255,.9); } .cgs-cv--moderne .cgs-cv__contact span::before{ color:rgba(255,255,255,.4); } .cgs-cv--moderne .cgs-cv__photo{ border:calc(3px * var(--cv-scale)) solid rgba(255,255,255,.9); } /* ÉPURÉ — noir sur blanc, hiérarchie par le poids typographique */ .cgs-cv--epure{ --cv-accent:#15141A; } .cgs-cv--epure .cgs-cv__header{ border-bottom-width:1px; border-bottom-color:var(--cv-rule); } .cgs-cv--epure .cgs-cv__ident h1{ font-weight:600; } .cgs-cv--epure .cgs-cv__job{ color:var(--cv-muted); font-weight:500; } .cgs-cv--epure .cgs-cv__section h2{ color:var(--cv-ink); letter-spacing:.14em; } /* ÉDITORIAL — titre très large, filet épais, rythme magazine */ .cgs-cv--editorial .cgs-cv__header{ border-bottom:calc(3px * var(--cv-scale)) solid var(--cv-ink); align-items:flex-end; } .cgs-cv--editorial .cgs-cv__ident h1{ font-size:calc(27pt * var(--cv-scale)); font-weight:800; letter-spacing:-.035em; line-height:.94; } .cgs-cv--editorial .cgs-cv__job{ font-size:calc(8.8pt * var(--cv-scale)); text-transform:uppercase; letter-spacing:.18em; font-weight:600; } .cgs-cv--editorial .cgs-cv__section h2{ color:var(--cv-ink); border-bottom-width:calc(1.5px * var(--cv-scale)); border-bottom-color:var(--cv-ink); } /* NEUTRE — sérif classique, aucune couleur, parsing maximal */ .cgs-cv--neutre{ font-family:Georgia,'Times New Roman',serif; --cv-accent:#15141A; } .cgs-cv--neutre .cgs-cv__ident h1{ font-size:calc(17pt * var(--cv-scale)); letter-spacing:0; } .cgs-cv--neutre .cgs-cv__job{ font-style:italic; font-weight:400; color:var(--cv-ink); } .cgs-cv--neutre .cgs-cv__section h2{ color:var(--cv-ink); letter-spacing:.07em; } /* Couleur reprise du CV importé */ .cgs-cv.has-source-accent .cgs-cv__section h2, .cgs-cv.has-source-accent .cgs-cv__job{ color:var(--cv-accent); } /* ── PRINT ─────────────────────────────────────────────── */ @media print{ body *{ visibility:hidden; } .cgs-cv, .cgs-cv *{ visibility:visible; } .cgs-cv{ position:absolute; top:0; left:0; width:100%; padding:12mm 14mm; font-size:10pt; } .cgsv, .cgsv__cvActions, .cgsv__matchScore, .cgsv__tabs{ display:none!important; } } /* ── ACCESSIBILITÉ ─────────────────────────────────────── */ @media(prefers-reduced-motion:reduce){ .cgsv__beam, .cgsv__spin{ animation:none; } .cgsv__tags li{ opacity:1; transform:none; transition:none; } .cgsv__cta:hover, .cgsv__file span:hover{ transform:none; } } /* ══════════════════════════════════════════════════════════ SÉLECTEUR DE TEMPLATE ══════════════════════════════════════════════════════════ */ .cgsv__tplPicker,.cgsv__designChoice{ margin:22px 0 0; } .cgsv__tplLabel{ font-size:13px; font-weight:600; margin:0 0 12px; } .cgsv__tplLabel span{ color:var(--muted); font-weight:400; } .cgsv__tplGrid{ display:grid; grid-template-columns:repeat(3,1fr); gap:12px; } .cgsv__tplGrid--inline{ margin-top:12px; } @media(max-width:560px){ .cgsv__tplGrid{ grid-template-columns:1fr 1fr; } } .cgsv__tplCard{ display:flex; flex-direction:column; gap:6px; cursor:pointer; padding:10px; border:2px solid var(--line); border-radius:12px; background:var(--paper); transition:border-color .2s, transform .2s; } .cgsv__tplCard:hover{ border-color:var(--violet); transform:translateY(-2px); } .cgsv__tplCard.is-selected{ border-color:var(--violet); box-shadow:0 0 0 3px var(--violet-soft); } .cgsv__tplName{ font-size:13px; font-weight:600; } .cgsv__tplDesc{ font-size:11px; color:var(--muted); line-height:1.35; } /* Vignettes (aperçu miniature du design) */ .cgsv__tplThumb{ display:block; position:relative; height:78px; border-radius:6px; background:#fff; border:1px solid #ececf4; overflow:hidden; padding:8px; } .cgsv__tplThumb i{ display:block; border-radius:2px; background:#E4E1EE; } .cgsv__tplThumb .t-name{ width:52%; height:7px; background:#B9B3CC; margin-bottom:4px; } .cgsv__tplThumb .t-job{ width:34%; height:4px; background:var(--violet); margin-bottom:7px; } .cgsv__tplThumb .t-line{ width:100%; height:3px; margin-bottom:4px; } .cgsv__tplThumb .t-line.s{ width:72%; } .cgsv__tplThumb .t-rule{ width:100%; height:1px; background:#CFCADF; margin:0 0 7px; } /* Moderne : bandeau plein */ .cgsv__tplThumb--moderne{ padding:0 8px 8px; } .cgsv__tplThumb--moderne .t-band{ position:absolute; inset:0 0 auto 0; height:30px; background:var(--violet); border-radius:0; } .cgsv__tplThumb--moderne .t-name{ position:relative; margin-top:8px; background:rgba(255,255,255,.9); } .cgsv__tplThumb--moderne .t-job{ position:relative; background:rgba(255,255,255,.55); margin-bottom:12px; } /* Éditorial : titre large + filet épais */ .cgsv__tplThumb--editorial .t-big{ width:76%; height:12px; background:#16151C; border-radius:2px; margin-bottom:4px; } .cgsv__tplThumb--editorial .t-rule{ height:2.5px; background:#16151C; } /* Épuré : gris neutre */ .cgsv__tplThumb--epure .t-job{ background:#8A8698; } /* Choix garder / nouveau design */ .cgsv__radioRow{ display:flex; gap:11px; align-items:flex-start; padding:13px 15px; margin-bottom:8px; background:var(--paper); border:1.5px solid var(--line); border-radius:12px; cursor:pointer; transition:border-color .2s, background .2s; } .cgsv__radioRow:hover{ border-color:var(--violet); } .cgsv__radioRow:has(input:checked){ border-color:var(--violet); background:var(--violet-soft); } .cgsv__radioRow input{ margin-top:3px; flex:none; width:16px; height:16px; accent-color:var(--violet); } .cgsv__radioRow span{ display:flex; flex-direction:column; gap:2px; } .cgsv__radioRow strong{ font-size:14px; font-weight:600; } .cgsv__radioRow em{ font-size:12.5px; color:var(--muted); font-style:normal; line-height:1.45; } /* ══════════════════════════════════════════════════════════ VARIANTES DE TEMPLATE — aperçu à l'écran (les mêmes règles sont réinjectées à l'impression via TPL_CSS) ══════════════════════════════════════════════════════════ */ /* MODERNE */ .cgs-cv--moderne .cgs-cv__header{ background:#5B44E0; color:#fff; margin:-32px -36px 20px; padding:32px 36px 26px; border-bottom:0; } .cgs-cv--moderne .cgs-cv__ident h1{ color:#fff; } .cgs-cv--moderne .cgs-cv__job{ color:#D9D2FF; } .cgs-cv--moderne .cgs-cv__contact{ color:#EDE9FF; } .cgs-cv--moderne .cgs-cv__contact span::before{ color:#B9AEFF; } .cgs-cv--moderne .cgs-cv__photo{ border:3px solid rgba(255,255,255,.85); } /* ÉPURÉ */ .cgs-cv--epure .cgs-cv__header{ border-bottom:1px solid #d8d8d8; } .cgs-cv--epure .cgs-cv__ident h1{ font-weight:600; letter-spacing:-.01em; } .cgs-cv--epure .cgs-cv__job{ color:#444; font-weight:500; } .cgs-cv--epure .cgs-cv__contact span::before{ color:#999; } .cgs-cv--epure .cgs-cv__section h2{ color:#111; border-bottom:1px solid #e5e5e5; letter-spacing:.12em; } .cgs-cv--epure .cgs-cv__skill{ background:#f2f2f2; color:#333; } /* ÉDITORIAL */ .cgs-cv--editorial .cgs-cv__header{ border-bottom:4px solid #16151C; align-items:flex-end; } .cgs-cv--editorial .cgs-cv__ident h1{ font-size:28pt; font-weight:700; letter-spacing:-.03em; line-height:.95; } .cgs-cv--editorial .cgs-cv__job{ font-size:11pt; text-transform:uppercase; letter-spacing:.14em; color:#5B44E0; } .cgs-cv--editorial .cgs-cv__section h2{ color:#16151C; border-bottom:2px solid #16151C; font-size:9pt; } .cgs-cv--editorial .cgs-cv__expHead strong{ font-size:11pt; } /* NEUTRE — « garder ma mise en page » : sérif classique, zéro couleur, ATS maximal */ .cgs-cv--neutre{ font-family:Georgia,'Times New Roman',serif; } /* Georgia et Times : polices testees ATS */ .cgs-cv--neutre .cgs-cv__header{ border-bottom:1px solid #000; gap:12px; } .cgs-cv--neutre .cgs-cv__ident h1{ font-size:18pt; font-weight:700; letter-spacing:0; } .cgs-cv--neutre .cgs-cv__job{ color:#000; font-weight:400; font-style:italic; } .cgs-cv--neutre .cgs-cv__contact span::before{ color:#000; } .cgs-cv--neutre .cgs-cv__section h2{ color:#000; border-bottom:1px solid #000; letter-spacing:.06em; } .cgs-cv--neutre .cgs-cv__skill{ background:none; color:#000; padding:0 2px 0 0; border-radius:0; } .cgs-cv--neutre .cgs-cv__skill::after{ content:' •'; color:#666; } .cgs-cv--neutre .cgs-cv__skill:last-child::after{ content:''; } .cgs-cv--neutre .cgs-cv__kw{ background:none; color:#555; } /* ══════════════════════════════════════════════════════════ DONNÉES FRANCE TRAVAIL — résultat enrichi ══════════════════════════════════════════════════════════ */ .cgsv__romeBadge{ display:inline-flex; align-items:center; gap:5px; font-size:11px; font-weight:600; background:#e8f5e9; color:#0a7227; border:1px solid #a5d6a7; padding:3px 10px; border-radius:999px; margin-left:10px; vertical-align:middle; } /* Piste ROME enrichie */ .cgsv__piste--rome{ background:var(--paper); border:1px solid var(--line); border-radius:12px; padding:16px 18px; display:flex; flex-direction:column; gap:8px; } .cgsv__pisteHead{ display:flex; justify-content:space-between; align-items:baseline; flex-wrap:wrap; gap:6px; } .cgsv__pisteHead b{ font-size:15px; font-weight:700; } .cgsv__pisteScore{ font-size:11px; font-weight:700; background:var(--violet-soft); color:var(--violet); padding:2px 10px; border-radius:999px; white-space:nowrap; } .cgsv__romeCode{ font-size:11px; color:var(--muted); font-family:monospace; letter-spacing:.05em; } .cgsv__pisteStats{ display:flex; flex-wrap:wrap; gap:6px 14px; } .cgsv__romeAcces{ font-size:13px; font-weight:600; } .cgsv__romeOffres{ font-size:12px; color:var(--muted); } .cgsv__pisteComps{ display:flex; flex-wrap:wrap; gap:4px; } .cgsv__pisteComps span{ font-size:11.5px; background:#F0EDF8; color:#3D2DAF; padding:2px 9px; border-radius:4px; } /* Synthèse consultant */ .cgsv__synthese{ margin-top:20px; padding:20px 22px; background:linear-gradient(135deg, var(--violet-soft) 0%, rgba(91,68,224,.04) 100%); border:1px solid var(--line); border-left:3px solid var(--violet); border-radius:12px; } .cgsv__syntheseTitle{ font-size:14px; font-weight:700; text-transform:uppercase; letter-spacing:.07em; color:var(--violet); margin:0 0 10px; } .cgsv__syntheseText{ font-size:14px; line-height:1.6; color:var(--ink); margin:0 0 14px; } .cgsv__syntheseLabel{ font-size:12px; font-weight:600; text-transform:uppercase; letter-spacing:.07em; color:var(--muted); margin:0 0 8px; } .cgsv__plan{ margin:0 0 14px; padding-left:18px; display:flex; flex-direction:column; gap:5px; } .cgsv__plan li{ font-size:13.5px; line-height:1.5; } .cgsv__syntheseMsg{ font-size:13.5px; line-height:1.55; color:var(--muted); font-style:italic; margin:0; padding-top:12px; border-top:1px solid var(--line); } /* ══════════════════════════════════════════════════════════ CONTRÔLE ATS — affiché au-dessus du CV, exclu de l'impression ══════════════════════════════════════════════════════════ */ .cgsv__ats{ background:var(--paper); border:1px solid var(--line); border-left:3px solid var(--violet); border-radius:12px; padding:18px 20px; margin-bottom:16px; } .cgsv__atsHead{ display:flex; align-items:center; gap:16px; margin-bottom:14px; } .cgsv__atsScore{ font-size:34px; font-weight:700; color:var(--violet); line-height:1; flex:none; } .cgsv__atsScore small{ font-size:16px; color:var(--muted); font-weight:400; } .cgsv__atsHead strong{ display:block; font-size:15px; font-weight:600; } .cgsv__atsHead em{ display:block; font-size:13px; color:var(--muted); font-style:normal; margin-top:2px; } .cgsv__atsList{ list-style:none; margin:0; padding:0; display:grid; grid-template-columns:1fr 1fr; gap:6px 18px; } @media(max-width:600px){ .cgsv__atsList{ grid-template-columns:1fr; } } .cgsv__atsList li{ font-size:13px; line-height:1.45; padding-left:20px; position:relative; } .cgsv__atsList li.ok{ color:var(--ink); } .cgsv__atsList li.ko{ color:#8a5a00; } .cgsv__atsList li.ok::before{ content:'✓'; position:absolute; left:0; color:var(--success); font-weight:700; } .cgsv__atsList li.ko::before{ content:'△'; position:absolute; left:0; color:#b45309; font-weight:700; } /* Le bloc ATS ne doit jamais partir à l'impression */ @media print{ .cgsv__ats{ display:none!important; } } /* ── Notices d'ajustement une page ── */ .cgsv__fitOk, .cgsv__fitWarn{ font-size:13px; line-height:1.45; padding:9px 14px; border-radius:8px; margin-bottom:12px; } .cgsv__fitOk{ background:#EDF7ED; border:1px solid #C3E6C3; color:#1E5C1E; } .cgsv__fitWarn{ background:#FFF6E5; border:1px solid #FFD699; color:#7A4D00; } @media print{ .cgsv__fitOk, .cgsv__fitWarn{ display:none!important; } } /* ══════════════════════════════════════════════════════════ RAPPORT D'ANALYSE Note technique : les thèmes WordPress appliquent souvent des couleurs aux titres via .entry-content h3 ou similaire, avec une spécificité qui écrase une classe seule. Tous les textes sur fond sombre sont donc doublement scopés (#cgsv .classe) et forcés. ══════════════════════════════════════════════════════════ */ /* ── Ouverture ── */ #cgsv .cgsv__reportHero{ background:#16151C; border-radius:20px; padding:36px 38px; margin-bottom:16px; } #cgsv .cgsv__reportTag{ display:block; font-size:11px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:#9B93C4 !important; margin:0 0 16px; } #cgsv .cgsv__reportHero h3{ font-size:clamp(23px,2.8vw,31px); line-height:1.22; letter-spacing:-.022em; font-weight:600; color:#FFFFFF !important; margin:0 0 14px; max-width:24ch; } #cgsv .cgsv__reportHero p{ font-size:16px; line-height:1.7; color:#CFCADF !important; margin:0; max-width:60ch; } /* ── Blocs ── */ #cgsv .cgsv__reportBlock{ background:#fff; border:1px solid var(--line); border-radius:18px; padding:30px 34px; margin-bottom:16px; } #cgsv .cgsv__reportLabel{ font-size:11px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); margin:0 0 20px; } #cgsv .cgsv__reportLead{ font-size:15.5px; line-height:1.65; color:var(--muted); margin:0 0 22px; max-width:52ch; } /* Chiffre d'ancrage — aligné et respirant */ #cgsv .cgsv__reportNum{ display:flex; align-items:center; gap:16px; margin:0 0 4px; } #cgsv .cgsv__reportNum strong{ font-size:56px; font-weight:700; line-height:1; color:var(--violet); letter-spacing:-.04em; flex:none; } #cgsv .cgsv__reportNum span{ font-size:16px; color:var(--ink); line-height:1.4; max-width:20ch; font-weight:500; } /* ── Compétences ── */ #cgsv .cgsv__compGrid{ list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(auto-fill,minmax(250px,1fr)); gap:12px; } #cgsv .cgsv__compGrid li{ background:#FBFAFE; border:1px solid var(--line); border-radius:12px; padding:15px 17px; display:flex; flex-direction:column; gap:5px; } #cgsv .cgsv__compGrid li.is-transfer{ background:#F3F0FF; border-color:rgba(91,68,224,.3); box-shadow:inset 3px 0 0 var(--violet); } #cgsv .cgsv__compGrid strong{ font-size:14.5px; font-weight:600; line-height:1.35; color:var(--ink); } #cgsv .cgsv__compGrid em{ font-size:13px; font-style:normal; color:var(--muted); line-height:1.5; } /* ── Pistes ── */ #cgsv .cgsv__piste{ display:flex; gap:18px; padding:24px 0; border-top:1px solid var(--line); } #cgsv .cgsv__piste:first-of-type{ border-top:0; padding-top:4px; } #cgsv .cgsv__pisteRank{ width:32px; height:32px; flex:none; border-radius:50%; background:#16151C; color:#fff !important; display:flex; align-items:center; justify-content:center; font-size:14px; font-weight:700; } #cgsv .cgsv__pisteBody{ flex:1; min-width:0; } #cgsv .cgsv__pisteTop{ display:flex; align-items:baseline; justify-content:space-between; gap:14px; margin-bottom:5px; } #cgsv .cgsv__pisteTop h4{ font-size:18px; font-weight:600; margin:0; line-height:1.3; color:var(--ink); } #cgsv .cgsv__pisteMatch{ font-size:14px; font-weight:700; color:var(--violet); background:var(--violet-soft); padding:4px 12px; border-radius:999px; flex:none; } #cgsv .cgsv__pisteMeta{ font-size:13px; color:var(--muted); margin:0 0 14px; display:flex; flex-wrap:wrap; gap:10px; align-items:center; } #cgsv .cgsv__pisteTag{ background:#EDF7ED; color:#1E5C1E; padding:3px 10px; border-radius:5px; font-weight:600; font-size:12px; } /* Barre d'accès à l'emploi */ #cgsv .cgsv__accesWrap{ margin-bottom:14px; } #cgsv .cgsv__accesBar{ height:7px; background:#EFEDF5; border-radius:999px; overflow:hidden; margin-bottom:7px; } #cgsv .cgsv__accesBar i{ display:block; height:100%; border-radius:999px; transition:width .9s cubic-bezier(.2,.7,.3,1); } #cgsv .cgsv__accesBar i.good{ background:#2E9E5B; } #cgsv .cgsv__accesBar i.mid { background:#D9922B; } #cgsv .cgsv__accesBar i.low { background:#C0503B; } #cgsv .cgsv__accesTxt{ font-size:13px; font-weight:600; } #cgsv .cgsv__accesTxt.good{ color:#1E7040; } #cgsv .cgsv__accesTxt.mid { color:#8A5A10; } #cgsv .cgsv__accesTxt.low { color:#96382A; } /* Compétences attendues — libellé sur sa ligne, puces lisibles */ #cgsv .cgsv__pisteSkills{ display:flex; flex-wrap:wrap; gap:6px; align-items:center; } #cgsv .cgsv__pisteSkills em{ font-size:11px; font-style:normal; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--muted); width:100%; margin:0 0 4px; } #cgsv .cgsv__pisteSkills span{ font-size:12.5px; background:#F4F2FA; color:#3D2DAF; padding:5px 11px; border-radius:6px; line-height:1.3; } /* ── Plan d'action ── */ #cgsv .cgsv__planSteps{ list-style:none; counter-reset:step; margin:0; padding:0; display:grid; gap:12px; } #cgsv .cgsv__planSteps li{ counter-increment:step; position:relative; padding:17px 20px 17px 56px; background:#FBFAFE; border:1px solid var(--line); border-radius:12px; font-size:15px; line-height:1.55; color:var(--ink); } #cgsv .cgsv__planSteps li::before{ content:counter(step); position:absolute; left:18px; top:16px; width:26px; height:26px; border-radius:50%; background:var(--violet); color:#fff !important; display:flex; align-items:center; justify-content:center; font-size:13px; font-weight:700; } /* ── Passerelle bilan ── */ #cgsv .cgsv__bridge{ background:linear-gradient(160deg,#F7F5FF 0%,#EEEAFF 100%); border:1px solid var(--line); border-radius:20px; padding:34px 38px; margin-top:4px; } #cgsv .cgsv__bridge.is-tension{ background:linear-gradient(160deg,#FFF9F2 0%,#FFF1E0 100%); border-color:#F2DCBE; } #cgsv .cgsv__bridge h4{ font-size:clamp(19px,2.3vw,24px); line-height:1.3; letter-spacing:-.018em; font-weight:600; margin:0 0 14px; max-width:28ch; color:var(--ink); } #cgsv .cgsv__bridge p{ font-size:15.5px; line-height:1.7; color:#54506B; margin:0 0 24px; max-width:58ch; } #cgsv .cgsv__bridge .cgsv__cta{ font-size:16px; padding:16px 30px; min-height:52px; } #cgsv .cgsv__bridgeNote{ font-size:14px; font-style:italic; color:var(--muted); margin:24px 0 0 !important; padding-top:18px; border-top:1px solid rgba(22,21,28,.08); max-width:58ch; } /* ══════════════════════════════════════════════════════════ MOBILE — le trafic est majoritairement mobile ══════════════════════════════════════════════════════════ */ @media (max-width:640px){ .cgsv__reportHero{ border-radius:16px; padding:26px 22px; } .cgsv__reportBlock{ border-radius:16px; padding:22px 20px; } .cgsv__bridge{ border-radius:16px; padding:26px 22px; } .cgsv__reportNum strong{ font-size:42px; } .cgsv__compGrid{ grid-template-columns:1fr; } .cgsv__piste{ gap:12px; } .cgsv__pisteRank{ width:26px; height:26px; font-size:13px; } .cgsv__pisteTop{ flex-direction:column; align-items:flex-start; gap:4px; } .cgsv__planSteps li{ padding:14px 16px 14px 46px; font-size:14px; } } /* ══════════════════════════════════════════════════════════ MOBILE — parcours complet Le trafic est majoritairement mobile : le wizard 6 étapes et les zones de dépôt doivent être confortables au pouce. Cibles tactiles ≥ 44px, champs à 16px (sinon iOS zoome). ══════════════════════════════════════════════════════════ */ @media (max-width:640px){ /* Les onglets sont gérés plus haut avec une spécificité #cgsv : cette règle héritée les écrasait et réintroduisait les pilules. */ .cgsv__title{ font-size:24px; } .cgsv__lede{ font-size:15px; margin-bottom:22px; } /* Dépôt de fichier : zone haute, facile à viser */ .cgsv__drop{ padding:30px 16px; } .cgsv__dropText{ font-size:15px; } .cgsv__file span, .cgsv__pill{ min-height:48px; padding:14px 26px; } /* Champs : 16px minimum, sinon iOS zoome au focus */ .cgsv__field input, .cgsv__field textarea, .cgsv__field select{ font-size:16px; padding:13px 14px; min-height:48px; } .cgsv__field textarea{ min-height:110px; } /* Boutons pleine largeur : plus faciles à atteindre au pouce */ .cgsv__cta{ width:100%; justify-content:center; min-height:52px; font-size:16px; } .cgsv__ghost{ min-height:46px; padding:12px 20px; } /* Cases à cocher : cible élargie */ .cgsv__consent{ padding:4px 0; align-items:flex-start; } .cgsv__consent input{ width:22px; height:22px; margin-top:1px; } .cgsv__consent span{ font-size:13.5px; line-height:1.5; } /* Wizard : navigation collée en bas, toujours accessible */ .cgsv__wizNav{ position:sticky; bottom:0; z-index:5; background:linear-gradient(180deg,rgba(244,241,255,0) 0%,var(--panel) 26%); padding:16px 0 4px; margin:20px -18px 0; padding-left:18px; padding-right:18px; flex-direction:row-reverse; } .cgsv__wizNav .cgsv__cta{ flex:1; } .cgsv__wizNav .cgsv__ghost{ flex:none; width:auto; padding:12px 18px; } .cgsv__grid2{ grid-template-columns:1fr; gap:14px; } .cgsv__expBlock{ padding:16px 14px; } .cgsv__removeBtn{ width:32px; height:32px; top:10px; right:10px; } /* Sélecteur de template : 2 colonnes, vignettes plus basses */ .cgsv__tplGrid{ grid-template-columns:1fr 1fr; gap:10px; } .cgsv__tplThumb{ height:64px; } .cgsv__tplDesc{ display:none; } .cgsv__radioRow{ padding:14px; } .cgsv__radioRow input{ width:20px; height:20px; } /* Aperçu CV : lecture horizontale sans casser la mise en page A4 */ .cgsv__cvPreview{ overflow-x:auto; -webkit-overflow-scrolling:touch; border-radius:12px; } .cgsv__cvPreview .cgs-cv{ min-width:640px; } .cgsv__cvActions{ position:sticky; top:0; z-index:4; background:var(--panel); padding:10px 0; margin:0 0 12px; } .cgsv__printBtn{ flex:1; justify-content:center; min-height:48px; } /* Score matching */ .cgsv__matchScore{ padding:18px; gap:14px; } .cgsv__scoreNum{ font-size:40px; } /* Contrôle ATS */ .cgsv__ats{ padding:16px 18px; } .cgsv__atsScore{ font-size:30px; } } /* Très petits écrans */ @media (max-width:380px){ #cgsv .cgsv__panel{ padding:22px 14px; } .cgsv__title{ font-size:22px; } .cgsv__tplGrid{ grid-template-columns:1fr; } } /* Zone de sécurité iOS (encoche, barre de gestes) */ @supports (padding:max(0px)){ @media (max-width:640px){ .cgsv__wizNav{ padding-bottom:max(4px, env(safe-area-inset-bottom)); } } } /* ══════════════════════════════════════════════════════════ QUESTION D'INTENTION Placée avant les pistes : le choix oriente l'affichage et renseigne le consultant sur la maturité du projet. ══════════════════════════════════════════════════════════ */ #cgsv .cgsv__intentBlock{ background:#fff; border:1px solid var(--line); border-radius:18px; padding:28px 32px; margin-bottom:16px; } #cgsv .cgsv__intentQ{ font-size:17px; font-weight:600; line-height:1.4; margin:0 0 18px; color:var(--ink); } #cgsv .cgsv__intentBtns{ display:grid; grid-template-columns:repeat(3,1fr); gap:12px; } #cgsv .cgsv__intentBtn{ display:flex; flex-direction:column; gap:5px; text-align:left; background:#FBFAFE; border:1.5px solid var(--line); border-radius:14px; padding:18px 18px; cursor:pointer; font:inherit; transition:border-color .2s, background .2s, transform .2s; min-height:88px; } #cgsv .cgsv__intentBtn:hover{ border-color:var(--violet); background:var(--violet-soft); transform:translateY(-2px); } #cgsv .cgsv__intentBtn.is-active{ border-color:var(--violet); background:var(--violet-soft); box-shadow:0 0 0 3px rgba(91,68,224,.14); } #cgsv .cgsv__intentBtn strong{ font-size:15px; font-weight:600; color:var(--ink); line-height:1.3; } #cgsv .cgsv__intentBtn em{ font-size:13px; font-style:normal; color:var(--muted); line-height:1.45; } /* Section transverse : distinguée visuellement de la continuité */ #cgsv .cgsv__reportBlock--trans{ background:linear-gradient(170deg,#FCFBFF 0%,#F7F4FF 100%); border-color:rgba(91,68,224,.22); } #cgsv .cgsv__reportBlock--trans .cgsv__reportLabel{ color:var(--violet); } /* Actions de la passerelle */ #cgsv .cgsv__bridgeActions{ display:flex; align-items:center; gap:18px; flex-wrap:wrap; } #cgsv .cgsv__bridgeLink{ font-size:14.5px; color:var(--muted); text-decoration:underline; text-underline-offset:3px; transition:color .2s; } #cgsv .cgsv__bridgeLink:hover{ color:var(--violet); } @media (max-width:640px){ #cgsv .cgsv__intentBlock{ padding:22px 20px; border-radius:16px; } #cgsv .cgsv__intentQ{ font-size:16px; } #cgsv .cgsv__intentBtns{ grid-template-columns:1fr; gap:10px; } #cgsv .cgsv__intentBtn{ min-height:0; padding:15px 16px; } #cgsv .cgsv__bridgeActions{ flex-direction:column; align-items:stretch; gap:14px; } #cgsv .cgsv__bridgeActions .cgsv__cta{ width:100%; justify-content:center; } #cgsv .cgsv__bridgeLink{ text-align:center; } } /* ══════════════════════════════════════════════════════════ « ET MAINTENANT ? » Remplace le plan d'action automatique pour les parcours de reconversion : l'outil montre ce qu'il ne sait pas, puis ce qu'un bilan apporte. L'aveu de limite est l'argument. ══════════════════════════════════════════════════════════ */ #cgsv .cgsv__nextIntro{ font-size:16.5px; line-height:1.6; color:var(--ink); margin:0 0 22px; max-width:54ch; font-weight:500; } #cgsv .cgsv__nextSub{ font-size:13px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--muted); margin:0 0 12px; } #cgsv .cgsv__gapList{ list-style:none; margin:0 0 26px; padding:0; display:grid; gap:9px; } #cgsv .cgsv__gapList li{ position:relative; padding-left:26px; font-size:14.5px; line-height:1.5; color:#54506B; } #cgsv .cgsv__gapList li::before{ content:'—'; position:absolute; left:4px; top:0; color:var(--violet); font-weight:700; } /* Plan « ce que le bilan produit » : titre + explication */ #cgsv .cgsv__planSteps--bilan li{ display:flex; flex-direction:column; gap:4px; background:#fff; border-color:rgba(91,68,224,.24); } #cgsv .cgsv__planSteps--bilan strong{ font-size:15.5px; font-weight:600; color:var(--ink); } #cgsv .cgsv__planSteps--bilan span{ font-size:14px; line-height:1.5; color:var(--muted); } #cgsv .cgsv__planNote{ font-size:13.5px; line-height:1.55; color:var(--muted); margin:18px 0 0; padding-top:16px; border-top:1px solid var(--line); } #cgsv .cgsv__nextStep .cgsv__planNote{ font-weight:500; color:#54506B; } @media (max-width:640px){ #cgsv .cgsv__nextIntro{ font-size:15.5px; } #cgsv .cgsv__gapList li{ font-size:14px; } #cgsv .cgsv__planSteps--bilan strong{ font-size:15px; } } /* ══════════════════════════════════════════════════════════ AVANT / APRÈS — ce que l'optimisation a changé Le candidat voit le travail effectué sur son propre texte : c'est ce qui rend la valeur tangible. ══════════════════════════════════════════════════════════ */ #cgsv .cgsv__diff{ background:#fff; border:1px solid var(--line); border-radius:16px; padding:26px 28px; margin-top:16px; } #cgsv .cgsv__diffTitle{ font-size:11px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); margin:0 0 20px; } #cgsv .cgsv__diffRow{ display:grid; grid-template-columns:1fr auto 1fr; gap:14px; align-items:stretch; padding-bottom:18px; margin-bottom:18px; border-bottom:1px solid var(--line); } #cgsv .cgsv__diffRow:last-child{ border-bottom:0; margin-bottom:0; padding-bottom:0; } #cgsv .cgsv__diffBefore, #cgsv .cgsv__diffAfter{ border-radius:10px; padding:13px 15px; display:flex; flex-direction:column; gap:6px; } #cgsv .cgsv__diffBefore{ background:#FAF9FB; border:1px solid #EAE8EF; } #cgsv .cgsv__diffAfter{ background:#F3F0FF; border:1px solid rgba(91,68,224,.28); } #cgsv .cgsv__diffBefore span, #cgsv .cgsv__diffAfter span{ font-size:10.5px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; } #cgsv .cgsv__diffBefore span{ color:#9995A8; } #cgsv .cgsv__diffAfter span{ color:var(--violet); } #cgsv .cgsv__diffBefore p, #cgsv .cgsv__diffAfter p{ margin:0; font-size:14px; line-height:1.5; } #cgsv .cgsv__diffBefore p{ color:#7C7889; } #cgsv .cgsv__diffAfter p{ color:var(--ink); font-weight:500; } #cgsv .cgsv__diffArrow{ display:flex; align-items:center; color:var(--violet); font-size:20px; font-weight:300; } #cgsv .cgsv__diffWhy{ grid-column:1/-1; margin:10px 0 0; font-size:13px; line-height:1.5; color:var(--muted); font-style:italic; } /* ══════════════════════════════════════════════════════════ SCORE DE MATCHING enrichi ══════════════════════════════════════════════════════════ */ #cgsv .cgsv__matchScore{ background:#fff; border:1px solid var(--line); border-radius:18px; padding:28px 30px; margin-bottom:16px; display:block; } #cgsv .cgsv__matchScore.is-good{ border-color:#A8D8B9; } #cgsv .cgsv__matchScore.is-mid { border-color:#EFD3A0; } #cgsv .cgsv__matchScore.is-low { border-color:#EDC0B6; } #cgsv .cgsv__scoreTop{ display:flex; align-items:center; gap:22px; margin-bottom:22px; } #cgsv .cgsv__scoreRing{ width:88px; height:88px; flex:none; border-radius:50%; display:flex; flex-direction:column; align-items:center; justify-content:center; background:var(--violet-soft); border:3px solid var(--violet); } #cgsv .is-good .cgsv__scoreRing{ background:#EDF7F0; border-color:#2E9E5B; } #cgsv .is-mid .cgsv__scoreRing{ background:#FDF6E9; border-color:#D9922B; } #cgsv .is-low .cgsv__scoreRing{ background:#FBEFEC; border-color:#C0503B; } #cgsv .cgsv__scoreRing span{ font-size:30px; font-weight:700; line-height:1; color:var(--ink); } #cgsv .cgsv__scoreRing small{ font-size:11px; color:var(--muted); } #cgsv .cgsv__scoreLabel strong{ display:block; font-size:18px; font-weight:600; margin-bottom:5px; } #cgsv .cgsv__scoreLabel em{ font-size:14.5px; font-style:normal; color:var(--muted); line-height:1.55; } #cgsv .cgsv__scoreCols{ display:grid; grid-template-columns:1fr 1fr; gap:16px; } #cgsv .cgsv__scoreCol{ border-radius:12px; padding:16px 18px; } #cgsv .cgsv__scoreCol--good{ background:#F4FAF6; border:1px solid #CDE8D6; } #cgsv .cgsv__scoreCol--miss{ background:#FDF7F2; border:1px solid #F0DCC8; } #cgsv .cgsv__scoreCol strong{ display:block; font-size:12px; font-weight:700; letter-spacing:.07em; text-transform:uppercase; margin-bottom:10px; } #cgsv .cgsv__scoreCol--good strong{ color:#1E7040; } #cgsv .cgsv__scoreCol--miss strong{ color:#8A5A10; } #cgsv .cgsv__scoreCol ul{ list-style:none; margin:0; padding:0; display:grid; gap:6px; } #cgsv .cgsv__scoreCol li{ font-size:13.5px; line-height:1.45; padding-left:16px; position:relative; color:#3C3949; } #cgsv .cgsv__scoreCol--good li::before{ content:'✓'; position:absolute; left:0; color:#2E9E5B; font-weight:700; } #cgsv .cgsv__scoreCol--miss li::before{ content:'·'; position:absolute; left:2px; color:#D9922B; font-weight:700; font-size:18px; line-height:1; } #cgsv .cgsv__scoreHint{ font-size:12.5px; line-height:1.5; color:var(--muted); margin:12px 0 0; padding-top:10px; border-top:1px solid rgba(0,0,0,.06); } #cgsv .cgsv__scoreAdded{ margin-top:16px; padding-top:16px; border-top:1px solid var(--line); display:flex; flex-wrap:wrap; gap:6px; align-items:center; } #cgsv .cgsv__scoreAdded strong{ font-size:12px; font-weight:700; letter-spacing:.07em; text-transform:uppercase; color:var(--muted); width:100%; margin-bottom:4px; } #cgsv .cgsv__scoreAdded span{ font-size:12.5px; background:var(--violet-soft); color:#3D2DAF; padding:4px 11px; border-radius:6px; } /* ══════════════════════════════════════════════════════════ CAPTURE AVANT TÉLÉCHARGEMENT ══════════════════════════════════════════════════════════ */ #cgsv .cgsv__dlGate{ background:linear-gradient(160deg,#FBFAFE 0%,#F5F2FF 100%); border:1px solid var(--line); border-radius:16px; padding:26px 28px; margin-top:16px; } #cgsv .cgsv__dlTitle{ font-size:17px; font-weight:600; margin:0 0 6px; } #cgsv .cgsv__dlLead{ font-size:14.5px; line-height:1.55; color:var(--muted); margin:0 0 18px; max-width:48ch; } #cgsv .cgsv__dlFields{ display:grid; grid-template-columns:1.4fr 1fr; gap:10px; margin-bottom:14px; } #cgsv .cgsv__dlFields input{ padding:13px 15px; border:1px solid var(--line); border-radius:10px; font:inherit; font-size:15px; background:#fff; } #cgsv .cgsv__dlFields input:focus{ outline:2px solid var(--violet); outline-offset:1px; border-color:var(--violet); } #cgsv .cgsv__dlBtn{ margin-top:14px; } #cgsv .cgsv__dlErr{ margin:12px 0 0; padding:10px 14px; background:#FDF0EE; border:1px solid #F3CFC9; border-radius:9px; color:var(--danger); font-size:13.5px; } #cgsv .cgsv__dlDone{ margin:0; font-size:15px; font-weight:500; color:#1E7040; padding:6px 0; } /* Passerelle depuis les outils CV */ #cgsv .cgsv__bridge--tool{ margin-top:16px; } @media (max-width:700px){ #cgsv .cgsv__diffRow{ grid-template-columns:1fr; gap:10px; } #cgsv .cgsv__diffArrow{ transform:rotate(90deg); justify-content:center; } #cgsv .cgsv__scoreCols{ grid-template-columns:1fr; } #cgsv .cgsv__scoreTop{ gap:16px; } #cgsv .cgsv__scoreRing{ width:74px; height:74px; } #cgsv .cgsv__scoreRing span{ font-size:26px; } #cgsv .cgsv__dlFields{ grid-template-columns:1fr; } #cgsv .cgsv__dlGate{ padding:22px 20px; } #cgsv .cgsv__dlBtn{ width:100%; justify-content:center; } } /* ══════════════════════════════════════════════════════════ CONTINUITÉ ENTRE OUTILS Le CV et le consentement sont donnés une fois pour la session. Redemander les deux à chaque onglet était la principale friction. ══════════════════════════════════════════════════════════ */ /* Zone de dépôt avec fichier réutilisé */ #cgsv .cgsv__drop.is-reused{ border-style:solid; border-color:rgba(91,68,224,.35); background:linear-gradient(160deg,#FBFAFE 0%,#F5F2FF 100%); padding:0; cursor:default; } #cgsv .cgsv__drop.is-reused > *:not(.cgsv__reuse){ display:none; } #cgsv .cgsv__reuse{ display:flex; flex-direction:column; align-items:center; gap:4px; padding:24px 20px; } #cgsv .cgsv__reuse strong{ font-size:15px; font-weight:600; color:var(--ink); } #cgsv .cgsv__reuse span{ font-size:13px; color:var(--muted); } #cgsv .cgsv__reuseChange{ margin-top:10px; background:none; border:1px solid var(--line); color:var(--muted); font:inherit; font-size:13px; padding:8px 16px; border-radius:999px; cursor:pointer; transition:border-color .2s, color .2s; } #cgsv .cgsv__reuseChange:hover{ border-color:var(--violet); color:var(--violet); } /* Consentement déjà donné */ #cgsv .cgsv__consent.is-given{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding:11px 15px; background:#F4FAF6; border:1px solid #CDE8D6; border-radius:10px; } #cgsv .cgsv__consentDone{ font-size:13.5px; color:#1E7040; font-weight:500; display:flex; align-items:center; gap:8px; } #cgsv .cgsv__consentDone::before{ content:'✓'; font-weight:700; } #cgsv .cgsv__consentUndo{ background:none; border:0; color:#6B6880; font:inherit; font-size:12.5px; text-decoration:underline; cursor:pointer; flex:none; padding:4px; } #cgsv .cgsv__consentUndo:hover{ color:var(--danger); } /* Enchaînement vers les autres outils */ #cgsv .cgsv__nextTools{ background:#fff; border:1px solid var(--line); border-radius:18px; padding:28px 32px; margin-bottom:16px; } #cgsv .cgsv__nextToolsTitle{ font-size:17px; font-weight:600; margin:0 0 4px; } #cgsv .cgsv__nextToolsLead{ font-size:14.5px; color:var(--muted); margin:0 0 18px; } #cgsv .cgsv__nextToolsGrid{ display:grid; grid-template-columns:1fr 1fr; gap:12px; } #cgsv .cgsv__toolCard{ display:flex; flex-direction:column; gap:6px; text-align:left; background:#FBFAFE; border:1.5px solid var(--line); border-radius:14px; padding:18px 20px; cursor:pointer; font:inherit; transition:border-color .2s, background .2s, transform .2s; } #cgsv .cgsv__toolCard:hover{ border-color:var(--violet); background:var(--violet-soft); transform:translateY(-2px); } #cgsv .cgsv__toolCard strong{ font-size:15.5px; font-weight:600; color:var(--ink); } #cgsv .cgsv__toolCard span{ font-size:13.5px; line-height:1.5; color:var(--muted); } @media (max-width:640px){ #cgsv .cgsv__nextTools{ padding:22px 20px; border-radius:16px; } #cgsv .cgsv__nextToolsGrid{ grid-template-columns:1fr; } #cgsv .cgsv__consent.is-given{ flex-wrap:wrap; } } /* ══════════════════════════════════════════════════════════ CRÉER MON CV — parcours conversationnel Le candidat raconte, l'IA propose, il valide d'un clic. Bien plus fiable que 20 champs à remplir de mémoire. ══════════════════════════════════════════════════════════ */ #cgsv .cgsv__wHelp{ font-size:14.5px; line-height:1.6; color:var(--muted); margin:0 0 20px; max-width:56ch; } #cgsv .cgsv__fieldHint{ font-size:12.5px; color:var(--muted); margin:5px 0 0; } /* Questions d'amorce */ #cgsv .cgsv__prompts{ background:#FBFAFE; border:1px solid var(--line); border-left:3px solid var(--violet); border-radius:12px; padding:18px 20px; margin-bottom:16px; } #cgsv .cgsv__promptsTitle{ font-size:12px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--violet); margin:0 0 10px; } #cgsv .cgsv__prompts ul{ margin:0; padding-left:18px; display:grid; gap:6px; } #cgsv .cgsv__prompts li{ font-size:14px; line-height:1.5; color:#54506B; } /* Compteur */ #cgsv .cgsv__counter{ font-size:12.5px; color:var(--muted); margin-top:7px; } #cgsv .cgsv__counter em{ font-style:normal; } #cgsv .cgsv__counter em.is-ok{ color:#8A5A10; } #cgsv .cgsv__counter em.is-good{ color:#1E7040; font-weight:500; } /* Note référentiel ROME */ #cgsv .cgsv__romeNote{ font-size:13px; line-height:1.5; color:#1E7040; background:#F4FAF6; border:1px solid #CDE8D6; border-radius:9px; padding:10px 14px; margin:0 0 18px; } /* Sélecteur de compétences */ #cgsv .cgsv__pickLabel{ font-size:12px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--ink); margin:0 0 10px; display:flex; align-items:center; gap:8px; } #cgsv .cgsv__pickLabel span{ background:var(--violet); color:#fff; font-size:11px; padding:2px 8px; border-radius:999px; letter-spacing:0; } #cgsv .cgsv__pickLabel--off{ color:var(--muted); margin-top:22px; } #cgsv .cgsv__pickGrid{ list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:8px; } #cgsv .cgsv__pickGrid li{ display:inline-flex; align-items:center; gap:8px; background:var(--violet-soft); border:1.5px solid rgba(91,68,224,.35); border-radius:999px; padding:8px 8px 8px 15px; font-size:14px; color:var(--ink); } #cgsv .cgsv__pickGrid li button{ width:22px; height:22px; flex:none; border-radius:50%; border:0; background:rgba(91,68,224,.16); color:var(--violet); font-size:15px; line-height:1; cursor:pointer; display:flex; align-items:center; justify-content:center; transition:background .2s; } #cgsv .cgsv__pickGrid li button:hover{ background:var(--violet); color:#fff; } #cgsv .cgsv__pickGrid--off li{ background:#FBFAFE; border-color:var(--line); border-style:dashed; color:var(--muted); } #cgsv .cgsv__pickGrid--off li button{ background:#EFEDF5; color:var(--muted); } #cgsv .cgsv__pickGrid--off li button:hover{ background:var(--violet); color:#fff; } #cgsv .cgsv__pickEmpty{ background:none !important; border:0 !important; padding:0 !important; font-size:14px; color:var(--muted); font-style:italic; } #cgsv .cgsv__addRow{ display:flex; gap:10px; } #cgsv .cgsv__addRow input{ flex:1; } /* Choix du résumé */ #cgsv .cgsv__resumeOpt{ display:block; width:100%; text-align:left; background:#FBFAFE; border:1.5px solid var(--line); border-radius:12px; padding:16px 18px; margin-bottom:10px; cursor:pointer; font:inherit; transition:border-color .2s, background .2s; } #cgsv .cgsv__resumeOpt:hover{ border-color:var(--violet); } #cgsv .cgsv__resumeOpt.is-active{ border-color:var(--violet); background:var(--violet-soft); box-shadow:0 0 0 3px rgba(91,68,224,.12); } #cgsv .cgsv__resumeNum{ display:block; font-size:11px; font-weight:700; letter-spacing:.09em; text-transform:uppercase; color:var(--violet); margin-bottom:7px; } #cgsv .cgsv__resumeTxt{ display:block; font-size:14.5px; line-height:1.6; color:var(--ink); } @media (max-width:640px){ #cgsv .cgsv__prompts{ padding:15px 16px; } #cgsv .cgsv__prompts li{ font-size:13.5px; } #cgsv .cgsv__addRow{ flex-direction:column; } #cgsv .cgsv__addRow .cgsv__ghost{ width:100%; } #cgsv .cgsv__pickGrid li{ font-size:13.5px; } } /* ══════════════════════════════════════════════════════════ MICRO-QUESTIONS Une question par écran, un exemple sous les yeux, un bouton. La personne ne voit jamais l'ampleur de ce qu'elle remplit. ══════════════════════════════════════════════════════════ */ #cgsv .cgsv__qProgress{ margin-bottom:18px; } #cgsv .cgsv__qProgress span{ display:flex; gap:6px; } #cgsv .cgsv__qProgress i{ height:4px; flex:1; border-radius:999px; background:var(--line); transition:background .3s ease; } #cgsv .cgsv__qProgress i.is-done{ background:rgba(91,68,224,.45); } #cgsv .cgsv__qProgress i.is-current{ background:var(--violet); } #cgsv .cgsv__qCard{ background:#fff; border:1px solid var(--line); border-radius:18px; padding:30px 32px; animation:cgsv-qIn .28s cubic-bezier(.2,.7,.3,1); } @keyframes cgsv-qIn{ from{ opacity:0; transform:translateY(8px); } to{ opacity:1; transform:none; } } #cgsv .cgsv__qLabel{ font-size:20px; font-weight:600; line-height:1.35; margin:0 0 8px; color:var(--ink); max-width:24ch; } #cgsv .cgsv__qHint{ font-size:14.5px; line-height:1.55; color:var(--muted); margin:0 0 18px; max-width:50ch; } #cgsv .cgsv__qInput{ width:100%; padding:15px 17px; border:1.5px solid var(--line); border-radius:12px; font:inherit; font-size:16px; background:#FBFAFE; color:var(--ink); resize:vertical; line-height:1.55; } #cgsv .cgsv__qInput:focus{ outline:none; border-color:var(--violet); background:#fff; box-shadow:0 0 0 3px rgba(91,68,224,.12); } #cgsv .cgsv__qInput::placeholder{ color:#A9A5BC; } #cgsv .cgsv__qExample{ font-size:13px; line-height:1.5; color:var(--muted); margin:12px 0 0; font-style:italic; } /* Réponses à choix */ #cgsv .cgsv__qChoices{ display:grid; gap:10px; } #cgsv .cgsv__qChoice{ text-align:left; background:#FBFAFE; border:1.5px solid var(--line); border-radius:12px; padding:16px 20px; font:inherit; font-size:16px; color:var(--ink); cursor:pointer; transition:border-color .2s, background .2s, transform .15s; } #cgsv .cgsv__qChoice:hover{ border-color:var(--violet); background:var(--violet-soft); transform:translateX(3px); } #cgsv .cgsv__qChoice.is-active{ border-color:var(--violet); background:var(--violet-soft); font-weight:500; } #cgsv .cgsv__qNav{ display:flex; gap:12px; margin-top:18px; flex-direction:row-reverse; } #cgsv .cgsv__qNav .cgsv__cta{ flex:1; justify-content:center; } /* Récapitulatif : la personne voit ce qu'elle a déjà donné */ #cgsv .cgsv__qRecap{ margin-top:22px; padding:18px 20px; background:#FBFAFE; border:1px solid var(--line); border-radius:14px; } #cgsv .cgsv__qRecapTitle{ font-size:11px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--muted); margin:0 0 12px; } #cgsv .cgsv__qRecap ul{ list-style:none; margin:0; padding:0; display:grid; gap:10px; } #cgsv .cgsv__qRecap li{ display:flex; flex-direction:column; gap:2px; } #cgsv .cgsv__qRecap strong{ font-size:12.5px; font-weight:600; color:var(--muted); } #cgsv .cgsv__qRecap span{ font-size:14px; line-height:1.5; color:var(--ink); } @media (max-width:640px){ #cgsv .cgsv__qCard{ padding:24px 20px; border-radius:16px; } #cgsv .cgsv__qLabel{ font-size:18px; } #cgsv .cgsv__qHint{ font-size:14px; } #cgsv .cgsv__qNav{ position:sticky; bottom:0; background:var(--panel); padding:14px 0 4px; } #cgsv .cgsv__qChoice{ padding:15px 18px; } } /* ══════════════════════════════════════════════════════════ EXPÉRIENCES STRUCTURÉES ══════════════════════════════════════════════════════════ */ #cgsv .cgsv__expCard{ background:#fff; border:1px solid var(--line); border-radius:18px; padding:28px 30px; display:grid; gap:16px; animation:cgsv-qIn .28s cubic-bezier(.2,.7,.3,1); } @keyframes cgsv-qIn{ from{ opacity:0; transform:translateY(8px); } to{ opacity:1; transform:none; } } #cgsv .cgsv__dateRow{ display:grid; grid-template-columns:1fr 1fr; gap:16px; } #cgsv .cgsv__datePair{ display:grid; grid-template-columns:1.3fr 1fr; gap:8px; } #cgsv .cgsv__datePair select, #cgsv .cgsv__datePair input{ padding:11px 12px; border:1px solid var(--line); border-radius:10px; font:inherit; font-size:15px; background:#fff; min-width:0; } #cgsv .cgsv__datePair select:disabled, #cgsv .cgsv__datePair input:disabled{ background:#F4F3F7; color:#A9A5BC; } #cgsv .cgsv__nowCheck{ display:flex; align-items:center; gap:8px; margin-top:9px; font-size:13.5px; color:var(--muted); cursor:pointer; } #cgsv .cgsv__nowCheck input{ width:16px; height:16px; accent-color:var(--violet); } #cgsv .cgsv__expNav{ display:flex; gap:12px; margin-top:16px; flex-direction:row-reverse; } #cgsv .cgsv__expNav .cgsv__cta{ flex:1; justify-content:center; } /* Frise chronologique */ #cgsv .cgsv__timeline{ background:#FBFAFE; border:1px solid var(--line); border-radius:18px; padding:24px 28px; margin-top:18px; } #cgsv .cgsv__timelineTitle{ font-size:11px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--muted); margin:0 0 18px; display:flex; align-items:center; gap:9px; } #cgsv .cgsv__timelineTitle span{ background:var(--violet); color:#fff; font-size:11px; padding:2px 9px; border-radius:999px; letter-spacing:0; } #cgsv .cgsv__timeline ul{ list-style:none; margin:0; padding:0; position:relative; } #cgsv .cgsv__timeline ul::before{ content:''; position:absolute; left:5px; top:8px; bottom:8px; width:2px; background:var(--line); } #cgsv .cgsv__timeline li{ position:relative; padding-left:26px; padding-bottom:18px; } #cgsv .cgsv__timeline li:last-child{ padding-bottom:0; } #cgsv .cgsv__tlDot{ position:absolute; left:0; top:5px; width:12px; height:12px; border-radius:50%; background:var(--violet); border:2px solid #FBFAFE; } #cgsv .cgsv__tlTop{ display:flex; justify-content:space-between; align-items:baseline; gap:12px; flex-wrap:wrap; margin-bottom:3px; } #cgsv .cgsv__tlTop strong{ font-size:15.5px; font-weight:600; color:var(--ink); } #cgsv .cgsv__tlPeriod{ font-size:12.5px; color:var(--muted); white-space:nowrap; font-variant-numeric:tabular-nums; } #cgsv .cgsv__tlCo{ font-size:14px; color:var(--muted); margin:0 0 6px; } #cgsv .cgsv__tlCo em{ font-style:normal; color:#A9A5BC; } #cgsv .cgsv__tlActions{ display:flex; gap:14px; } #cgsv .cgsv__tlActions button{ background:none; border:0; padding:0; font:inherit; font-size:12.5px; color:var(--violet); text-decoration:underline; cursor:pointer; } #cgsv .cgsv__tlActions button[data-del]{ color:var(--muted); } #cgsv .cgsv__tlActions button[data-del]:hover{ color:var(--danger); } /* Trou dans le parcours */ #cgsv .cgsv__tlGap{ padding-left:26px !important; padding-bottom:18px !important; } #cgsv .cgsv__tlGap span{ display:block; font-size:13px; line-height:1.5; color:#8A5A10; background:#FDF7F2; border:1px dashed #F0DCC8; border-radius:9px; padding:10px 13px; } #cgsv .cgsv__timelineNav{ display:flex; gap:12px; margin-top:20px; padding-top:18px; border-top:1px solid var(--line); } #cgsv .cgsv__timelineNav .cgsv__cta{ margin-left:auto; } @media (max-width:640px){ #cgsv .cgsv__expCard{ padding:22px 20px; border-radius:16px; } #cgsv .cgsv__dateRow{ grid-template-columns:1fr; gap:14px; } #cgsv .cgsv__timeline{ padding:20px 18px; } #cgsv .cgsv__timelineNav{ flex-direction:column-reverse; } #cgsv .cgsv__timelineNav .cgsv__cta, #cgsv .cgsv__timelineNav .cgsv__ghost{ width:100%; justify-content:center; margin:0; } } /* ══════════════════════════════════════════════════════════ SECTIONS COMPLÉMENTAIRES — langues, outils, permis ══════════════════════════════════════════════════════════ */ #cgsv .cgsv__section{ background:#fff; border:1px solid var(--line); border-radius:16px; padding:22px 24px; margin-bottom:14px; } #cgsv .cgsv__sectionTitle{ font-size:15px; font-weight:600; color:var(--ink); margin:0 0 4px; display:flex; align-items:center; gap:9px; } #cgsv .cgsv__opt{ font-size:10.5px; font-weight:600; letter-spacing:.07em; text-transform:uppercase; color:var(--muted); background:#F2F0F7; padding:2px 8px; border-radius:999px; } #cgsv .cgsv__sectionHint{ font-size:13.5px; line-height:1.5; color:var(--muted); margin:0 0 14px; max-width:52ch; } #cgsv .cgsv__section .cgsv__expBlock{ margin-bottom:10px; } /* Permis en grille de cases */ #cgsv .cgsv__permGrid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(190px,1fr)); gap:8px; } #cgsv .cgsv__permGrid label{ display:flex; align-items:center; gap:9px; background:#FBFAFE; border:1.5px solid var(--line); border-radius:10px; padding:11px 14px; font-size:14px; cursor:pointer; transition:border-color .2s, background .2s; } #cgsv .cgsv__permGrid label:hover{ border-color:var(--violet); } #cgsv .cgsv__permGrid label:has(input:checked){ border-color:var(--violet); background:var(--violet-soft); font-weight:500; } #cgsv .cgsv__permGrid input{ width:17px; height:17px; accent-color:var(--violet); flex:none; } /* Zone « pas de diplôme » */ #cgsv .cgsv__skipZone{ margin-top:18px; padding:18px 20px; background:#FBFAFE; border:1px dashed var(--line); border-radius:12px; } #cgsv .cgsv__skipLink{ background:none; border:0; padding:0; font:inherit; font-size:14.5px; font-weight:500; color:var(--violet); cursor:pointer; text-decoration:underline; } #cgsv .cgsv__skipZone p{ font-size:13px; line-height:1.55; color:var(--muted); margin:8px 0 0; max-width:52ch; } /* Récapitulatif final */ #cgsv .cgsv__recapFinal{ background:#FBFAFE; border:1px solid var(--line); border-radius:14px; padding:20px 22px; margin:20px 0; } #cgsv .cgsv__recapFinalTitle{ font-size:11px; font-weight:700; letter-spacing:.11em; text-transform:uppercase; color:var(--muted); margin:0 0 14px; } #cgsv .cgsv__recapFinal ul{ list-style:none; margin:0; padding:0; display:grid; gap:8px; } #cgsv .cgsv__recapFinal li{ display:flex; justify-content:space-between; align-items:baseline; gap:14px; font-size:14px; padding-bottom:8px; border-bottom:1px solid var(--line); } #cgsv .cgsv__recapFinal li:last-child{ border-bottom:0; padding-bottom:0; } #cgsv .cgsv__recapFinal span{ color:var(--muted); } #cgsv .cgsv__recapFinal strong{ font-weight:600; color:var(--ink); text-align:right; } @media (max-width:640px){ #cgsv .cgsv__section{ padding:18px 16px; } #cgsv .cgsv__permGrid{ grid-template-columns:1fr 1fr; } #cgsv .cgsv__permGrid label{ font-size:13px; padding:10px 12px; } } /* ══════════════════════════════════════════════════════════ REPRISE DE BROUILLON ══════════════════════════════════════════════════════════ */ #cgsv .cgsv__draft{ display:flex; align-items:center; justify-content:space-between; gap:20px; flex-wrap:wrap; background:linear-gradient(150deg,#F7F5FF 0%,#EEEAFF 100%); border:1px solid rgba(91,68,224,.28); border-radius:16px; padding:20px 24px; margin-bottom:20px; } #cgsv .cgsv__draftBody{ display:flex; flex-direction:column; gap:3px; } #cgsv .cgsv__draftBody strong{ font-size:16px; font-weight:600; color:var(--ink); } #cgsv .cgsv__draftBody span{ font-size:14px; color:var(--muted); } #cgsv .cgsv__draftActions{ display:flex; gap:10px; align-items:center; } #cgsv .cgsv__draftActions .cgsv__cta{ padding:12px 22px; } /* Focus visible sur les titres d'étape (navigation clavier) */ #cgsv .cgsv__wTitle:focus{ outline:2px solid var(--violet); outline-offset:4px; border-radius:4px; } #cgsv .cgsv__wTitle:focus:not(:focus-visible){ outline:none; } @media (max-width:640px){ #cgsv .cgsv__draft{ flex-direction:column; align-items:stretch; padding:18px 18px; } #cgsv .cgsv__draftActions{ flex-direction:column-reverse; } #cgsv .cgsv__draftActions .cgsv__cta, #cgsv .cgsv__draftActions .cgsv__ghost{ width:100%; justify-content:center; } #cgsv .cgsv__timelineNav{ flex-wrap:wrap; } #cgsv .cgsv__timelineNav .cgsv__ghost{ flex:1; } } /* ══════════════════════════════════════════════════════════════════ SYSTÈME VISUEL — passe de normalisation ══════════════════════════════════════════════════════════════════ Constat avant reprise : 14 rayons de bordure différents, 71 usages de l'accent violet, 42 conteneurs bordés. C'est cette absence de système — pas un défaut de goût — qui fait « fait à la va-vite ». Trois règles appliquées ici : 1. Trois rayons seulement, plus la pilule pour les actions. 2. L'accent ne sert qu'à ce sur quoi on peut cliquer, ou à une donnée qui compte. Il ne décore jamais. 3. Les blocs se distinguent par le fond et un filet très clair, pas par une bordure marquée. Moins de traits, plus de calme. ══════════════════════════════════════════════════════════════════ */ #cgsv{ --r-sm:8px; --r-md:14px; --r-lg:20px; --hair:#E8E5F0; /* filet : présent, jamais dominant */ --surface:#FFFFFF; --surface-2:#FAF9FC; /* niveau secondaire, sans bordure */ --ink-2:#3E3A50; /* texte courant, moins dur que --ink */ --shadow-1:0 1px 2px rgba(22,21,28,.04); --shadow-2:0 4px 16px -6px rgba(22,21,28,.10), 0 1px 3px rgba(22,21,28,.05); } /* ── Géométrie unifiée ───────────────────────────────────── */ #cgsv .cgsv__panel{ border-radius:0 0 var(--r-lg) var(--r-lg); } #cgsv .cgsv__reportHero, #cgsv .cgsv__bridge{ border-radius:var(--r-lg); } #cgsv .cgsv__reportBlock, #cgsv .cgsv__intentBlock, #cgsv .cgsv__nextTools, #cgsv .cgsv__matchScore, #cgsv .cgsv__expCard, #cgsv .cgsv__qCard, #cgsv .cgsv__timeline, #cgsv .cgsv__diff, #cgsv .cgsv__dlGate, #cgsv .cgsv__ats, #cgsv .cgsv__section, #cgsv .cgsv__draft, #cgsv .cgsv__cvPreview{ border-radius:var(--r-md); } #cgsv .cgsv__field input, #cgsv .cgsv__field textarea, #cgsv .cgsv__field select, #cgsv .cgsv__qInput, #cgsv .cgsv__datePair select, #cgsv .cgsv__datePair input, #cgsv .cgsv__dlFields input, #cgsv .cgsv__compGrid li, #cgsv .cgsv__pistes li, #cgsv .cgsv__planSteps li, #cgsv .cgsv__expBlock, #cgsv .cgsv__scoreCol, #cgsv .cgsv__permGrid label, #cgsv .cgsv__toolCard, #cgsv .cgsv__intentBtn, #cgsv .cgsv__qChoice, #cgsv .cgsv__resumeOpt, #cgsv .cgsv__tplCard, #cgsv .cgsv__radioRow, #cgsv .cgsv__diffBefore, #cgsv .cgsv__diffAfter{ border-radius:var(--r-sm); } /* ── Filets discrets à la place des bordures marquées ────── */ #cgsv .cgsv__reportBlock, #cgsv .cgsv__intentBlock, #cgsv .cgsv__nextTools, #cgsv .cgsv__expCard, #cgsv .cgsv__qCard, #cgsv .cgsv__diff, #cgsv .cgsv__matchScore, #cgsv .cgsv__section{ border:1px solid var(--hair); box-shadow:var(--shadow-1); } #cgsv .cgsv__timeline, #cgsv .cgsv__dlGate, #cgsv .cgsv__draft{ border:1px solid var(--hair); box-shadow:none; } #cgsv .cgsv__field input, #cgsv .cgsv__field textarea, #cgsv .cgsv__field select, #cgsv .cgsv__qInput, #cgsv .cgsv__datePair select, #cgsv .cgsv__datePair input, #cgsv .cgsv__dlFields input{ border:1px solid var(--hair); background:var(--surface); box-shadow:var(--shadow-1); transition:border-color .15s ease, box-shadow .15s ease; } #cgsv .cgsv__field input:hover, #cgsv .cgsv__field textarea:hover, #cgsv .cgsv__qInput:hover{ border-color:#D6D1E4; } #cgsv .cgsv__field input:focus, #cgsv .cgsv__field textarea:focus, #cgsv .cgsv__field select:focus, #cgsv .cgsv__qInput:focus, #cgsv .cgsv__datePair select:focus, #cgsv .cgsv__datePair input:focus, #cgsv .cgsv__dlFields input:focus{ outline:none; border-color:var(--violet); box-shadow:0 0 0 3px rgba(91,68,224,.10); } /* Blocs secondaires : le fond suffit à les distinguer */ #cgsv .cgsv__compGrid li, #cgsv .cgsv__planSteps li, #cgsv .cgsv__expBlock, #cgsv .cgsv__pistes li{ border-color:transparent; background:var(--surface-2); } #cgsv .cgsv__compGrid li.is-transfer{ background:#F4F1FF; border-color:transparent; box-shadow:inset 2px 0 0 var(--violet); } /* ── Typographie : contraste réel entre les niveaux ──────── */ #cgsv .cgsv__title{ letter-spacing:-.025em; font-weight:600; } #cgsv .cgsv__reportHero h3{ letter-spacing:-.025em; } #cgsv .cgsv__lede, #cgsv .cgsv__wHelp, #cgsv .cgsv__reportLead{ color:#615D75; } #cgsv .cgsv__reportLabel, #cgsv .cgsv__timelineTitle, #cgsv .cgsv__pickLabel, #cgsv .cgsv__diffTitle, #cgsv .cgsv__qRecapTitle, #cgsv .cgsv__recapFinalTitle{ font-size:11px; font-weight:600; letter-spacing:.13em; color:#8B8799; } /* ── L'accent ne décore plus : il signale ────────────────── */ #cgsv .cgsv__reportLabel, #cgsv .cgsv__pickLabel--off, #cgsv .cgsv__sectionTitle{ color:#8B8799; } #cgsv .cgsv__reportBlock--trans .cgsv__reportLabel{ color:var(--ink-2); } #cgsv .cgsv__reportBlock--trans{ background:var(--surface); border-color:var(--hair); box-shadow:var(--shadow-1); } #cgsv .cgsv__reportBlock--trans::before{ content:''; display:block; width:28px; height:2px; background:var(--violet); margin-bottom:16px; border-radius:2px; } /* Boutons : une seule action dominante par écran */ #cgsv .cgsv__cta{ background:var(--ink); box-shadow:var(--shadow-2); letter-spacing:-.005em; } #cgsv .cgsv__cta:hover{ background:#241F3D; transform:none; box-shadow:0 6px 20px -6px rgba(22,21,28,.22); } #cgsv .cgsv__ghost{ border:1px solid var(--hair); background:var(--surface); box-shadow:var(--shadow-1); color:var(--ink-2); } #cgsv .cgsv__ghost:hover{ background:var(--surface-2); border-color:#D6D1E4; } /* ── Respiration ─────────────────────────────────────────── */ #cgsv .cgsv__panel{ padding:44px 48px; } #cgsv .cgsv__reportHero{ padding:40px 42px; } #cgsv .cgsv__reportBlock, #cgsv .cgsv__intentBlock, #cgsv .cgsv__nextTools{ padding:32px 36px; } #cgsv .cgsv__bridge{ padding:36px 40px; } #cgsv .cgsv__reportBlock, #cgsv .cgsv__intentBlock, #cgsv .cgsv__nextTools, #cgsv .cgsv__matchScore, #cgsv .cgsv__diff, #cgsv .cgsv__dlGate{ margin-bottom:18px; } /* ── Détails qui se voient ───────────────────────────────── */ #cgsv .cgsv__reportNum strong{ font-variant-numeric:tabular-nums; } #cgsv .cgsv__pisteMatch, #cgsv .cgsv__scoreRing span, #cgsv .cgsv__atsScore{ font-variant-numeric:tabular-nums; } #cgsv .cgsv__pisteRank{ background:var(--surface-2); color:var(--ink-2) !important; border:1px solid var(--hair); font-weight:600; } #cgsv .cgsv__pisteMatch{ background:var(--surface-2); color:var(--ink-2); border:1px solid var(--hair); font-weight:600; } #cgsv .cgsv__pisteSkills span{ background:var(--surface-2); color:#615D75; border:1px solid var(--hair); } #cgsv .cgsv__planSteps li::before{ background:var(--surface); color:var(--violet) !important; border:1px solid var(--hair); box-shadow:var(--shadow-1); } /* Indice ATS : note de méthode, pas de promesse */ #cgsv .cgsv__atsNote{ font-size:12px; line-height:1.55; color:#8B8799; margin:16px 0 0; padding-top:14px; border-top:1px solid var(--hair); max-width:64ch; } #cgsv .cgsv__scoreKicker{ display:block; font-size:11px; font-weight:600; letter-spacing:.13em; text-transform:uppercase; color:#8B8799; margin-bottom:5px; } #cgsv .cgsv__honesty{ font-size:13px; line-height:1.6; color:#615D75; margin:18px 0 0; padding-top:16px; border-top:1px solid var(--hair); max-width:60ch; } #cgsv .cgsv__scoreCol--part{ background:#F7F5FF; border:1px solid var(--hair); } #cgsv .cgsv__scoreCol--part strong{ color:#4A3AA8; } #cgsv .cgsv__scoreCol--part li::before{ content:'~'; position:absolute; left:1px; color:#7B6BC9; font-weight:700; } #cgsv .cgsv__scoreCols{ grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); } /* Consentement facultatif visuellement distinct de l'obligatoire */ #cgsv .cgsv__consent--opt{ background:var(--surface-2); border:1px solid var(--hair); border-radius:var(--r-sm); padding:13px 15px; margin-top:10px; } #cgsv .cgsv__consent em{ display:block; font-style:normal; font-size:12.5px; color:#8B8799; margin-top:3px; } #cgsv .cgsv__consentWhy{ grid-column:1/-1; font-size:12.5px; color:#8B8799; margin:0 0 2px; } /* Préremplissage */ #cgsv .cgsv__prefillBadge{ display:flex; flex-direction:column; gap:3px; background:#F4FAF6; border:1px solid #CDE8D6; border-radius:var(--r-md); padding:16px 20px; margin-bottom:22px; } #cgsv .cgsv__prefillBadge strong{ font-size:14.5px; font-weight:600; color:#1E7040; } #cgsv .cgsv__prefillBadge span{ font-size:13.5px; color:#3E6B4C; line-height:1.5; } #cgsv .cgsv__toolCard--wide{ grid-column:1/-1; } /* Passerelles : teinte selon le segment, sans criard */ #cgsv .cgsv__bridge{ background:var(--surface); border:1px solid var(--hair); box-shadow:var(--shadow-2); } #cgsv .cgsv__bridge::before{ content:''; display:block; width:32px; height:2px; background:var(--violet); border-radius:2px; margin-bottom:18px; } #cgsv .cgsv__bridge--candidature::before{ background:#2E9E5B; } #cgsv .cgsv__bridge--ecart::before, #cgsv .cgsv__bridge--tension::before{ background:#D9922B; } #cgsv .cgsv__bridge h4{ letter-spacing:-.02em; } #cgsv .cgsv__bridge p{ color:#615D75; } @media (max-width:768px){ #cgsv .cgsv__panel{ padding:30px 18px; } #cgsv .cgsv__reportHero{ padding:28px 22px; } #cgsv .cgsv__reportBlock, #cgsv .cgsv__intentBlock, #cgsv .cgsv__nextTools{ padding:24px 20px; } #cgsv .cgsv__bridge{ padding:26px 22px; } } /* ══════════════════════════════════════════════════════════ V1.8 — FINITION VISUELLE + ENRICHISSEMENT FRANCE TRAVAIL ══════════════════════════════════════════════════════════ */ .cgsv__srOnly{ position:absolute!important; width:1px!important; height:1px!important; padding:0!important; margin:-1px!important; overflow:hidden!important; clip:rect(0,0,0,0)!important; white-space:nowrap!important; border:0!important; } #cgsv{ max-width:1120px; margin:0 auto; } #cgsv .cgsv__productIntro{ position:relative; overflow:hidden; display:grid; grid-template-columns:minmax(0,1.45fr) minmax(280px,.75fr); gap:28px; padding:34px 36px 28px; margin:0 0 18px; color:#fff; background:linear-gradient(135deg,#17151f 0%,#252039 58%,#312568 100%); border:1px solid rgba(255,255,255,.09); border-radius:26px; box-shadow:0 24px 60px -34px rgba(22,21,28,.55); } #cgsv .cgsv__productIntro::after{ content:''; position:absolute; width:260px; height:260px; right:-90px; top:-120px; border-radius:50%; background:radial-gradient(circle,rgba(122,101,255,.34),rgba(122,101,255,0) 68%); pointer-events:none; } #cgsv .cgsv__introCopy{ position:relative; z-index:1; } #cgsv .cgsv__introKicker{ margin:0 0 12px; font-size:11px; line-height:1; letter-spacing:.13em; text-transform:uppercase; color:#c9bfff; font-weight:700; } #cgsv .cgsv__introCopy h2{ max-width:17ch; margin:0 0 14px; font-size:clamp(28px,4vw,46px); line-height:1.03; letter-spacing:-.038em; font-weight:650; color:#fff; } #cgsv .cgsv__introCopy>p:last-child{ max-width:68ch; margin:0; color:rgba(255,255,255,.76); font-size:15.5px; line-height:1.62; } #cgsv .cgsv__introSteps{ position:relative; z-index:1; align-self:center; display:grid; gap:9px; padding:16px; border:1px solid rgba(255,255,255,.11); border-radius:18px; background:rgba(255,255,255,.055); backdrop-filter:blur(8px); } #cgsv .cgsv__introSteps span{ display:flex; align-items:center; gap:11px; min-height:40px; } #cgsv .cgsv__introSteps b{ display:grid; place-items:center; width:30px; height:30px; flex:none; border-radius:50%; background:#fff; color:#372b82; font-size:12px; font-weight:750; } #cgsv .cgsv__introSteps em{ color:#fff; font-size:13.5px; font-style:normal; font-weight:550; } #cgsv .cgsv__introSources{ grid-column:1/-1; position:relative; z-index:1; display:flex; align-items:center; gap:11px 18px; flex-wrap:wrap; padding-top:18px; border-top:1px solid rgba(255,255,255,.10); } #cgsv .cgsv__introSources strong{ font-size:12px; color:#fff; } #cgsv .cgsv__introSources span{ font-size:11.5px; color:rgba(255,255,255,.6); } /* Navigation finie : un vrai bloc de produit, pas des onglets flottants */ #cgsv .cgsv__tabs{ padding:7px; margin:0; gap:5px; border:1px solid var(--line); border-bottom:0; border-radius:18px 18px 0 0; background:#fff; } #cgsv .cgsv__tab{ flex:1 1 0; min-width:150px; padding:12px 15px; border-radius:11px; transition:background .18s ease,color .18s ease,box-shadow .18s ease; } #cgsv .cgsv__tab:first-child{ padding-left:15px; } #cgsv .cgsv__tab::after{ display:none; } #cgsv .cgsv__tab.is-active{ background:var(--panel); box-shadow:inset 0 0 0 1px rgba(91,68,224,.08); } #cgsv .cgsv__tab.is-active .cgsv__tabName{ color:var(--ink); } #cgsv .cgsv__panel{ border:1px solid var(--line); border-top:0; border-radius:0 0 24px 24px; padding:42px 44px 46px; box-shadow:0 24px 60px -46px rgba(22,21,28,.42); } #cgsv .cgsv__quickExplain{ max-width:780px; margin:0 0 24px; padding:14px 16px 14px 18px; border-left:3px solid var(--violet); background:rgba(255,255,255,.68); border-radius:0 12px 12px 0; } #cgsv .cgsv__quickExplain strong{ display:block; margin-bottom:4px; font-size:13px; } #cgsv .cgsv__quickExplain p{ margin:0; color:var(--muted); font-size:13.5px; line-height:1.55; } #cgsv .cgsv__scanGrid{ display:grid; grid-template-columns:minmax(0,1.35fr) minmax(260px,.65fr); gap:16px; } #cgsv .cgsv__scanGrid .cgsv__drop{ min-height:265px; display:flex; flex-direction:column; align-items:center; justify-content:center; background:#fff; border-color:#cfc7ee; box-shadow:0 12px 32px -28px rgba(22,21,28,.5); } #cgsv .cgsv__scanGrid .cgsv__drop.is-staged{ border-style:solid; border-color:#9c8ff0; background:#fbfaff; } #cgsv .cgsv__scanSide{ display:grid; gap:12px; align-content:start; } #cgsv .cgsv__scanSide>.cgsv__field, #cgsv .cgsv__privacyCard{ background:rgba(255,255,255,.72); border:1px solid var(--line); border-radius:15px; padding:16px; } #cgsv .cgsv__fieldHint{ margin:3px 0 0; color:var(--muted); font-size:11.5px; line-height:1.45; } #cgsv .cgsv__privacyCard strong{ display:block; font-size:13px; margin-bottom:5px; } #cgsv .cgsv__privacyCard p{ margin:0; color:var(--muted); font-size:12.5px; line-height:1.5; } #cgsv .cgsv__fileReady{ width:min(100%,470px); display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:10px; margin-top:15px; padding:10px 11px; text-align:left; background:#f5f2ff; border:1px solid #d7cff8; border-radius:12px; } #cgsv .cgsv__fileReady[hidden]{ display:none!important; } #cgsv .cgsv__fileReadyIcon{ display:grid; place-items:center; width:38px; height:38px; border-radius:9px; background:var(--violet); color:#fff; font-size:9px; letter-spacing:.06em; font-weight:800; } #cgsv .cgsv__fileReady span:nth-child(2){ min-width:0; display:flex; flex-direction:column; gap:2px; } #cgsv .cgsv__fileReady strong{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:12.5px; } #cgsv .cgsv__fileReady em{ color:var(--muted); font-style:normal; font-size:10.8px; } #cgsv .cgsv__fileReady button{ border:0; background:none; color:var(--violet); font:600 11px/1 var(--font); cursor:pointer; padding:8px 4px; } #cgsv .cgsv__scanConsentBox{ margin-top:16px; display:flex; gap:16px; justify-content:space-between; align-items:center; padding:15px 16px; background:#fff; border:1px solid var(--line); border-radius:15px; } #cgsv .cgsv__scanConsentBox .cgsv__consent{ margin:0; max-width:690px; } #cgsv .cgsv__cta--scan{ flex:none; white-space:nowrap; } /* Rapport France Travail */ #cgsv .cgsv__ftBlock{ margin:20px 0 0; padding:22px; background:#fff; border:1px solid #d8d0f4; border-radius:18px; box-shadow:0 18px 44px -38px rgba(22,21,28,.5); } #cgsv .cgsv__ftHead{ display:flex; justify-content:space-between; align-items:flex-start; gap:16px; margin-bottom:16px; } #cgsv .cgsv__ftFlag{ display:inline-flex; margin-bottom:7px; padding:5px 8px; border-radius:999px; background:#f0edff; color:#4d3bc7; font-size:9.5px; letter-spacing:.08em; text-transform:uppercase; font-weight:750; } #cgsv .cgsv__ftHead h4{ margin:0 0 3px; font-size:18px; letter-spacing:-.015em; } #cgsv .cgsv__ftHead p{ margin:0; color:var(--muted); font-size:12.5px; } #cgsv .cgsv__ftLive{ flex:none; color:#16794f; font-size:10.5px; font-weight:650; } #cgsv .cgsv__ftLive::before{ content:''; display:inline-block; width:6px; height:6px; margin-right:6px; border-radius:50%; background:#22a06b; vertical-align:1px; } #cgsv .cgsv__ftMetrics{ display:grid; grid-template-columns:repeat(4,1fr); gap:9px; } #cgsv .cgsv__ftMetric{ min-width:0; padding:13px; background:#f8f7fc; border:1px solid #ebe8f6; border-radius:12px; } #cgsv .cgsv__ftMetric>span{ display:block; color:var(--muted); font-size:10.5px; margin-bottom:6px; } #cgsv .cgsv__ftMetric>strong{ display:block; font-size:21px; line-height:1.1; letter-spacing:-.03em; } #cgsv .cgsv__ftMetric>strong.cgsv__ftMetricText{ font-size:13.5px; line-height:1.3; letter-spacing:-.01em; } #cgsv .cgsv__ftMetric>em{ display:block; margin-top:5px; color:#89859a; font-size:9.8px; font-style:normal; line-height:1.35; } #cgsv .cgsv__ftStatNote{ margin:10px 0 0; color:var(--muted); font-size:11.5px; } #cgsv .cgsv__ftSkill{ margin-top:14px; padding:14px 15px; background:#f7f4ff; border-radius:12px; } #cgsv .cgsv__ftSkill>span{ display:block; color:var(--muted); font-size:10px; text-transform:uppercase; letter-spacing:.07em; } #cgsv .cgsv__ftSkill>strong{ display:block; margin:4px 0 7px; font-size:14px; } #cgsv .cgsv__ftSkill>div{ display:flex; flex-wrap:wrap; gap:5px; } #cgsv .cgsv__ftSkill em{ padding:4px 7px; background:#fff; border:1px solid #ddd6fa; border-radius:999px; color:#4d3bc7; font-size:9.5px; font-style:normal; } #cgsv .cgsv__ftSkill p{ margin:8px 0 0; color:var(--muted); font-size:11.5px; line-height:1.45; } #cgsv .cgsv__ftSection{ margin-top:17px; padding-top:16px; border-top:1px solid #ece9f5; } #cgsv .cgsv__ftSectionTitle{ display:flex; align-items:baseline; justify-content:space-between; gap:12px; margin-bottom:8px; } #cgsv .cgsv__ftSectionTitle strong{ font-size:13px; } #cgsv .cgsv__ftSectionTitle span{ color:var(--muted); font-size:9.5px; } #cgsv .cgsv__ftList{ display:grid; gap:7px; } #cgsv .cgsv__ftItem{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding:10px 11px; background:#fbfafd; border:1px solid #efedf5; border-radius:10px; } #cgsv .cgsv__ftItem>div{ min-width:0; } #cgsv .cgsv__ftItem strong{ display:block; font-size:12.5px; line-height:1.35; } #cgsv .cgsv__ftItem span,#cgsv .cgsv__ftItem em{ display:block; margin-top:2px; color:var(--muted); font-size:10.5px; font-style:normal; } #cgsv .cgsv__ftItem a{ flex:none; color:var(--violet); font-size:10.5px; font-weight:650; text-decoration:none; } #cgsv .cgsv__ftItem a:hover{ text-decoration:underline; } #cgsv .cgsv__anotea{ margin-top:14px; display:flex; align-items:center; justify-content:space-between; gap:20px; padding:12px 14px; border:1px dashed #d7cff4; border-radius:12px; } #cgsv .cgsv__anotea span{ display:block; color:var(--violet); font-size:9.5px; text-transform:uppercase; letter-spacing:.08em; font-weight:700; } #cgsv .cgsv__anotea strong{ display:block; margin-top:2px; font-size:12.5px; } #cgsv .cgsv__anotea p{ max-width:490px; margin:0; color:var(--muted); font-size:10.5px; line-height:1.4; } #cgsv .cgsv__ftLocalHint{ margin:13px 0 0; padding:10px 12px; color:var(--muted); background:#faf9fd; border-radius:10px; font-size:10.5px; } #cgsv .cgsv__ftSources{ display:flex; flex-wrap:wrap; gap:5px; margin-top:14px; padding-top:12px; border-top:1px solid #ece9f5; } #cgsv .cgsv__ftSources span{ padding:4px 7px; border-radius:999px; background:#f1eff5; color:#9a96a7; font-size:9px; } #cgsv .cgsv__ftSources span.is-on{ background:#edf8f3; color:#16794f; } @media(max-width:820px){ #cgsv .cgsv__productIntro{ grid-template-columns:1fr; padding:28px 24px 23px; } #cgsv .cgsv__introCopy h2{ max-width:21ch; } #cgsv .cgsv__introSources{ grid-column:1; } #cgsv .cgsv__scanGrid{ grid-template-columns:1fr; } #cgsv .cgsv__ftMetrics{ grid-template-columns:1fr 1fr; } } @media(max-width:768px){ #cgsv .cgsv__tabs{ margin:0; padding:6px 12px; border-radius:14px 14px 0 0; } #cgsv .cgsv__tab:first-child{ padding-left:14px; } #cgsv .cgsv__panel{ border-left:1px solid var(--line); border-right:1px solid var(--line); border-radius:0 0 18px 18px; padding:28px 18px 32px; } #cgsv .cgsv__scanConsentBox{ align-items:stretch; flex-direction:column; } #cgsv .cgsv__cta--scan{ justify-content:center; width:100%; } } @media(max-width:520px){ #cgsv .cgsv__productIntro{ border-radius:18px; padding:24px 18px 20px; } #cgsv .cgsv__introCopy h2{ font-size:29px; } #cgsv .cgsv__introSteps{ padding:12px; } #cgsv .cgsv__ftMetrics{ grid-template-columns:1fr; } #cgsv .cgsv__ftHead{ flex-direction:column; } #cgsv .cgsv__ftItem,#cgsv .cgsv__anotea{ align-items:flex-start; flex-direction:column; } } /* ══════════════════════════════════════════════════════════ V1.8.1 — DIRECTION ARTISTIQUE CHANGER Palette de marque : Noir encre #171126 Blanc crème #FDFBFB Violet signature#6B48E0 Jaune punch #F9DA4A Refonte visuelle uniquement — aucun comportement métier. ══════════════════════════════════════════════════════════ */ :root{ --ink:#171126; --muted:rgba(23,17,38,.64); --panel:#FDFBFB; --line:rgba(23,17,38,.13); --violet:#6B48E0; --violet-soft:rgba(107,72,224,.11); --paper:#FDFBFB; } #cgsv{ --changer-ink:#171126; --changer-cream:#FDFBFB; --changer-violet:#7A5AF8; --changer-violet-soft:rgba(122,90,248,.12); --changer-yellow:#F4E7AE; background:linear-gradient(90deg,#F2ECFF 0%, #FCFAF8 56%, #FFF2CC 100%); border-radius:36px; padding:56px 28px 40px; box-shadow:0 30px 90px -70px rgba(23,17,38,.52); } #cgsv .cgsv__productIntro{ position:relative; background:transparent; border:0; box-shadow:none; padding:0; display:block; } #cgsv .cgsv__productIntro::before, #cgsv .cgsv__productIntro::after{ display:none; } #cgsv .cgsv__heroHeader{ text-align:center; margin:0 auto 34px; } #cgsv .cgsv__brandLockup{ display:flex; align-items:center; gap:12px; margin:0 0 10px; } #cgsv .cgsv__brandLockup--center{ justify-content:center; } #cgsv .cgsv__brandLockup strong{ color:var(--changer-ink); font-size:clamp(24px,2.4vw,34px); line-height:1; font-weight:900; letter-spacing:-.055em; } #cgsv .cgsv__heroScript{ margin:0; color:var(--changer-violet); font-family:"Segoe Script","Bradley Hand","Comic Sans MS",cursive; font-size:clamp(18px,2vw,22px); font-weight:500; } #cgsv .cgsv__heroMain{ max-width:1080px; margin:0 auto; display:grid; grid-template-columns:minmax(0,1.18fr) 320px; gap:44px; align-items:start; } #cgsv .cgsv__introCopy{ max-width:760px; } #cgsv .cgsv__introCopy h2{ margin:0 0 20px; color:var(--changer-ink); font-size:clamp(46px,6vw,82px); line-height:.96; letter-spacing:-.06em; font-weight:850; max-width:10.3ch; text-wrap:balance; } #cgsv .cgsv__introCopy>p:last-child{ margin:0 0 24px; color:rgba(23,17,38,.64); font-size:16px; line-height:1.65; max-width:34ch; } #cgsv .cgsv__heroCta, #cgsv .cgsv__heroCta:visited{ display:inline-flex; align-items:center; gap:10px; padding:16px 30px; border-radius:999px; background:var(--changer-ink); color:#fff; text-decoration:none; font-size:16px; font-weight:700; box-shadow:0 18px 42px -26px rgba(23,17,38,.6); } #cgsv .cgsv__heroCta:hover{ background:#261D44; color:#fff; transform:translateY(-1px); } #cgsv .cgsv__introSteps{ align-self:center; background:rgba(255,255,255,.78); border:1px solid rgba(23,17,38,.08); border-radius:28px; padding:24px 20px; display:grid; gap:0; box-shadow:0 28px 55px -44px rgba(23,17,38,.44); backdrop-filter:blur(12px); } #cgsv .cgsv__introSteps span{ display:grid; grid-template-columns:44px 1fr; grid-template-rows:auto auto; column-gap:16px; row-gap:4px; align-items:start; padding:14px 2px; border-bottom:1px solid rgba(23,17,38,.08); } #cgsv .cgsv__introSteps span:last-child{ border-bottom:0; } #cgsv .cgsv__introSteps b{ grid-column:1; grid-row:1 / span 2; display:flex; align-items:center; justify-content:center; width:40px; height:40px; border-radius:50%; background:rgba(122,90,248,.12); color:var(--changer-violet); font-size:15px; font-weight:800; box-shadow:none; } #cgsv .cgsv__introSteps strong{ grid-column:2; color:var(--changer-ink); font-size:16px; line-height:1.3; font-weight:700; } #cgsv .cgsv__introSteps em{ grid-column:2; color:rgba(23,17,38,.58); font-size:13px; line-height:1.55; font-style:normal; font-weight:500; } #cgsv .cgsv__introSources{ max-width:1080px; margin:28px auto 0; padding-top:20px; border-top:1px solid rgba(23,17,38,.08); display:flex; align-items:center; gap:22px; flex-wrap:wrap; } #cgsv .cgsv__introSources strong, #cgsv .cgsv__introSources span{ color:rgba(23,17,38,.64); font-size:14px; font-weight:600; } #cgsv .cgsv__introSources strong{ color:var(--changer-ink); } #cgsv .cgsv__introSources strong::before{ content:''; display:inline-block; width:10px; height:10px; border:2px solid var(--changer-violet); border-radius:3px; margin-right:10px; vertical-align:-1px; } #cgsv .cgsv__introSources span+span{ position:relative; padding-left:22px; } #cgsv .cgsv__introSources span+span::before{ content:''; position:absolute; left:10px; top:50%; width:1px; height:15px; background:rgba(23,17,38,.14); transform:translateY(-50%); } #cgsv .cgsv__tabs{ margin:34px 0 -1px; padding:0 18px; background:rgba(255,255,255,.96); border:1px solid rgba(23,17,38,.08); border-bottom:1px solid rgba(23,17,38,.08); border-radius:30px 30px 0 0; box-shadow:0 22px 56px -46px rgba(23,17,38,.34); } #cgsv .cgsv__tab{ padding:22px 16px 18px; color:rgba(23,17,38,.56); min-width:160px; } #cgsv .cgsv__tab:first-child{ padding-left:16px; } #cgsv .cgsv__tab::after{ left:14px; right:14px; bottom:-1px; height:3px; background:var(--changer-violet); } #cgsv .cgsv__tabName{ font-size:18px; font-weight:600; color:inherit; } #cgsv .cgsv__tabSub{ font-size:13px; color:rgba(23,17,38,.45); opacity:1; } #cgsv .cgsv__tab:hover{ color:var(--changer-ink); background:transparent; } #cgsv .cgsv__tab.is-active{ background:transparent; color:var(--changer-ink); } #cgsv .cgsv__tab.is-active .cgsv__tabName{ font-weight:760; } #cgsv .cgsv__tab.is-active .cgsv__tabSub{ color:rgba(23,17,38,.55); } #cgsv .cgsv__tab:focus-visible{ outline:2px solid var(--changer-violet); outline-offset:-6px; } #cgsv .cgsv__panel{ background:rgba(255,255,255,.97); border:1px solid rgba(23,17,38,.08); border-top:0; border-radius:0 0 30px 30px; padding:42px 46px 46px; box-shadow:0 28px 72px -54px rgba(23,17,38,.34); } #cgsv .cgsv__eyebrow{ color:var(--changer-violet); font-size:11px; letter-spacing:.16em; font-weight:800; } #cgsv .cgsv__title{ color:var(--changer-ink); font-size:clamp(36px,4vw,54px); line-height:1.04; letter-spacing:-.045em; font-weight:820; max-width:14ch; } #cgsv .cgsv__lede{ color:rgba(23,17,38,.62); font-size:16px; max-width:48ch; margin-bottom:30px; } #cgsv .cgsv__scanGrid{ display:grid; grid-template-columns:minmax(0,1.15fr) minmax(290px,.85fr); gap:24px; align-items:start; } #cgsv .cgsv__scanGrid .cgsv__drop{ min-height:430px; padding:38px 28px 28px; border-radius:28px; background:linear-gradient(180deg,#fff 0%, #faf8ff 100%); border:1.5px dashed rgba(122,90,248,.28); box-shadow:none; } #cgsv .cgsv__scanGrid .cgsv__drop:hover, #cgsv .cgsv__scanGrid .cgsv__drop.is-over{ border-color:var(--changer-violet); background:linear-gradient(180deg,#ffffff 0%, #f5f1ff 100%); } #cgsv .cgsv__scanGrid .cgsv__drop.is-staged{ border-style:solid; border-color:rgba(122,90,248,.34); background:linear-gradient(180deg,#fff 0%, #f8f4ff 100%); } #cgsv .cgsv__dropIcon{ width:34px; height:34px; color:var(--changer-violet); margin-bottom:18px; } #cgsv .cgsv__dropText{ margin:0; color:var(--changer-ink); font-size:20px; font-weight:700; } #cgsv .cgsv__dropSub{ margin:6px 0 0; color:rgba(23,17,38,.56); font-size:15px; } #cgsv .cgsv__dropOu{ margin:12px 0; color:rgba(23,17,38,.42); font-size:14px; } #cgsv .cgsv__file span, #cgsv .cgsv__pill, #cgsv .cgsv__cta{ border-radius:999px; } #cgsv .cgsv__file span{ background:#fff; color:var(--changer-violet); border:1px solid rgba(122,90,248,.28); box-shadow:none; padding:14px 24px; font-weight:700; } #cgsv .cgsv__file span:hover{ background:var(--changer-violet); color:#fff; } #cgsv .cgsv__hint{ margin-top:14px; color:rgba(23,17,38,.5); font-size:13px; } #cgsv .cgsv__dropPrivacy{ margin:18px 0 0; color:rgba(23,17,38,.58); font-size:14px; line-height:1.55; } #cgsv .cgsv__dropPrivacy small{ display:block; margin-top:4px; font-size:13px; } #cgsv .cgsv__scanSide{ display:grid; gap:18px; } #cgsv .cgsv__quickExplain, #cgsv .cgsv__privacyCard, #cgsv .cgsv__fieldCard, #cgsv .cgsv__scanConsentBox, #cgsv .cgsv__gate, #cgsv .cgsv__matchScore, #cgsv .cgsv__cvPreview, #cgsv .cgsv__doc{ border:1px solid rgba(23,17,38,.08); background:#fff; box-shadow:0 18px 45px -38px rgba(23,17,38,.24); } #cgsv .cgsv__quickExplain, #cgsv .cgsv__privacyCard, #cgsv .cgsv__fieldCard{ border-radius:22px; padding:22px; } #cgsv .cgsv__quickExplain strong, #cgsv .cgsv__privacyCard strong{ display:block; color:var(--changer-ink); font-size:15px; margin-bottom:8px; } #cgsv .cgsv__quickExplain p, #cgsv .cgsv__privacyCard p{ margin:0; color:rgba(23,17,38,.6); font-size:14px; line-height:1.65; } #cgsv .cgsv__fieldCard{ display:flex; flex-direction:column; gap:10px; } #cgsv .cgsv__fieldCard label{ font-size:15px; font-weight:700; color:var(--changer-ink); } #cgsv .cgsv__fieldCard label span{ color:rgba(23,17,38,.45); font-weight:500; } #cgsv .cgsv__fieldCard input{ min-height:54px; border-radius:14px; } #cgsv .cgsv__field input, #cgsv .cgsv__field textarea, #cgsv .cgsv__field select{ background:#fff; border:1px solid rgba(23,17,38,.12); border-radius:14px; padding:14px 16px; } #cgsv .cgsv__field input:focus, #cgsv .cgsv__field textarea:focus, #cgsv .cgsv__field select:focus{ outline:2px solid rgba(122,90,248,.22); border-color:var(--changer-violet); } #cgsv .cgsv__scanConsentBox{ margin-top:20px; padding:18px 20px; border-radius:22px; display:flex; align-items:center; justify-content:space-between; gap:18px; } #cgsv .cgsv__scanConsentBox .cgsv__consent{ margin:0; flex:1; } #cgsv .cgsv__cta, #cgsv .cgsv__cta:visited{ background:var(--changer-ink); color:#fff; font-weight:700; box-shadow:0 14px 34px -24px rgba(23,17,38,.48); } #cgsv .cgsv__cta:hover{ background:#261D44; color:#fff; } #cgsv .cgsv__scanConsentBox .cgsv__cta{ flex:none; } #cgsv .cgsv__fileReady{ margin-top:18px; width:100%; max-width:420px; background:#fff; border:1px solid rgba(23,17,38,.08); border-radius:18px; padding:14px 14px; } #cgsv .cgsv__fileReadyIcon{ background:var(--changer-violet); } #cgsv .cgsv__fileReady button{ color:var(--changer-violet); } #cgsv .cgsv__consent input{ accent-color:var(--changer-violet); } #cgsv .cgsv__alt summary{ color:var(--changer-violet); } #cgsv .cgsv__status{ background:#fff; border:1px solid rgba(23,17,38,.08); box-shadow:0 16px 34px -26px rgba(23,17,38,.22); } #cgsv .cgsv__spin{ border-color:rgba(122,90,248,.12); border-top-color:var(--changer-violet); } #cgsv .cgsv__tags li.is-transfer{ border-color:rgba(122,90,248,.32); } #cgsv .cgsv__tags li.is-transfer::before{ background:var(--changer-violet); } #cgsv .cgsv__outLabel, #cgsv .cgsv__scoreNum, #cgsv .cgsv__expNum, #cgsv .cgsv__ftHead h4, #cgsv .cgsv__ftItem a, #cgsv .cgsv__tab:focus-visible{ color:var(--changer-violet); } @media(max-width:980px){ #cgsv{ padding:38px 20px 28px; border-radius:28px; } #cgsv .cgsv__heroMain{ grid-template-columns:1fr; gap:28px; } #cgsv .cgsv__introCopy h2{ max-width:12ch; } #cgsv .cgsv__introSteps{ max-width:560px; } #cgsv .cgsv__scanGrid{ grid-template-columns:1fr; } } @media(max-width:768px){ #cgsv{ border-radius:0; padding:28px 16px 20px; margin-left:-20px; margin-right:-20px; } #cgsv .cgsv__heroHeader{ margin-bottom:22px; } #cgsv .cgsv__introCopy h2{ font-size:clamp(36px,12vw,54px); max-width:11ch; } #cgsv .cgsv__introCopy>p:last-child{ max-width:none; } #cgsv .cgsv__introSources{ gap:12px; } #cgsv .cgsv__introSources span+span{ padding-left:14px; } #cgsv .cgsv__introSources span+span::before{ left:6px; } #cgsv .cgsv__tabs{ margin-top:26px; padding:0 14px; } #cgsv .cgsv__tab{ min-width:148px; padding:18px 14px 16px; } #cgsv .cgsv__panel{ padding:30px 18px 28px; border-radius:0 0 24px 24px; } #cgsv .cgsv__title{ font-size:clamp(30px,8vw,40px); max-width:12ch; } #cgsv .cgsv__scanGrid .cgsv__drop{ min-height:340px; padding:30px 20px 24px; } #cgsv .cgsv__scanConsentBox{ flex-direction:column; align-items:stretch; } } @media(max-width:520px){ #cgsv .cgsv__brandLockup strong{ font-size:24px; } #cgsv .cgsv__heroScript{ font-size:17px; } #cgsv .cgsv__introSteps{ padding:18px 16px; border-radius:22px; } #cgsv .cgsv__introSteps span{ grid-template-columns:38px 1fr; column-gap:12px; padding:12px 0; } #cgsv .cgsv__introSteps b{ width:34px; height:34px; font-size:13px; } #cgsv .cgsv__tabs{ padding:0 10px; } #cgsv .cgsv__tab{ min-width:136px; } } /* ══════════════════════════════════════════════════════════ V1.8.3 — INTÉGRATION LARGE / ÉQUILIBRE DE PAGE Le composant sort proprement de la colonne étroite du thème sans devenir full-bleed anarchique. Largeur visuelle type landing premium, respirations et proportions harmonisées. ══════════════════════════════════════════════════════════ */ .cgsv#cgsv{ box-sizing:border-box; width:min(1540px, calc(100vw - 32px)); max-width:none !important; margin-left:50% !important; margin-right:0 !important; transform:translateX(-50%); padding:58px clamp(28px,4.4vw,72px) 48px; border-radius:34px; overflow:hidden; } #cgsv .cgsv__productIntro, #cgsv .cgsv__tabs, #cgsv .cgsv__panel{ width:100%; max-width:none; } #cgsv .cgsv__heroMain, #cgsv .cgsv__introSources{ width:100%; max-width:1280px; } #cgsv .cgsv__heroMain{ grid-template-columns:minmax(0,1.45fr) minmax(300px,.65fr); gap:clamp(38px,5vw,82px); align-items:center; } #cgsv .cgsv__introCopy{ min-width:0; max-width:820px; } #cgsv .cgsv__introCopy h2{ max-width:13.5ch; font-size:clamp(46px,5.1vw,76px); line-height:.98; letter-spacing:-.055em; } #cgsv .cgsv__introCopy>p:last-child{ max-width:48ch; font-size:clamp(15px,1.2vw,17px); } #cgsv .cgsv__introSteps{ width:100%; max-width:370px; justify-self:end; border-radius:26px; } #cgsv .cgsv__introSources{ justify-content:flex-start; } #cgsv .cgsv__tabs{ margin-top:40px; justify-content:space-around; } #cgsv .cgsv__tab{ flex:1 1 0; min-width:0; align-items:center; text-align:left; } #cgsv .cgsv__tabName, #cgsv .cgsv__tabSub{ width:100%; max-width:150px; } #cgsv .cgsv__panel{ padding:48px clamp(28px,4vw,58px) 54px; } #cgsv .cgsv__panel[data-panel="scan"]{ grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr); column-gap:54px; align-items:start; } #cgsv .cgsv__panel[data-panel="scan"] > .cgsv__eyebrow, #cgsv .cgsv__panel[data-panel="scan"] > .cgsv__title, #cgsv .cgsv__panel[data-panel="scan"] > .cgsv__lede, #cgsv .cgsv__panel[data-panel="scan"] > .cgsv__step, #cgsv .cgsv__panel[data-panel="scan"] > .cgsv__error{ grid-column:1 / -1; } #cgsv .cgsv__title{ max-width:18ch; } #cgsv .cgsv__scanGrid{ grid-template-columns:minmax(0,1.15fr) minmax(320px,.85fr); gap:28px; } #cgsv .cgsv__scanGrid .cgsv__drop{ min-height:400px; } #cgsv .cgsv__scanSide{ gap:16px; } #cgsv .cgsv__quickExplain, #cgsv .cgsv__privacyCard, #cgsv .cgsv__fieldCard{ box-shadow:0 14px 38px -34px rgba(23,17,38,.25); } /* Supprime l'effet "cartons empilés" : traits légers, rayons cohérents. */ #cgsv .cgsv__quickExplain, #cgsv .cgsv__privacyCard, #cgsv .cgsv__fieldCard, #cgsv .cgsv__scanConsentBox, #cgsv .cgsv__gate, #cgsv .cgsv__matchScore, #cgsv .cgsv__doc, #cgsv .cgsv__cvPreview{ border-color:rgba(23,17,38,.07); } @media (max-width:1180px){ .cgsv#cgsv{ width:calc(100vw - 24px); padding:48px 28px 36px; border-radius:28px; } #cgsv .cgsv__heroMain{ grid-template-columns:minmax(0,1.25fr) 300px; gap:34px; } #cgsv .cgsv__introCopy h2{ font-size:clamp(44px,5.5vw,64px); max-width:12.5ch; } #cgsv .cgsv__panel{ padding:40px 34px 46px; } } @media (max-width:900px){ .cgsv#cgsv{ width:calc(100vw - 16px); padding:40px 24px 30px; border-radius:24px; } #cgsv .cgsv__heroMain{ grid-template-columns:1fr; gap:30px; } #cgsv .cgsv__introCopy{ max-width:720px; } #cgsv .cgsv__introCopy h2{ max-width:14ch; font-size:clamp(42px,8vw,62px); } #cgsv .cgsv__introSteps{ justify-self:start; max-width:620px; } #cgsv .cgsv__scanGrid{ grid-template-columns:1fr; } } @media (max-width:768px){ .cgsv#cgsv{ width:100vw; margin-left:50% !important; padding:32px 18px 24px; border-radius:0; } #cgsv .cgsv__tabs{ justify-content:flex-start; } #cgsv .cgsv__tab{ flex:0 0 150px; align-items:flex-start; } #cgsv .cgsv__panel{ padding:30px 18px 30px; } } /* ══════════════════════════════════════════════════════════ V1.9.0 — WORKSPACE APP Le scanner devient un espace de travail : état persistant, contenu opérationnel à gauche, dossier à droite, action suivante toujours au même endroit. ══════════════════════════════════════════════════════════ */ .cgsv#cgsv{ width:min(1480px,calc(100vw - 28px)); max-width:none!important; margin:0 auto!important; transform:none!important; padding:0; border-radius:28px; overflow:visible; background:#f7f7f9; border:1px solid rgba(23,17,38,.08); box-shadow:0 24px 80px -58px rgba(23,17,38,.35); } #cgsv .cgsv__appHeader{ min-height:78px; padding:15px 22px; display:grid; grid-template-columns:1fr minmax(260px,auto) auto; gap:22px; align-items:center; background:rgba(255,255,255,.96); border-bottom:1px solid rgba(23,17,38,.07); border-radius:28px 28px 0 0; } #cgsv .cgsv__appBrand{ display:flex; align-items:baseline; gap:12px; min-width:0; } #cgsv .cgsv__appBrand strong{ font-size:22px; line-height:1; font-weight:900; letter-spacing:-.055em; color:#171126; } #cgsv .cgsv__appBrand span{ font-size:11px; text-transform:uppercase; letter-spacing:.12em; font-weight:700; color:#888395; } #cgsv .cgsv__fileState{ justify-self:center; max-width:390px; min-width:0; display:flex; align-items:center; gap:10px; padding:9px 13px; background:#f8f7fb; border:1px solid rgba(23,17,38,.07); border-radius:13px; } #cgsv .cgsv__stateDot{ width:8px; height:8px; border-radius:50%; background:#b9b6c2; flex:none; box-shadow:0 0 0 4px rgba(185,182,194,.13); } #cgsv .cgsv__fileState.has-file .cgsv__stateDot{ background:#26a269; box-shadow:0 0 0 4px rgba(38,162,105,.12); } #cgsv .cgsv__fileState div{ min-width:0; } #cgsv .cgsv__fileState small, #cgsv .cgsv__appProgress small{ display:block; font-size:10px; text-transform:uppercase; letter-spacing:.09em; color:#96919f; font-weight:700; } #cgsv .cgsv__fileState strong{ display:block; max-width:300px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:#2b2733; font-size:13px; } #cgsv .cgsv__appProgress{ text-align:right; } #cgsv .cgsv__appProgress strong{ display:block; margin-top:2px; font-size:13px; color:#3b3743; } #cgsv .cgsv__tabs{ position:relative; z-index:5; margin:0; padding:0 14px; border:0; border-bottom:1px solid rgba(23,17,38,.07); border-radius:0; background:#fff; box-shadow:none; justify-content:flex-start; } #cgsv .cgsv__tab{ flex:0 1 230px; min-width:155px; padding:15px 16px 14px 38px; align-items:flex-start; text-align:left; position:relative; } #cgsv .cgsv__tab:first-child{ padding-left:38px; } #cgsv .cgsv__tabStatus{ position:absolute; left:17px; top:21px; width:9px; height:9px; border-radius:50%; border:1.5px solid #c5c1cc; background:#fff; } #cgsv .cgsv__tab.is-active .cgsv__tabStatus{ border-color:#6B48E0; background:#6B48E0; box-shadow:0 0 0 4px rgba(107,72,224,.09); } #cgsv .cgsv__tab.is-done .cgsv__tabStatus{ border-color:#26a269; background:#26a269; } #cgsv .cgsv__tab::after{ left:14px; right:14px; height:2px; background:#6B48E0; } #cgsv .cgsv__tabName{ font-size:14px; font-weight:720; } #cgsv .cgsv__tabSub{ margin-top:2px; font-size:11.5px; color:#96919f; } #cgsv .cgsv__tab.is-active{ background:transparent; color:#171126; } #cgsv .cgsv__tab.is-active .cgsv__tabSub{ color:#6f6a78; } #cgsv .cgsv__workspace{ display:grid; grid-template-columns:minmax(0,1fr) 300px; gap:0; align-items:stretch; min-height:620px; background:#fff; } #cgsv .cgsv__workArea{ min-width:0; padding:0; background:#fff; } #cgsv .cgsv__panel{ min-height:100%; padding:32px 34px 44px; border:0; border-radius:0; background:#fff; box-shadow:none; } /* v1.9.2 : ne jamais forcer display sur un panneau piloté par hidden */ #cgsv .cgsv__panel[data-panel="scan"] > *{ grid-column:auto; } #cgsv .cgsv__workHeader{ display:flex; align-items:flex-start; justify-content:space-between; gap:28px; padding-bottom:22px; margin-bottom:24px; border-bottom:1px solid rgba(23,17,38,.07); } #cgsv .cgsv__workHeader>div{ min-width:0; } #cgsv .cgsv__workStep{ display:block; margin-bottom:5px; font-size:10px; line-height:1; letter-spacing:.12em; text-transform:uppercase; font-weight:800; color:#6B48E0; } #cgsv .cgsv__workHeader h2{ margin:0; color:#171126; font-size:clamp(24px,2.2vw,34px); line-height:1.08; letter-spacing:-.035em; font-weight:780; } #cgsv .cgsv__workHeader>p{ max-width:390px; margin:2px 0 0; color:#77717e; font-size:13.5px; line-height:1.55; } #cgsv .cgsv__scanGrid{ grid-template-columns:minmax(0,1.25fr) minmax(255px,.75fr); gap:20px; } #cgsv .cgsv__scanGrid .cgsv__drop{ min-height:330px; padding:34px 24px 25px; border-radius:18px; border:1.5px dashed rgba(107,72,224,.24); background:#fcfbff; } #cgsv .cgsv__scanGrid .cgsv__drop:hover, #cgsv .cgsv__scanGrid .cgsv__drop.is-over{ background:#f9f6ff; border-color:#6B48E0; } #cgsv .cgsv__scanSide{ gap:12px; } #cgsv .cgsv__quickExplain, #cgsv .cgsv__privacyCard, #cgsv .cgsv__fieldCard{ border-radius:14px; padding:16px; box-shadow:none; border:1px solid rgba(23,17,38,.07); background:#fff; } #cgsv .cgsv__quickExplain strong, #cgsv .cgsv__privacyCard strong{ font-size:13px; } #cgsv .cgsv__quickExplain p, #cgsv .cgsv__privacyCard p{ font-size:12.5px; line-height:1.55; } #cgsv .cgsv__scanConsentBox{ margin-top:16px; padding:14px 16px; border-radius:14px; box-shadow:none; } #cgsv .cgsv__dossier{ position:relative; border-left:1px solid rgba(23,17,38,.07); background:#faf9fb; padding:26px 22px 120px; } #cgsv .cgsv__dossierHead{ display:flex; align-items:center; justify-content:space-between; gap:10px; padding-bottom:16px; border-bottom:1px solid rgba(23,17,38,.07); } #cgsv .cgsv__dossierHead span{ color:#171126; font-size:16px; font-weight:780; letter-spacing:-.02em; } #cgsv .cgsv__dossierHead strong{ font-size:11px; color:#8a8490; font-weight:700; } #cgsv .cgsv__dossierFile{ padding:16px 0; border-bottom:1px solid rgba(23,17,38,.07); } #cgsv .cgsv__dossierFile small{ display:block; color:#96919f; font-size:10px; text-transform:uppercase; letter-spacing:.08em; font-weight:700; } #cgsv .cgsv__dossierFile strong{ display:block; margin-top:5px; max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:#4b4651; font-size:12.5px; font-weight:650; } #cgsv .cgsv__dossierList{ list-style:none; padding:12px 0 0; margin:0; display:grid; gap:2px; } #cgsv .cgsv__dossierList li{ display:grid; grid-template-columns:26px 1fr; gap:10px; align-items:start; padding:10px 8px; border-radius:10px; } #cgsv .cgsv__dossierList li.is-current{ background:#f0ecff; } #cgsv .cgsv__dossierList li>span{ width:24px; height:24px; display:flex; align-items:center; justify-content:center; border-radius:50%; border:1px solid #d6d2db; background:#fff; color:#938d99; font-size:10px; font-weight:800; } #cgsv .cgsv__dossierList li.is-current>span{ background:#6B48E0; border-color:#6B48E0; color:#fff; } #cgsv .cgsv__dossierList li.is-done>span{ background:#26a269; border-color:#26a269; color:#fff; } #cgsv .cgsv__dossierList li.is-done>span::before{ content:'✓'; } #cgsv .cgsv__dossierList li.is-done>span{ font-size:0; } #cgsv .cgsv__dossierList strong{ display:block; color:#3b3640; font-size:12.5px; line-height:1.3; } #cgsv .cgsv__dossierList small{ display:block; margin-top:2px; color:#9a949f; font-size:10.5px; } #cgsv .cgsv__dossierList li.is-done small{ color:#237b53; } #cgsv .cgsv__dossierSources{ margin-top:18px; padding:14px 12px; display:flex; gap:10px; align-items:flex-start; border:1px solid rgba(23,17,38,.06); border-radius:12px; background:#fff; } #cgsv .cgsv__sourcePulse{ width:8px; height:8px; margin-top:4px; border-radius:50%; background:#26a269; box-shadow:0 0 0 4px rgba(38,162,105,.10); flex:none; } #cgsv .cgsv__dossierSources strong{ display:block; font-size:11.5px; color:#4b4651; } #cgsv .cgsv__dossierSources small{ display:block; margin-top:3px; color:#99939f; font-size:9.5px; line-height:1.45; } #cgsv .cgsv__appActionBar{ position:sticky; bottom:12px; z-index:20; margin:0 14px 14px; min-height:68px; padding:10px 12px 10px 16px; display:flex; align-items:center; justify-content:space-between; gap:18px; border:1px solid rgba(23,17,38,.09); border-radius:16px; background:rgba(255,255,255,.93); backdrop-filter:blur(14px); box-shadow:0 18px 46px -28px rgba(23,17,38,.38); } #cgsv .cgsv__appActionBar small{ display:block; color:#9a949f; font-size:9px; text-transform:uppercase; letter-spacing:.1em; font-weight:800; } #cgsv .cgsv__appActionBar strong{ display:block; margin-top:2px; color:#3b3640; font-size:13px; } #cgsv .cgsv__appActionBar button{ border:0; border-radius:10px; background:#171126; color:#fff; padding:12px 18px; font:700 13px/1 var(--font); cursor:pointer; } #cgsv .cgsv__appActionBar button:hover{ background:#6B48E0; } /* Les panneaux ne se re-présentent plus comme une landing page. */ #cgsv .cgsv__panel>.cgsv__eyebrow, #cgsv .cgsv__panel>.cgsv__title, #cgsv .cgsv__panel>.cgsv__lede{ display:none!important; } @media(max-width:1100px){ .cgsv#cgsv{ width:min(1160px,calc(100vw - 20px)); } #cgsv .cgsv__workspace{ grid-template-columns:minmax(0,1fr) 270px; } #cgsv .cgsv__panel{ padding:28px 26px 40px; } #cgsv .cgsv__scanGrid{ grid-template-columns:1fr; } } @media(max-width:880px){ .cgsv#cgsv{ width:calc(100vw - 12px); border-radius:20px; } #cgsv .cgsv__appHeader{ grid-template-columns:1fr auto; border-radius:20px 20px 0 0; } #cgsv .cgsv__fileState{ grid-column:1 / -1; grid-row:2; justify-self:stretch; max-width:none; } #cgsv .cgsv__workspace{ grid-template-columns:1fr; } #cgsv .cgsv__dossier{ border-left:0; border-top:1px solid rgba(23,17,38,.07); padding:20px 22px 90px; } #cgsv .cgsv__dossierList{ grid-template-columns:1fr 1fr; gap:4px; } #cgsv .cgsv__dossierSources{ display:none; } } @media(max-width:640px){ .cgsv#cgsv{ width:100vw; border-radius:0; border-left:0; border-right:0; } #cgsv .cgsv__appHeader{ padding:13px 16px; border-radius:0; } #cgsv .cgsv__appBrand span{ display:none; } #cgsv .cgsv__tabs{ padding:0 6px; overflow-x:auto; } #cgsv .cgsv__tab{ flex:0 0 142px; min-width:142px; padding:13px 10px 12px 32px; } #cgsv .cgsv__tab:first-child{ padding-left:32px; } #cgsv .cgsv__tabStatus{ left:12px; top:18px; } #cgsv .cgsv__panel{ padding:22px 16px 34px; } #cgsv .cgsv__workHeader{ display:block; } #cgsv .cgsv__workHeader>p{ margin-top:8px; max-width:none; } #cgsv .cgsv__dossierList{ grid-template-columns:1fr; } #cgsv .cgsv__appActionBar{ bottom:6px; margin:0 8px 8px; } } /* ══════════════════════════════════════════════════════════ V1.9.1 — CLARITY PASS Interface plus légère : contenu d'abord, détails à la demande, dégradé CHANGER très discret et hiérarchie plus calme. ══════════════════════════════════════════════════════════ */ .cgsv#cgsv{ --cgsv-violet:#6B48E0; --cgsv-ink:#171126; --cgsv-muted:#77717E; --cgsv-hair:rgba(23,17,38,.075); --cgsv-soft-violet:rgba(107,72,224,.055); --cgsv-soft-yellow:rgba(249,218,74,.075); background: radial-gradient(circle at 0 0, rgba(107,72,224,.055), transparent 28%), radial-gradient(circle at 100% 0, rgba(249,218,74,.07), transparent 31%), #f8f8fa; border-color:rgba(23,17,38,.065); box-shadow:0 30px 90px -68px rgba(23,17,38,.34); } #cgsv .cgsv__appHeader{ background: linear-gradient(100deg,rgba(107,72,224,.025),rgba(255,255,255,.98) 45%,rgba(249,218,74,.035)); border-bottom-color:var(--cgsv-hair); } #cgsv .cgsv__fileState{ background:rgba(255,255,255,.72); border-color:var(--cgsv-hair); } #cgsv .cgsv__tabs{ background:rgba(255,255,255,.97); border-bottom-color:var(--cgsv-hair); } #cgsv .cgsv__tab::after{ height:2px; } #cgsv .cgsv__tabStatus{ width:8px; height:8px; } #cgsv .cgsv__workspace{ background:#fff; } #cgsv .cgsv__panel{ padding:34px 38px 48px; } #cgsv .cgsv__workHeader{ margin-bottom:28px; padding-bottom:20px; border-color:var(--cgsv-hair); } #cgsv .cgsv__workHeader h2{ font-size:clamp(25px,2.15vw,32px); } #cgsv .cgsv__workHeader>p{ color:#85808b; max-width:350px; } #cgsv .cgsv__dossier{ background: linear-gradient(180deg,rgba(107,72,224,.025) 0%,#fbfafc 44%,rgba(249,218,74,.025) 100%); border-left-color:var(--cgsv-hair); } #cgsv .cgsv__dossierList li{ padding:9px 8px; } #cgsv .cgsv__dossierList li.is-current{ background:rgba(107,72,224,.055); } #cgsv .cgsv__dossierSources{ background:rgba(255,255,255,.72); border-color:var(--cgsv-hair); } #cgsv .cgsv__appActionBar{ background:rgba(255,255,255,.88); border-color:rgba(23,17,38,.075); box-shadow:0 20px 54px -38px rgba(23,17,38,.28); } #cgsv .cgsv__appActionBar button{ border-radius:12px; padding:12px 20px; background:var(--cgsv-ink); } /* Résultats : une lecture en couches, sans mur de cartes. */ #cgsv .cgsv__full{ display:grid; gap:14px; } #cgsv .cgsv__reportHero{ margin:0; padding:30px 32px; border:1px solid var(--cgsv-hair); border-radius:18px; background: linear-gradient(115deg,rgba(107,72,224,.045),rgba(255,255,255,.98) 55%,rgba(249,218,74,.045)); box-shadow:none; } #cgsv .cgsv__reportTag{ color:var(--cgsv-violet)!important; font-size:10px; letter-spacing:.13em; margin-bottom:10px; } #cgsv .cgsv__reportHero h3{ color:var(--cgsv-ink)!important; font-size:clamp(25px,2.7vw,34px); line-height:1.12; font-weight:760; max-width:26ch; margin-bottom:10px; } #cgsv .cgsv__reportHero p{ color:#706a78!important; font-size:14.5px; line-height:1.65; max-width:64ch; } #cgsv .cgsv__reportBlock, #cgsv .cgsv__intentBlock, #cgsv .cgsv__nextTools, #cgsv .cgsv__nextStepSimple, #cgsv .cgsv__marketSummary{ margin:0; padding:26px 28px; border-radius:18px; border:1px solid var(--cgsv-hair); background:#fff; box-shadow:none; } #cgsv .cgsv__reportBlock--trans{ background:#fff; border-color:var(--cgsv-hair); } #cgsv .cgsv__reportBlock--trans::before{ display:none; } #cgsv .cgsv__resultSectionHead{ display:flex; align-items:flex-start; justify-content:space-between; gap:20px; margin-bottom:8px; } #cgsv .cgsv__resultSectionHead>div>span, #cgsv .cgsv__marketHead>div>span{ display:block; margin-bottom:5px; color:var(--cgsv-violet); font-size:10px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; } #cgsv .cgsv__resultSectionHead h4, #cgsv .cgsv__marketHead h4{ margin:0; color:var(--cgsv-ink); font-size:20px; line-height:1.25; letter-spacing:-.025em; font-weight:730; } #cgsv .cgsv__resultStat{ min-width:78px; text-align:right; } #cgsv .cgsv__resultStat strong{ display:block; color:var(--cgsv-violet); font-size:28px; line-height:1; letter-spacing:-.04em; } #cgsv .cgsv__resultStat span{ display:block; margin-top:4px; color:#96919d; font-size:10.5px; } #cgsv .cgsv__reportLead{ margin:0 0 18px; color:#7f7985; font-size:13.5px; line-height:1.55; } #cgsv .cgsv__compGrid--compact{ grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; } #cgsv .cgsv__compGrid--compact li, #cgsv .cgsv__compGrid--more li{ min-height:0; padding:12px 13px; border-radius:12px; border-color:rgba(23,17,38,.06); background:#fafafa; box-shadow:none; } #cgsv .cgsv__compGrid li.is-transfer{ background:rgba(107,72,224,.045); border-color:rgba(107,72,224,.12); box-shadow:none; } #cgsv .cgsv__compGrid strong{ font-size:13px; } #cgsv .cgsv__compGrid em{ font-size:11.5px; color:#8b8591; } #cgsv .cgsv__resultDisclosure, #cgsv .cgsv__pisteDetails, #cgsv .cgsv__marketDetails{ margin-top:14px; border-top:1px solid var(--cgsv-hair); padding-top:12px; } #cgsv .cgsv__resultDisclosure summary, #cgsv .cgsv__pisteDetails summary, #cgsv .cgsv__marketDetails summary{ cursor:pointer; list-style:none; color:#615b68; font-size:12.5px; font-weight:680; } #cgsv .cgsv__resultDisclosure summary::-webkit-details-marker, #cgsv .cgsv__pisteDetails summary::-webkit-details-marker, #cgsv .cgsv__marketDetails summary::-webkit-details-marker{ display:none; } #cgsv .cgsv__resultDisclosure summary::after, #cgsv .cgsv__pisteDetails summary::after, #cgsv .cgsv__marketDetails summary::after{ content:'+'; float:right; color:#a49eaa; font-size:17px; line-height:.8; } #cgsv details[open] > summary::after{ content:'−'; } #cgsv .cgsv__compGrid--more{ margin-top:12px; } /* Question d'intention : ressemble à un contrôle, pas à trois cartes marketing. */ #cgsv .cgsv__intentBlock{ padding:22px 24px; } #cgsv .cgsv__intentQ{ margin-bottom:14px; font-size:15px; font-weight:700; } #cgsv .cgsv__intentBtns{ gap:7px; padding:4px; border-radius:14px; background:#f6f6f8; } #cgsv .cgsv__intentBtn{ min-height:70px; padding:12px 13px; border:1px solid transparent; border-radius:11px; background:transparent; transform:none!important; } #cgsv .cgsv__intentBtn:hover{ border-color:rgba(107,72,224,.12); background:rgba(255,255,255,.7); } #cgsv .cgsv__intentBtn.is-active{ border-color:rgba(107,72,224,.14); background:#fff; box-shadow:0 4px 18px -14px rgba(23,17,38,.3); } #cgsv .cgsv__intentBtn strong{ font-size:13px; } #cgsv .cgsv__intentBtn em{ font-size:11.5px; } /* Pistes : le métier et la proximité sont visibles immédiatement, le détail reste replié. */ #cgsv .cgsv__piste{ gap:13px; padding:17px 0; border-color:var(--cgsv-hair); } #cgsv .cgsv__pisteRank{ width:26px; height:26px; margin-top:1px; background:rgba(107,72,224,.075); color:var(--cgsv-violet)!important; font-size:11px; font-weight:800; } #cgsv .cgsv__pisteTop{ align-items:flex-start; } #cgsv .cgsv__pisteTop h4{ font-size:16px; font-weight:700; } #cgsv .cgsv__pisteMeta{ margin:4px 0 0; font-size:10.5px; color:#a09aa5; } #cgsv .cgsv__pisteMatch{ display:flex; align-items:baseline; gap:4px; padding:5px 9px; color:#5f4ac8; background:rgba(107,72,224,.07); font-size:12px; border-radius:999px; } #cgsv .cgsv__pisteMatch small{ font-size:9px; color:#918a99; font-weight:600; } #cgsv .cgsv__pisteSkills{ margin-top:10px; } #cgsv .cgsv__pisteSkills span{ padding:4px 8px; border-radius:999px; background:#f5f4f8; color:#69636f; font-size:10.5px; } #cgsv .cgsv__pisteSkills em{ display:none; } /* Marché : trois chiffres d'abord, tout le reste derrière un disclosure. */ #cgsv .cgsv__marketSummary{ background: linear-gradient(120deg,rgba(107,72,224,.035),#fff 54%,rgba(249,218,74,.045)); } #cgsv .cgsv__marketHead{ display:flex; justify-content:space-between; align-items:flex-start; gap:18px; margin-bottom:18px; } #cgsv .cgsv__marketHead p{ margin:5px 0 0; color:#918b97; font-size:11.5px; } #cgsv .cgsv__marketLive{ padding:5px 9px; border:1px solid rgba(23,17,38,.07); border-radius:999px; background:rgba(255,255,255,.72); color:#88818f; font-size:10px; font-weight:700; } #cgsv .cgsv__marketMetrics{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; } #cgsv .cgsv__marketMetrics>div{ min-height:90px; padding:13px 14px; border-radius:13px; border:1px solid rgba(23,17,38,.055); background:rgba(255,255,255,.78); } #cgsv .cgsv__marketMetrics span{ display:block; color:#948e99; font-size:10.5px; } #cgsv .cgsv__marketMetrics strong{ display:block; margin:8px 0 4px; color:var(--cgsv-ink); font-size:22px; line-height:1; letter-spacing:-.035em; } #cgsv .cgsv__marketMetrics .cgsv__marketText{ font-size:13px; line-height:1.2; letter-spacing:0; } #cgsv .cgsv__marketMetrics small{ display:block; color:#aaa4ae; font-size:9.5px; line-height:1.35; } #cgsv .cgsv__marketNote{ margin:12px 0 0; color:#817b86; font-size:11.5px; } #cgsv .cgsv__marketDetailsBody{ padding-top:14px; display:grid; gap:13px; } #cgsv .cgsv__marketDetailCard{ padding:14px 15px; border-radius:12px; background:#fafafa; } #cgsv .cgsv__marketDetailCard>span{ display:block; color:#9a949f; font-size:9.5px; text-transform:uppercase; letter-spacing:.08em; } #cgsv .cgsv__marketDetailCard>strong{ display:block; margin-top:4px; font-size:13.5px; color:#3f3946; } #cgsv .cgsv__marketDetailCard p{ margin:5px 0 0; color:#817b87; font-size:11.5px; line-height:1.5; } #cgsv .cgsv__marketDetailSection>strong{ display:block; margin-bottom:7px; color:#4a444f; font-size:12px; } #cgsv .cgsv__marketList{ display:grid; gap:6px; } #cgsv .cgsv__marketList article{ display:flex; justify-content:space-between; gap:12px; align-items:center; padding:11px 12px; border-radius:10px; background:#fafafa; } #cgsv .cgsv__marketList article strong{ display:block; color:#49434e; font-size:12px; } #cgsv .cgsv__marketList article span{ display:block; margin-top:2px; color:#99939e; font-size:10px; } #cgsv .cgsv__marketList article a{ color:var(--cgsv-violet); font-size:11px; font-weight:700; text-decoration:none; white-space:nowrap; } #cgsv .cgsv__marketSources{ display:flex; flex-wrap:wrap; gap:5px; } #cgsv .cgsv__marketSources span{ padding:4px 7px; border-radius:999px; background:#f3f2f5; color:#918b96; font-size:9px; } #cgsv .cgsv__marketHint{ margin:0; color:#8b8590; font-size:11px; } /* Prochaine étape : utile mais beaucoup plus courte. */ #cgsv .cgsv__nextStepSimple{ background: linear-gradient(112deg,rgba(107,72,224,.035),#fff 58%,rgba(249,218,74,.04)); } #cgsv .cgsv__nextStepSimple h4{ margin:3px 0 8px; color:var(--cgsv-ink); font-size:19px; line-height:1.3; letter-spacing:-.02em; } #cgsv .cgsv__nextStepSimple>p{ margin:0; color:#77717e; font-size:13.5px; line-height:1.6; max-width:64ch; } #cgsv .cgsv__nextStepChips{ display:flex; flex-wrap:wrap; gap:6px; margin-top:14px; } #cgsv .cgsv__nextStepChips span{ padding:6px 9px; border-radius:999px; background:#f5f4f7; color:#716b77; font-size:10.5px; font-weight:650; } #cgsv .cgsv__planSteps--compact{ gap:7px; } #cgsv .cgsv__planSteps--compact li{ padding:12px 14px 12px 44px; border-radius:11px; border-color:rgba(23,17,38,.06); background:#fafafa; font-size:12.5px; } #cgsv .cgsv__planSteps--compact li::before{ left:12px; top:10px; width:23px; height:23px; background:rgba(107,72,224,.1); color:var(--cgsv-violet)!important; font-size:10px; } /* CTA final : une seule carte calme, sans rupture visuelle. */ #cgsv .cgsv__bridge{ margin:0; padding:26px 28px; border-radius:18px; border:1px solid var(--cgsv-hair); background:#fff; box-shadow:none; } #cgsv .cgsv__bridge::before{ opacity:.55; } #cgsv .cgsv__bridge h4{ margin-bottom:8px; font-size:19px; } #cgsv .cgsv__bridge p{ margin-bottom:18px; font-size:13.5px; line-height:1.6; color:#77717e; } #cgsv .cgsv__bridge .cgsv__cta{ min-height:44px; padding:12px 18px; font-size:13px; } #cgsv .cgsv__bridgeLink{ font-size:12px; } #cgsv .cgsv__bridgeNote{ margin-top:16px!important; padding-top:14px; font-size:11.5px; } #cgsv .cgsv__nextTools{ background:#fff; padding:24px 26px; } #cgsv .cgsv__nextToolsTitle{ font-size:15px; } #cgsv .cgsv__nextToolsLead{ font-size:12px; margin-bottom:12px; } #cgsv .cgsv__toolCard{ min-height:0; padding:14px 15px; border-radius:12px; border-color:rgba(23,17,38,.07); background:#fafafa; } #cgsv .cgsv__toolCard strong{ font-size:12.5px; } #cgsv .cgsv__toolCard span{ font-size:10.5px; } /* Les autres résultats suivent la même retenue visuelle. */ #cgsv .cgsv__diff, #cgsv .cgsv__ats, #cgsv .cgsv__matchScore, #cgsv .cgsv__cvPreview, #cgsv .cgsv__recapFinal{ border-color:var(--cgsv-hair); box-shadow:none; } #cgsv .cgsv__matchScore{ background:#fff; border-radius:16px; } #cgsv .cgsv__scoreNum{ color:var(--cgsv-violet); } #cgsv .cgsv__cvActions{ padding:10px 0; border-bottom:1px solid var(--cgsv-hair); } @media(max-width:900px){ #cgsv .cgsv__marketMetrics{ grid-template-columns:repeat(2,minmax(0,1fr)); } } @media(max-width:640px){ #cgsv .cgsv__panel{ padding:24px 16px 36px; } #cgsv .cgsv__reportHero, #cgsv .cgsv__reportBlock, #cgsv .cgsv__intentBlock, #cgsv .cgsv__nextTools, #cgsv .cgsv__nextStepSimple, #cgsv .cgsv__marketSummary, #cgsv .cgsv__bridge{ padding:20px 18px; border-radius:15px; } #cgsv .cgsv__reportHero h3{ font-size:25px; } #cgsv .cgsv__compGrid--compact{ grid-template-columns:1fr; } #cgsv .cgsv__resultSectionHead{ gap:12px; } #cgsv .cgsv__resultStat strong{ font-size:24px; } #cgsv .cgsv__intentBtns{ grid-template-columns:1fr; background:transparent; padding:0; } #cgsv .cgsv__intentBtn{ background:#f7f7f8; } #cgsv .cgsv__marketMetrics{ grid-template-columns:1fr 1fr; } #cgsv .cgsv__marketHead{ display:block; } #cgsv .cgsv__marketLive{ display:inline-block; margin-top:10px; } #cgsv .cgsv__pisteTop{ flex-direction:row; align-items:flex-start; } #cgsv .cgsv__pisteMatch{ white-space:nowrap; } #cgsv .cgsv__bridgeActions{ align-items:stretch; } } /* ══════════════════════════════════════════════════════════ V1.9.2 — NAVIGATION / STATE SAFETY Un seul panneau visible à la fois, aucun dock flottant sur le contenu, navigation et dossier alignés sur un modèle applicatif. ══════════════════════════════════════════════════════════ */ #cgsv [hidden]{ display:none!important; } #cgsv .cgsv__workspace{ align-items:start; min-height:0; } #cgsv .cgsv__workArea{ min-height:620px; } #cgsv .cgsv__panel{ min-height:0; scroll-margin-top:92px; } /* Le dossier devient la couche persistante de navigation/état. Il ne crée plus une immense colonne vide et reste visible sans recouvrir le contenu de travail. */ #cgsv .cgsv__dossier{ position:sticky; top:82px; align-self:start; min-height:0; max-height:calc(100vh - 102px); overflow:auto; padding:26px 22px 24px; } #cgsv .cgsv__dossierList li[role="button"]{ cursor:pointer; } #cgsv .cgsv__dossierList li[role="button"]:hover{ background:rgba(107,72,224,.045); } #cgsv .cgsv__dossierList li[role="button"]:focus-visible{ outline:2px solid rgba(107,72,224,.34); outline-offset:1px; } /* L'action suivante vit dans le dossier. Plus aucun bandeau flottant ne peut masquer un titre, un champ ou un résultat. */ #cgsv .cgsv__dossier .cgsv__appActionBar{ position:relative; inset:auto; z-index:auto; margin:20px 0 0; min-height:0; padding:15px; display:grid; grid-template-columns:1fr; gap:12px; border:1px solid rgba(23,17,38,.075); border-radius:14px; background:rgba(255,255,255,.9); box-shadow:none; backdrop-filter:none; } #cgsv .cgsv__dossier .cgsv__appActionBar strong{ font-size:12.5px; line-height:1.45; } #cgsv .cgsv__dossier .cgsv__appActionBar button{ width:100%; min-height:42px; border-radius:10px; } /* Le panneau actif est la seule surface de travail. Le titre garde toujours assez d'air pour ne jamais passer sous une commande. */ #cgsv .cgsv__workHeader{ position:relative; z-index:1; } #cgsv .cgsv__panel:not([hidden]){ display:block; } @media(max-width:880px){ #cgsv .cgsv__dossier{ position:relative; top:auto; max-height:none; overflow:visible; padding:20px 22px 24px; } #cgsv .cgsv__workArea{ min-height:0; } } @media(max-width:640px){ #cgsv .cgsv__dossier .cgsv__appActionBar{ margin-top:16px; } } /* V1.9.2 — détails de finition */ #cgsv .cgsv__tags li.is-more{ background:transparent; border-color:transparent; color:#7f7888; padding-left:4px; padding-right:4px; font-weight:650; } #cgsv .cgsv__gate{ max-width:820px; padding:24px; gap:14px; border-radius:16px; box-shadow:none; } #cgsv .cgsv__gateTitle{ font-size:15px; line-height:1.45; color:#25212b; } #cgsv .cgsv__gate .cgsv__consent--opt{ margin-top:2px; padding:12px 13px; border:1px solid rgba(23,17,38,.07); border-radius:12px; background:#fbfafc; } #cgsv .cgsv__gate .cgsv__cta{ margin-top:3px; } #cgsv input:-webkit-autofill, #cgsv input:-webkit-autofill:hover, #cgsv input:-webkit-autofill:focus, #cgsv textarea:-webkit-autofill, #cgsv select:-webkit-autofill{ -webkit-text-fill-color:#171126; -webkit-box-shadow:0 0 0 1000px #fff inset; box-shadow:0 0 0 1000px #fff inset; transition:background-color 9999s ease-out 0s; } @media(max-width:720px){ #cgsv .cgsv__gate{ max-width:none; padding:18px; } } /* ══════════════════════════════════════════════════════════ V1.9.3 — DEUX PARCOURS CLAIRS 1) J'ai déjà un CV : analyse + ATS dans le même espace. 2) Je n'ai pas de CV : création indépendante. ══════════════════════════════════════════════════════════ */ .cgsv#cgsv{ background: linear-gradient(180deg,rgba(107,72,224,.018),transparent 120px), linear-gradient(90deg,rgba(239,232,255,.26),#fff 48%,rgba(255,244,210,.22)); } #cgsv .cgsv__tabs--paths{ display:grid; grid-template-columns:1fr 1fr; padding:10px; gap:8px; background:rgba(255,255,255,.96); } #cgsv .cgsv__tabs--paths .cgsv__tab{ min-width:0; width:100%; padding:15px 18px 14px 42px; border:1px solid transparent; border-radius:14px; } #cgsv .cgsv__tabs--paths .cgsv__tab:first-child{ padding-left:42px; } #cgsv .cgsv__tabs--paths .cgsv__tab::after{ display:none; } #cgsv .cgsv__tabs--paths .cgsv__tabStatus{ left:18px; top:21px; } #cgsv .cgsv__tabs--paths .cgsv__tab.is-active{ background:linear-gradient(135deg,rgba(107,72,224,.055),rgba(255,248,227,.34)); border-color:rgba(107,72,224,.12); } #cgsv .cgsv__tabs--paths .cgsv__tabName{ font-size:15px; } #cgsv .cgsv__tabs--paths .cgsv__tabSub{ font-size:11.5px; line-height:1.45; } #cgsv .cgsv__workStep{ text-transform:none; letter-spacing:.03em; font-size:11px; color:#6B48E0; } #cgsv .cgsv__workHeader>p{ max-width:430px; } #cgsv .cgsv__noCvHint{ margin-top:14px; display:flex; align-items:center; gap:8px; color:#89838f; font-size:12.5px; } #cgsv .cgsv__textLink{ border:0; background:none; padding:0; color:#6B48E0; font:700 12.5px/1.4 var(--font); cursor:pointer; text-decoration:underline; text-underline-offset:3px; } #cgsv .cgsv__textLink:hover{ color:#171126; } #cgsv .cgsv__dossierList--tools{ padding-top:14px; display:grid; gap:6px; } #cgsv .cgsv__dossierList--tools>div{ display:grid; grid-template-columns:16px 1fr; gap:10px; align-items:start; padding:11px 10px; border-radius:11px; cursor:pointer; } #cgsv .cgsv__dossierList--tools>div:hover{ background:rgba(107,72,224,.04); } #cgsv .cgsv__dossierList--tools>div.is-current{ background:rgba(107,72,224,.055); } #cgsv .cgsv__dossierList--tools .cgsv__toolState{ width:9px; height:9px; margin-top:4px; border-radius:50%; border:1.5px solid #c8c3ce; background:#fff; } #cgsv .cgsv__dossierList--tools>div.is-current .cgsv__toolState{ border-color:#6B48E0; background:#6B48E0; box-shadow:0 0 0 4px rgba(107,72,224,.08); } #cgsv .cgsv__dossierList--tools>div.is-done .cgsv__toolState{ border-color:#26a269; background:#26a269; box-shadow:none; } #cgsv .cgsv__dossierList--tools strong{ display:block; color:#3b3640; font-size:12.5px; line-height:1.35; } #cgsv .cgsv__dossierList--tools small{ display:block; margin-top:2px; color:#97919d; font-size:10.5px; line-height:1.45; } #cgsv .cgsv__dossierList--tools>div.is-done small{ color:#237b53; } #cgsv .cgsv__dossierHint{ margin-top:16px; padding:14px; border:1px solid rgba(23,17,38,.06); border-radius:12px; background:rgba(255,255,255,.72); } #cgsv .cgsv__dossierHint strong{ display:block; font-size:11.5px; color:#4b4651; } #cgsv .cgsv__dossierHint p{ margin:5px 0 0; font-size:10.5px; line-height:1.55; color:#8f8994; } #cgsv .cgsv__dossierHint--build{ background:linear-gradient(135deg,rgba(107,72,224,.05),rgba(255,246,215,.20)); } #cgsv .cgsv__nextTools--single{ background:linear-gradient(135deg,rgba(107,72,224,.045),rgba(255,248,227,.28)); border-color:rgba(107,72,224,.09); } #cgsv .cgsv__nextTools--single .cgsv__nextToolsGrid{ grid-template-columns:1fr; } #cgsv .cgsv__toolCard--primary{ background:#fff; border-color:rgba(107,72,224,.16); } #cgsv .cgsv__toolCard--primary:hover{ border-color:rgba(107,72,224,.32); background:rgba(107,72,224,.025); } /* L'outil "Cibler" historique reste dans le code pour compatibilité REST, mais il n'existe plus comme parcours visible : l'offre est facultative directement dans l'optimisation ATS. */ #cgsv [data-panel="match"]{ display:none!important; } @media(max-width:760px){ #cgsv .cgsv__tabs--paths{ grid-template-columns:1fr; } #cgsv .cgsv__tabs--paths .cgsv__tab, #cgsv .cgsv__tabs--paths .cgsv__tab:first-child{ padding-left:40px; } #cgsv .cgsv__noCvHint{ align-items:flex-start; flex-direction:column; gap:3px; } } /* ══════════════════════════════════════════════════════════════════ V2.0.0 — DIAGNOSTIC PROFESSIONNEL Une seule promesse : comprendre ce qui bloque et quoi faire ensuite. ══════════════════════════════════════════════════════════════════ */ #cgsv[hidden], #cgsv [hidden]{display:none!important} #cgsv{ --v2-ink:#171126; --v2-muted:#6f697a; --v2-line:#ebe7f0; --v2-violet:#6b48e0; --v2-violet-soft:#f4f0ff; --v2-yellow-soft:#fff8dc; --v2-green:#21734a; position:relative; box-sizing:border-box; width:min(1480px,calc(100vw - 28px)); max-width:none!important; margin:24px 50%!important; transform:translateX(-50%); padding:22px; color:var(--v2-ink); background:linear-gradient(118deg,rgba(238,231,255,.72) 0%,rgba(253,251,251,.98) 46%,rgba(255,246,205,.62) 100%); border:1px solid rgba(107,72,224,.08); border-radius:34px; box-shadow:0 28px 90px rgba(23,17,38,.08); overflow:clip; } #cgsv:before{ content:"";position:absolute;inset:0;pointer-events:none; background:radial-gradient(circle at 14% 4%,rgba(107,72,224,.08),transparent 28%),radial-gradient(circle at 87% 4%,rgba(249,218,74,.12),transparent 25%); } #cgsv .cgsv__appHeader--v2{position:relative;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:4px 8px 20px;background:transparent;border:0;box-shadow:none} #cgsv .cgsv__appBrand strong{font-size:15px;letter-spacing:.16em;color:var(--v2-ink)} #cgsv .cgsv__appBrand span{font-size:12px;color:var(--v2-muted);margin-top:3px} #cgsv .cgsv__v2Trust{display:flex;align-items:center;gap:8px;color:var(--v2-muted);font-size:12px} #cgsv .cgsv__v2Trust>span{width:8px;height:8px;border-radius:50%;background:#44a46c;box-shadow:0 0 0 4px rgba(68,164,108,.10)} #cgsv .cgsv__v2Trust strong{font-size:12px;color:var(--v2-ink)} #cgsv .cgsv__v2Trust small:before{content:"·";margin-right:8px} #cgsv .cgsv__v2Welcome{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(420px,.95fr);gap:56px;align-items:center;min-height:650px;padding:54px clamp(26px,5vw,78px) 68px} #cgsv .cgsv__v2WelcomeCopy{max-width:720px} #cgsv .cgsv__v2Eyebrow{display:inline-block;margin-bottom:20px;font-size:12px;line-height:1.2;font-weight:750;letter-spacing:.10em;text-transform:uppercase;color:var(--v2-violet)} #cgsv .cgsv__v2Welcome h1{margin:0;max-width:760px;font-size:clamp(42px,4.55vw,72px);line-height:.99;letter-spacing:-.052em;font-weight:720;color:var(--v2-ink)} #cgsv .cgsv__v2WelcomeCopy>p{max-width:690px;margin:28px 0 0;font-size:clamp(17px,1.35vw,20px);line-height:1.62;color:#615a6c} #cgsv .cgsv__v2WelcomeCopy>p strong{color:var(--v2-ink);font-weight:650} #cgsv .cgsv__v2Promise{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:34px;color:#5f5969;font-size:13px} #cgsv .cgsv__v2Promise span{display:flex;align-items:center;gap:8px} #cgsv .cgsv__v2Promise b{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:rgba(255,255,255,.72);border:1px solid rgba(107,72,224,.13);color:var(--v2-violet);font-size:11px} #cgsv .cgsv__v2Promise i{width:20px;height:1px;background:rgba(23,17,38,.12)} #cgsv .cgsv__v2Start{padding:26px;background:rgba(255,255,255,.82);border:1px solid rgba(255,255,255,.9);border-radius:28px;box-shadow:0 25px 70px rgba(23,17,38,.08),inset 0 1px 0 #fff;backdrop-filter:blur(12px)} #cgsv .cgsv__v2StartTitle{margin:0 0 14px;font-size:13px;font-weight:700;color:#514b5c} #cgsv .cgsv__v2StartCard{width:100%;display:grid;grid-template-columns:42px 1fr auto;gap:13px;align-items:center;text-align:left;margin:0 0 10px;padding:17px;border:1px solid var(--v2-line);border-radius:18px;background:#fff;color:var(--v2-ink);cursor:pointer;transition:.2s ease;box-shadow:none} #cgsv .cgsv__v2StartCard:hover{transform:translateY(-1px);border-color:#d8cff6;box-shadow:0 12px 28px rgba(23,17,38,.07)} #cgsv .cgsv__v2StartCard--quiet{background:#fbfafc} #cgsv .cgsv__v2StartIcon{display:grid;place-items:center;width:42px;height:42px;border-radius:13px;background:var(--v2-violet-soft);color:var(--v2-violet);font-size:13px;font-weight:800} #cgsv .cgsv__v2StartCard strong{display:block;font-size:15px;line-height:1.3} #cgsv .cgsv__v2StartCard small{display:block;margin-top:4px;font-size:12.5px;line-height:1.45;color:var(--v2-muted);font-weight:450} #cgsv .cgsv__v2StartCard em{font-style:normal;font-size:12px;font-weight:700;color:var(--v2-violet)} #cgsv .cgsv__v2Time{text-align:center;margin:14px 0 0;font-size:11.5px;color:#8b8494} #cgsv .cgsv__v2Diagnostic{position:relative;z-index:1;max-width:950px;margin:22px auto 50px;padding:42px clamp(24px,5vw,58px);background:rgba(255,255,255,.93);border:1px solid rgba(255,255,255,.95);border-radius:30px;box-shadow:0 24px 70px rgba(23,17,38,.08)} #cgsv .cgsv__v2Back{border:0;background:transparent;padding:0;margin:0 0 34px;color:#746d7d;font-size:13px;cursor:pointer} #cgsv .cgsv__v2DiagHead{max-width:710px;margin-bottom:34px} #cgsv .cgsv__v2DiagHead>span{display:block;margin-bottom:9px;color:var(--v2-violet);font-size:11px;letter-spacing:.09em;text-transform:uppercase;font-weight:800} #cgsv .cgsv__v2DiagHead h2{margin:0;font-size:clamp(31px,3.3vw,48px);line-height:1.06;letter-spacing:-.035em} #cgsv .cgsv__v2DiagHead p{margin:14px 0 0;font-size:16px;line-height:1.6;color:var(--v2-muted)} #cgsv .cgsv__v2Question{padding:24px 0;border-top:1px solid var(--v2-line)} #cgsv .cgsv__v2Question:first-child{border-top:0;padding-top:0} #cgsv .cgsv__v2Question label:not(.cgsv__v2Choices label),#cgsv .cgsv__v2QLabel{display:block;margin-bottom:12px;font-size:15px;font-weight:700;color:var(--v2-ink)} #cgsv .cgsv__v2Question label span{font-weight:500;color:var(--v2-muted)} #cgsv .cgsv__v2Question input[type=text]{width:100%;height:54px;border:1px solid #ddd8e4;border-radius:14px;background:#fff;padding:0 16px;font-size:16px;color:var(--v2-ink);outline:none;box-shadow:none} #cgsv .cgsv__v2Question input[type=text]:focus{border-color:#a997ee;box-shadow:0 0 0 4px rgba(107,72,224,.08)} #cgsv .cgsv__v2Question>small{display:block;margin-top:8px;color:#8b8494;font-size:12px;line-height:1.45} #cgsv .cgsv__v2Question--short{max-width:390px} #cgsv .cgsv__v2Choices{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px} #cgsv .cgsv__v2Choices--stack{grid-template-columns:1fr 1fr} #cgsv .cgsv__v2Choices label{position:relative;display:block;margin:0;cursor:pointer} #cgsv .cgsv__v2Choices input{position:absolute;opacity:0;pointer-events:none} #cgsv .cgsv__v2Choices span{display:flex;min-height:50px;align-items:center;padding:11px 13px;border:1px solid #e3dfe8;border-radius:13px;background:#fff;color:#554f60;font-size:13px;line-height:1.35;transition:.18s ease} #cgsv .cgsv__v2Choices input:checked+span{border-color:#9179e9;background:var(--v2-violet-soft);color:var(--v2-ink);box-shadow:0 0 0 2px rgba(107,72,224,.05)} #cgsv .cgsv__v2Continue{margin-top:22px;min-width:240px} #cgsv .cgsv__v2CvChoice{display:grid;grid-template-columns:1fr 1fr;gap:14px} #cgsv .cgsv__v2CvChoice button{padding:26px;text-align:left;border:1px solid var(--v2-line);border-radius:20px;background:#fff;cursor:pointer;color:var(--v2-ink);transition:.2s ease} #cgsv .cgsv__v2CvChoice button:hover{border-color:#cfc4f5;transform:translateY(-2px);box-shadow:0 12px 28px rgba(23,17,38,.06)} #cgsv .cgsv__v2CvChoice strong{display:block;font-size:19px;margin-bottom:7px} #cgsv .cgsv__v2CvChoice span{display:block;font-size:14px;line-height:1.5;color:var(--v2-muted)} #cgsv .cgsv__tabs--v2{position:relative;z-index:1;max-width:1260px;margin:0 auto 14px;padding:5px;background:rgba(255,255,255,.78);border:1px solid rgba(255,255,255,.9);border-radius:15px;box-shadow:none} #cgsv .cgsv__tabs--v2 .cgsv__tab{min-height:auto;padding:10px 16px;border-radius:11px;background:transparent;border:0;color:#777080} #cgsv .cgsv__tabs--v2 .cgsv__tab.is-active{background:#fff;color:var(--v2-ink);box-shadow:0 4px 12px rgba(23,17,38,.05)} #cgsv .cgsv__workspace--v2{position:relative;z-index:1;grid-template-columns:minmax(0,1fr) 310px;gap:18px;max-width:1260px;margin:0 auto 12px} #cgsv .cgsv__workArea{min-width:0;background:rgba(255,255,255,.96);border:1px solid rgba(255,255,255,.98);border-radius:24px;box-shadow:0 16px 44px rgba(23,17,38,.06);overflow:hidden} #cgsv .cgsv__panel{padding:34px clamp(22px,3vw,44px) 46px} #cgsv .cgsv__workHeader--v2{display:block;max-width:820px;margin:0 0 26px;padding:0;border:0;background:transparent} #cgsv .cgsv__workHeader--v2 .cgsv__workStep{display:block;margin-bottom:8px;color:var(--v2-violet);font-size:11px;text-transform:uppercase;letter-spacing:.09em;font-weight:800} #cgsv .cgsv__workHeader--v2 h2{margin:0;font-size:clamp(28px,3vw,42px);line-height:1.08;letter-spacing:-.035em} #cgsv .cgsv__workHeader--v2>p{margin:12px 0 0;max-width:760px;color:var(--v2-muted);font-size:15px;line-height:1.55} #cgsv .cgsv__contextStrip{display:grid;grid-template-columns:1fr 1fr auto;gap:12px;align-items:center;margin:0 0 24px;padding:14px 16px;background:#faf9fc;border:1px solid var(--v2-line);border-radius:15px} #cgsv .cgsv__contextStrip small{display:block;font-size:10px;color:#8a8492;text-transform:uppercase;letter-spacing:.06em} #cgsv .cgsv__contextStrip strong{display:block;margin-top:3px;font-size:13px} #cgsv .cgsv__contextStrip button{border:0;background:transparent;color:var(--v2-violet);font-weight:700;font-size:12px;cursor:pointer} #cgsv .cgsv__v2UploadCard{max-width:760px;margin:0 auto} #cgsv .cgsv__drop{min-height:300px;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:38px;border:1.5px dashed #cfc7dc;border-radius:22px;background:#fcfbfd;transition:.2s ease} #cgsv .cgsv__drop.is-over{border-color:#8d73e7;background:#f8f5ff} #cgsv .cgsv__drop.is-staged{border-style:solid;border-color:#d8d1e2;background:#fff} #cgsv .cgsv__dropIcon{width:34px;height:34px;color:#7d6cae;margin-bottom:16px} #cgsv .cgsv__dropText{font-size:22px!important;font-weight:700!important;letter-spacing:-.02em;color:var(--v2-ink)!important;margin:0 0 5px!important} #cgsv .cgsv__dropSub{font-size:12px;color:#8b8592;margin:0 0 18px} #cgsv .cgsv__file span{display:inline-flex;align-items:center;justify-content:center;padding:11px 18px;border-radius:999px;background:var(--v2-ink);color:#fff;font-size:13px;font-weight:700} #cgsv .cgsv__fileReady{margin-top:18px;max-width:520px;width:100%;grid-template-columns:44px 1fr auto;padding:12px;border:1px solid var(--v2-line);border-radius:14px;background:#fff} #cgsv .cgsv__v2Privacy{display:flex;gap:11px;align-items:flex-start;margin-top:14px;padding:13px 15px;border-radius:14px;background:rgba(244,240,255,.55)} #cgsv .cgsv__v2PrivacyIcon{display:grid;place-items:center;flex:0 0 22px;width:22px;height:22px;border-radius:50%;background:#e8f5ed;color:#24724a;font-size:12px;font-weight:800} #cgsv .cgsv__v2Privacy strong{font-size:12.5px} #cgsv .cgsv__v2Privacy p{margin:3px 0 0;font-size:11.5px;line-height:1.45;color:var(--v2-muted)} #cgsv .cgsv__consent--v2{max-width:760px;margin:18px auto 0} #cgsv .cgsv__cta--scan{display:flex;margin:16px auto 0;min-width:230px} #cgsv .cgsv__v2Loading{max-width:720px;margin:28px auto;padding:56px 34px;text-align:center} #cgsv .cgsv__spin--v2{width:34px;height:34px;margin:0 auto 20px;border-width:3px} #cgsv .cgsv__v2Loading h3{margin:0;font-size:28px;letter-spacing:-.025em} #cgsv .cgsv__v2Loading>p{margin:10px 0 0;color:var(--v2-muted);font-size:14px} #cgsv .cgsv__v2LoadingSteps{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:34px} #cgsv .cgsv__v2LoadingSteps span{padding:11px 8px;border-radius:12px;background:#faf9fc;color:#6f6978;font-size:11px} #cgsv .cgsv__v2LoadingSteps i{display:block;width:5px;height:5px;margin:0 auto 7px;border-radius:50%;background:#9c87e8} #cgsv .cgsv__v2Teaser{max-width:820px;margin:0 auto 18px;padding:22px 24px;border-radius:18px;background:#fbfafc;border:1px solid var(--v2-line)} #cgsv .cgsv__v2Teaser>span{display:block;margin-bottom:7px;font-size:10px;text-transform:uppercase;letter-spacing:.08em;color:var(--v2-violet);font-weight:800} #cgsv .cgsv__v2Teaser .cgsv__found{font-size:16px;line-height:1.5;color:var(--v2-ink)} #cgsv .cgsv__v2Teaser .cgsv__tags{margin-top:14px} #cgsv .cgsv__gate--v2{max-width:820px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:34px;padding:30px;border:1px solid var(--v2-line);border-radius:22px;background:#fff;box-shadow:0 14px 36px rgba(23,17,38,.05)} #cgsv .cgsv__v2GateCopy>span{color:var(--v2-violet);font-size:10px;font-weight:800;letter-spacing:.08em;text-transform:uppercase} #cgsv .cgsv__v2GateCopy h3{margin:8px 0 10px;font-size:26px;line-height:1.12;letter-spacing:-.025em} #cgsv .cgsv__v2GateCopy p{margin:0;color:var(--v2-muted);font-size:13.5px;line-height:1.55} #cgsv .cgsv__v2GateForm .cgsv__field{margin-bottom:12px} #cgsv .cgsv__v2GateForm .cgsv__consent{margin:8px 0 14px} #cgsv .cgsv__full--v2{max-width:900px;margin:0 auto} #cgsv .cgsv__v2ResultHero{padding:30px;border-radius:22px;background:linear-gradient(130deg,#f4f0ff 0%,#fff 58%,#fff9df 100%);border:1px solid rgba(107,72,224,.10)} #cgsv .cgsv__v2ResultKicker{display:block;margin-bottom:10px;color:var(--v2-violet);font-size:10.5px;font-weight:800;letter-spacing:.09em;text-transform:uppercase} #cgsv .cgsv__v2ResultHero h3{max-width:740px;margin:0;font-size:clamp(31px,3.5vw,48px);line-height:1.04;letter-spacing:-.04em} #cgsv .cgsv__v2ResultHero p{max-width:760px;margin:15px 0 0;font-size:16px;line-height:1.6;color:#625b6d} #cgsv .cgsv__v2Metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:12px 0 28px} #cgsv .cgsv__v2Metrics>div{padding:17px 18px;border:1px solid var(--v2-line);border-radius:16px;background:#fff} #cgsv .cgsv__v2Metrics span{display:block;font-size:10px;text-transform:uppercase;letter-spacing:.06em;color:#918a98} #cgsv .cgsv__v2Metrics strong{display:block;margin-top:7px;font-size:17px;line-height:1.25} #cgsv .cgsv__v2Metrics small{display:block;margin-top:5px;font-size:11px;line-height:1.35;color:#817a89} #cgsv .cgsv__v2Priority{display:grid;grid-template-columns:1fr auto;gap:22px;align-items:center;padding:25px 0 30px;border-bottom:1px solid var(--v2-line)} #cgsv .cgsv__v2Priority span,#cgsv .cgsv__v2SectionHead>span,#cgsv .cgsv__v2HumanCopy>span{display:block;margin-bottom:7px;color:var(--v2-violet);font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.08em} #cgsv .cgsv__v2Priority h4,#cgsv .cgsv__v2SectionHead h4,#cgsv .cgsv__v2Human h4{margin:0;font-size:25px;line-height:1.15;letter-spacing:-.025em} #cgsv .cgsv__v2Priority p,#cgsv .cgsv__v2SectionHead p,#cgsv .cgsv__v2Human p{margin:9px 0 0;color:var(--v2-muted);font-size:14px;line-height:1.55} #cgsv .cgsv__v2PriorityBtns{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end} #cgsv .cgsv__v2Alternatives{padding:34px 0 24px} #cgsv .cgsv__v2SectionHead{max-width:700px;margin-bottom:18px} #cgsv .cgsv__v2AltGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px} #cgsv .cgsv__v2AltGrid article{min-width:0;padding:19px;border:1px solid var(--v2-line);border-radius:17px;background:#fff} #cgsv .cgsv__v2AltTop{display:flex;gap:11px;align-items:flex-start} #cgsv .cgsv__v2AltTop>span{display:grid;place-items:center;flex:0 0 30px;width:30px;height:30px;border-radius:10px;background:var(--v2-violet-soft);color:var(--v2-violet);font-size:10px;font-weight:800} #cgsv .cgsv__v2AltTop h5{margin:1px 0 3px;font-size:16px;line-height:1.25} #cgsv .cgsv__v2AltTop small{font-size:10.5px;color:#918a98} #cgsv .cgsv__v2AltSkills{display:flex;flex-wrap:wrap;gap:5px;margin-top:16px} #cgsv .cgsv__v2AltSkills span{padding:5px 7px;border-radius:8px;background:#f7f5fa;color:#615a6b;font-size:10.5px} #cgsv .cgsv__v2AltGrid article>p{margin:13px 0 0;font-size:11.5px;line-height:1.45;color:#817b87} #cgsv .cgsv__v2Details{margin:12px 0 30px;border-top:1px solid var(--v2-line);border-bottom:1px solid var(--v2-line)} #cgsv .cgsv__v2Details>summary{padding:17px 2px;cursor:pointer;font-weight:700;font-size:13px;color:#5f5967} #cgsv .cgsv__v2DetailsBody{display:grid;grid-template-columns:1fr 1fr;gap:26px;padding:0 0 24px} #cgsv .cgsv__v2DetailsBody h5{margin:0 0 10px;font-size:13px} #cgsv .cgsv__v2DetailSkills,#cgsv .cgsv__v2OfferList{list-style:none;margin:0;padding:0} #cgsv .cgsv__v2DetailSkills li{padding:8px 0;border-bottom:1px solid #f0edf3} #cgsv .cgsv__v2DetailSkills strong{display:block;font-size:12.5px} #cgsv .cgsv__v2DetailSkills span{display:block;margin-top:2px;font-size:10.5px;color:#8a8491} #cgsv .cgsv__v2OfferList li{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:9px 0;border-bottom:1px solid #f0edf3} #cgsv .cgsv__v2OfferList strong{display:block;font-size:12.5px}.cgsv__v2OfferList span{display:block;font-size:10.5px;color:#8a8491} #cgsv .cgsv__v2OfferList a{font-size:11px;color:var(--v2-violet);font-weight:700;text-decoration:none} #cgsv .cgsv__v2Human{display:grid;grid-template-columns:1.1fr .9fr;gap:28px;padding:28px;border-radius:22px;background:#faf8ff;border:1px solid #e7e0fb} #cgsv .cgsv__v2HumanCopy ul{display:flex;gap:14px;list-style:none;padding:0;margin:16px 0 0;color:#6c6574;font-size:11px} #cgsv .cgsv__v2HumanCopy li:before{content:"✓";color:var(--v2-green);margin-right:5px;font-weight:800} #cgsv .cgsv__v2Callback{padding:18px;border-radius:16px;background:#fff;border:1px solid var(--v2-line)} #cgsv .cgsv__v2Callback>label:first-child{display:block;margin-bottom:7px;font-size:11px;font-weight:700;color:#5d5766} #cgsv .cgsv__v2Callback>input{width:100%;height:48px;padding:0 13px;border:1px solid #ddd8e4;border-radius:12px;font-size:15px;outline:none} #cgsv .cgsv__consent--callback{margin:12px 0;font-size:11px!important} #cgsv .cgsv__v2Callback .cgsv__cta{width:100%} #cgsv .cgsv__v2Calendly{display:block;margin-top:11px;text-align:center;color:var(--v2-violet);font-size:11.5px;font-weight:700;text-decoration:none} #cgsv .cgsv__v2After{display:grid;grid-template-columns:1fr auto;gap:4px 18px;align-items:center;margin-top:16px;padding:16px 18px;border-radius:15px;background:#fff;border:1px solid var(--v2-line)} #cgsv .cgsv__v2After strong{font-size:12.5px}.cgsv__v2After span{font-size:11px;color:#817a89}.cgsv__v2After button{grid-column:2;grid-row:1/3;border:0;background:transparent;color:var(--v2-violet);font-size:12px;font-weight:800;cursor:pointer} #cgsv .cgsv__dossier--v2{align-self:start;position:sticky;top:18px;padding:18px;background:rgba(255,255,255,.88);border:1px solid rgba(255,255,255,.96);border-radius:22px;box-shadow:0 12px 34px rgba(23,17,38,.05);backdrop-filter:blur(10px)} #cgsv .cgsv__dossier--v2 .cgsv__dossierHead{padding:2px 2px 14px;border-bottom:1px solid var(--v2-line)} #cgsv .cgsv__dossier--v2 .cgsv__dossierHead span{font-size:10px;color:#918a98;text-transform:uppercase;letter-spacing:.07em} #cgsv .cgsv__dossier--v2 .cgsv__dossierHead strong{font-size:13px} #cgsv .cgsv__dossierSnapshot{padding:14px 2px;display:grid;gap:10px;border-bottom:1px solid var(--v2-line)} #cgsv .cgsv__dossierSnapshot small{display:block;font-size:9.5px;text-transform:uppercase;letter-spacing:.05em;color:#9a94a0} #cgsv .cgsv__dossierSnapshot strong{display:block;margin-top:2px;font-size:11.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} #cgsv .cgsv__dossier--v2 .cgsv__dossierList{padding:10px 0} #cgsv .cgsv__dossier--v2 [data-dossier]{padding:10px 8px;border-radius:11px;cursor:pointer} #cgsv .cgsv__dossier--v2 [data-dossier].is-current{background:#f6f3ff} #cgsv .cgsv__dossier--v2 [data-dossier] strong{font-size:11.5px}.cgsv__dossier--v2 [data-dossier] small{font-size:9.5px} #cgsv .cgsv__dossierHint--v2{margin:7px 0;padding:13px;border-radius:12px;background:#fbfafc;border:0} #cgsv .cgsv__dossierHint--v2 strong{font-size:11px}.cgsv__dossierHint--v2 p{font-size:10.5px;line-height:1.45} #cgsv .cgsv__dossierSources{margin-top:10px;padding:11px 0;border-top:1px solid var(--v2-line)} #cgsv .cgsv__dossierSources strong{font-size:10.5px}.cgsv__dossierSources small{font-size:9px;line-height:1.35} #cgsv .cgsv__appActionBar{position:static!important;display:block!important;margin-top:9px;padding:12px;border-radius:13px;background:var(--v2-ink);color:#fff;box-shadow:none!important} #cgsv .cgsv__appActionBar small{color:#bdb7c5;font-size:9px}.cgsv__appActionBar strong{display:block;margin:3px 0 9px;font-size:11px;line-height:1.35}.cgsv__appActionBar button{width:100%;padding:9px 11px;border-radius:10px;background:#fff;color:var(--v2-ink);font-size:11px;font-weight:800} /* Les modules CV existants restent disponibles, mais visuellement secondaires. */ #cgsv [data-panel="optimize"] .cgsv__workHeader,#cgsv [data-panel="build"] .cgsv__workHeader{max-width:800px;margin-bottom:26px} #cgsv [data-panel="optimize"] .cgsv__workHeader h2,#cgsv [data-panel="build"] .cgsv__workHeader h2{font-size:clamp(27px,3vw,40px);letter-spacing:-.03em} #cgsv [data-panel="optimize"] .cgsv__drop{min-height:210px} #cgsv .cgsv__field input,#cgsv .cgsv__field textarea,#cgsv .cgsv__field select{border-color:#dfdbe5!important;box-shadow:none!important} #cgsv .cgsv__field input:focus,#cgsv .cgsv__field textarea:focus,#cgsv .cgsv__field select:focus{border-color:#9e8ae9!important;box-shadow:0 0 0 3px rgba(107,72,224,.07)!important} @media(max-width:1050px){ #cgsv .cgsv__v2Welcome{grid-template-columns:1fr;gap:34px;min-height:auto;padding-top:36px} #cgsv .cgsv__v2WelcomeCopy{max-width:850px} #cgsv .cgsv__workspace--v2{grid-template-columns:1fr} #cgsv .cgsv__dossier--v2{position:static;order:-1} #cgsv .cgsv__dossierHint--v2{display:none} #cgsv .cgsv__dossierSnapshot{grid-template-columns:1fr 1fr} #cgsv .cgsv__dossier--v2 .cgsv__dossierList{display:grid;grid-template-columns:1fr 1fr;gap:6px} #cgsv .cgsv__appActionBar{display:grid!important;grid-template-columns:1fr auto;align-items:center;gap:12px} #cgsv .cgsv__appActionBar button{width:auto} } @media(max-width:760px){ #cgsv{width:calc(100vw - 12px);margin:6px 50%!important;padding:12px;border-radius:22px} #cgsv .cgsv__appHeader--v2{padding:5px 3px 14px}.cgsv__v2Trust small{display:none} #cgsv .cgsv__v2Welcome{padding:28px 8px 36px;gap:26px} #cgsv .cgsv__v2Welcome h1{font-size:42px} #cgsv .cgsv__v2WelcomeCopy>p{font-size:16px} #cgsv .cgsv__v2Promise i{display:none} #cgsv .cgsv__v2Start{padding:14px;border-radius:20px} #cgsv .cgsv__v2StartCard{grid-template-columns:38px 1fr;padding:14px}.cgsv__v2StartCard em{display:none}.cgsv__v2StartIcon{width:38px;height:38px} #cgsv .cgsv__v2Diagnostic{margin:10px 0 24px;padding:28px 18px;border-radius:22px} #cgsv .cgsv__v2Choices,#cgsv .cgsv__v2Choices--stack{grid-template-columns:1fr 1fr} #cgsv .cgsv__v2CvChoice{grid-template-columns:1fr} #cgsv .cgsv__workspace--v2{gap:10px}.cgsv__workArea{border-radius:18px}.cgsv__panel{padding:24px 16px 34px} #cgsv .cgsv__contextStrip{grid-template-columns:1fr}.cgsv__contextStrip button{text-align:left;padding:0} #cgsv .cgsv__drop{min-height:240px;padding:24px 15px}.cgsv__dropText{font-size:19px!important} #cgsv .cgsv__v2LoadingSteps{grid-template-columns:1fr 1fr} #cgsv .cgsv__gate--v2{grid-template-columns:1fr;padding:20px;gap:20px} #cgsv .cgsv__v2Metrics{grid-template-columns:1fr}.cgsv__v2Priority{grid-template-columns:1fr}.cgsv__v2PriorityBtns{justify-content:flex-start} #cgsv .cgsv__v2AltGrid{grid-template-columns:1fr}.cgsv__v2DetailsBody{grid-template-columns:1fr}.cgsv__v2Human{grid-template-columns:1fr;padding:20px} #cgsv .cgsv__v2After{grid-template-columns:1fr}.cgsv__v2After button{grid-column:1;grid-row:auto;text-align:left;padding:8px 0 0} #cgsv .cgsv__dossier--v2 .cgsv__dossierList{grid-template-columns:1fr}.cgsv__appActionBar{grid-template-columns:1fr!important} } @media(max-width:480px){ #cgsv .cgsv__v2Welcome h1{font-size:36px} #cgsv .cgsv__v2Choices,#cgsv .cgsv__v2Choices--stack{grid-template-columns:1fr} #cgsv .cgsv__v2Promise{gap:8px}.cgsv__v2Promise span{font-size:11.5px} } /* v2.0.2 — vrai téléchargement PDF */ .cgsv__downloadBtn{ appearance:none;border:0;border-radius:999px;background:#171126;color:#fff; padding:12px 18px;font:700 14px/1.1 inherit;cursor:pointer;transition:.18s ease; box-shadow:0 8px 22px -14px rgba(23,17,38,.45) } .cgsv__downloadBtn:hover{transform:translateY(-1px);background:#241a3a} .cgsv__downloadBtn:disabled{opacity:.58;cursor:wait;transform:none} .cgsv__pdfError{font-size:12px;color:#b42318;margin-left:4px} .cgsv__dlGate{transition:box-shadow .2s ease,border-color .2s ease,transform .2s ease} .cgsv__dlGate.is-attention{border-color:rgba(107,72,224,.45)!important;box-shadow:0 0 0 4px rgba(107,72,224,.08);transform:translateY(-1px)} /* ══════════════════════════════════════════════════════════ CHANGER 2.1 — STUDIO DE DESIGNS PREMIUM ══════════════════════════════════════════════════════════ */ #cgsv .cgsv__premiumWrap{margin:14px 0 2px;padding:16px;border:1px solid #EAE5F2;border-radius:18px;background:linear-gradient(135deg,rgba(242,236,255,.62),rgba(255,255,255,.96) 55%,rgba(255,245,215,.48));} #cgsv .cgsv__premiumIntro{display:flex;flex-direction:column;gap:3px;margin-bottom:12px;} #cgsv .cgsv__premiumIntro strong{font-size:13px;color:#171126;} #cgsv .cgsv__premiumIntro span,#cgsv .cgsv__tplLead{font-size:12.5px;line-height:1.5;color:#716B7D;} #cgsv .cgsv__tplPicker--premium{padding:18px;border:1px solid #EAE5F2;border-radius:20px;background:linear-gradient(135deg,rgba(242,236,255,.5),#fff 58%,rgba(255,245,215,.38));} #cgsv .cgsv__tplGrid--premium{grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;} #cgsv .cgsv__tplCard--premium{position:relative;padding:9px;border:1px solid #E7E2EF;border-radius:15px;background:rgba(255,255,255,.96);box-shadow:0 6px 20px -18px rgba(23,17,38,.28);transform:none;} #cgsv .cgsv__tplCard--premium:hover{border-color:#BEB0F5;transform:translateY(-1px);} #cgsv .cgsv__tplCard--premium.is-selected{border-color:#6B48E0;box-shadow:0 0 0 2px rgba(107,72,224,.08),0 10px 26px -22px rgba(107,72,224,.6);} #cgsv .cgsv__tplBadge{position:absolute;top:15px;right:14px;z-index:2;padding:3px 6px;border-radius:999px;background:rgba(255,255,255,.9);border:1px solid #E8E2F3;color:#5C4A91;font-size:8px;font-weight:700;letter-spacing:.03em;} #cgsv .cgsv__tplCard--premium .cgsv__tplThumb{height:108px;border-radius:9px;background:#fff;border:1px solid #EEEAF4;box-shadow:0 7px 18px -15px rgba(23,17,38,.32);padding:10px;} #cgsv .cgsv__tplCard--premium .cgsv__tplName{font-size:12.5px;margin-top:2px;} #cgsv .cgsv__tplCard--premium .cgsv__tplDesc{font-size:10.5px;} #cgsv .cgsv__tplThumb .t-head{position:absolute;left:0;top:0;width:100%;height:18px;background:#F6F3FA;border-radius:0;} #cgsv .cgsv__tplThumb .t-name{position:relative;width:55%;height:7px;margin-top:10px;background:#342A49;} #cgsv .cgsv__tplThumb .t-job{width:37%;height:4px;background:#6B48E0;margin:4px 0 10px;} #cgsv .cgsv__tplThumb .t-col{position:absolute;right:9px;top:42px;width:26%;height:50px;background:#F6F3FA;border-radius:3px;} #cgsv .cgsv__tplThumb .t-line{width:61%;height:3px;margin-bottom:5px;background:#DDD8E7;} #cgsv .cgsv__tplThumb .t-line.s{width:49%;} #cgsv .cgsv__tplThumb .t-line.xs{width:56%;} #cgsv .cgsv__tplThumb--signature .t-head{height:5px;background:#EEE7FF;} #cgsv .cgsv__tplThumb--signature .t-col{display:none;} #cgsv .cgsv__tplThumb--signature .t-line{width:88%;} #cgsv .cgsv__tplThumb--signature .t-line.s{width:73%;} #cgsv .cgsv__tplThumb--modern .t-head{height:35px;background:linear-gradient(110deg,#EFE7FF,#FBFAF7 62%,#FFF2C8);border-left:4px solid #6B48E0;} #cgsv .cgsv__tplThumb--modern .t-name{margin-top:4px;} #cgsv .cgsv__tplThumb--modern .t-col{display:none;} #cgsv .cgsv__tplThumb--modern .t-line{width:88%;} #cgsv .cgsv__tplThumb--executive .t-head{height:33px;background:#171126;} #cgsv .cgsv__tplThumb--executive .t-name{margin-top:2px;background:#fff;} #cgsv .cgsv__tplThumb--executive .t-job{background:#CFC2FA;} #cgsv .cgsv__tplThumb--executive .t-col{background:#F1EEF4;} #cgsv .cgsv__tplThumb--editorial{border-left:5px solid #EFE4FF !important;} #cgsv .cgsv__tplThumb--editorial .t-head{display:none;} #cgsv .cgsv__tplThumb--editorial .t-name{height:10px;width:68%;margin-top:4px;background:#171126;} #cgsv .cgsv__tplThumb--editorial .t-job{width:48%;margin-bottom:13px;} /* Aperçu réel — 4 identités distinctes, sans effets décoratifs inutiles */ #cgsv .cgs-cv--signature{--cv-accent:#6B48E0;--cv-rule:#E8E3F4;} #cgsv .cgs-cv--signature .cgs-cv__header{border-bottom:0;padding-bottom:17px;position:relative;} #cgsv .cgs-cv--signature .cgs-cv__header:after{content:"";position:absolute;left:0;bottom:0;width:54px;height:3px;background:var(--cv-accent);} #cgsv .cgs-cv--signature .cgs-cv__ident h1{font-size:23pt;font-weight:700;letter-spacing:-.035em;} #cgsv .cgs-cv--signature .cgs-cv__job{font-size:10.2pt;color:var(--cv-muted);font-weight:500;} #cgsv .cgs-cv--signature .cgs-cv__section h2{border:0;color:var(--cv-ink);padding:0;letter-spacing:.16em;} #cgsv .cgs-cv--signature .cgs-cv__section h2:before{content:"";display:inline-block;width:14px;height:2px;background:var(--cv-accent);vertical-align:middle;margin-right:8px;} #cgsv .cgs-cv--modern{--cv-accent:#6B48E0;--cv-rule:#E5E1EE;padding-top:0;} #cgsv .cgs-cv--modern .cgs-cv__header{background:linear-gradient(110deg,#F2ECFF 0%,#FCFAF8 62%,#FFF5D7 100%);margin:0 -38px 15px;padding:26px 38px 22px;border:0;border-left:5px solid var(--cv-accent);} #cgsv .cgs-cv--modern .cgs-cv__ident h1{font-size:21.5pt;font-weight:700;} #cgsv .cgs-cv--modern .cgs-cv__job{color:var(--cv-accent);font-weight:650;} #cgsv .cgs-cv--modern .cgs-cv__skill{background:#F5F2FB;border:1px solid #E9E3F5;border-radius:999px;padding:3px 7px;} #cgsv .cgs-cv--modern .cgs-cv__skill:after{content:"";margin:0;} #cgsv .cgs-cv--executive{--cv-accent:#171126;--cv-rule:#D9D4E0;} #cgsv .cgs-cv--executive .cgs-cv__header{background:#171126;margin:-34px -38px 15px;padding:28px 38px 22px;border:0;} #cgsv .cgs-cv--executive .cgs-cv__ident h1{color:#fff;font-size:22pt;font-weight:650;} #cgsv .cgs-cv--executive .cgs-cv__job{color:#E7DFFF;font-weight:500;letter-spacing:.035em;} #cgsv .cgs-cv--executive .cgs-cv__contact{color:#EAE7EF;} #cgsv .cgs-cv--executive .cgs-cv__contact span::before{color:#756F80;} #cgsv .cgs-cv--executive .cgs-cv__section h2{color:#171126;border-bottom:2px solid #171126;} #cgsv .cgs-cv--executive .cgs-cv__section:nth-of-type(2){background:#F7F5F9;padding:10px 12px;border-left:3px solid #6B48E0;} #cgsv .cgs-cv--editorial{--cv-accent:#6B48E0;--cv-rule:#DCD7E5;border-left:8px solid #F1E9FF;} #cgsv .cgs-cv--editorial .cgs-cv__header{border-bottom:3px solid #171126;align-items:flex-end;padding-top:5px;} #cgsv .cgs-cv--editorial .cgs-cv__ident h1{font-size:28pt;font-weight:800;letter-spacing:-.045em;line-height:.92;max-width:78%;} #cgsv .cgs-cv--editorial .cgs-cv__job{font-size:8.7pt;text-transform:uppercase;letter-spacing:.19em;font-weight:650;color:#6B48E0;} #cgsv .cgs-cv--editorial .cgs-cv__section h2{color:#171126;border-bottom:1.5px solid #171126;font-size:8.2pt;} /* Studio visible au-dessus du CV après génération : changement instantané */ #cgsv .cgsv__designStudio{margin:0 0 18px;padding:18px;border:1px solid #EAE5F2;border-radius:20px;background:linear-gradient(135deg,#F8F5FF,#fff 58%,#FFFBEF);} #cgsv .cgsv__designStudioHead{display:flex;justify-content:space-between;gap:20px;align-items:flex-end;margin-bottom:14px;} #cgsv .cgsv__designStudioHead div{display:flex;flex-direction:column;gap:3px;} #cgsv .cgsv__designStudioHead span{font-size:10px;text-transform:uppercase;letter-spacing:.12em;color:#6B48E0;font-weight:700;} #cgsv .cgsv__designStudioHead strong{font-size:16px;color:#171126;} #cgsv .cgsv__designStudioHead small{font-size:11px;color:#7A7386;max-width:280px;text-align:right;line-height:1.4;} #cgsv .cgsv__designStudioGrid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;} #cgsv .cgsv__designStudioGrid button{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:2px;padding:9px;border:1px solid #E8E3EF;border-radius:14px;background:#fff;color:#171126;cursor:pointer;text-align:left;transition:.16s ease;} #cgsv .cgsv__designStudioGrid button:hover{border-color:#C9BDF5;transform:translateY(-1px);} #cgsv .cgsv__designStudioGrid button.is-active{border-color:#6B48E0;box-shadow:0 0 0 2px rgba(107,72,224,.08);} #cgsv .cgsv__designStudioGrid button em{position:absolute;top:7px;right:7px;font-size:7px;font-style:normal;color:#6B48E0;background:#F2ECFF;border-radius:999px;padding:2px 5px;} #cgsv .cgsv__designStudioGrid button strong{font-size:11px;margin-top:3px;} #cgsv .cgsv__designStudioGrid button span{font-size:9px;color:#7A7386;} #cgsv .cgsv__miniCv{display:block;width:100%;height:70px;border:1px solid #EEEAF4;border-radius:6px;background:#fff;position:relative;overflow:hidden;} #cgsv .cgsv__miniCv:before,#cgsv .cgsv__miniCv:after{content:"";position:absolute;left:9px;background:#DCD6E6;border-radius:2px;} #cgsv .cgsv__miniCv:before{top:16px;width:48%;height:5px;} #cgsv .cgsv__miniCv:after{top:26px;width:72%;height:3px;box-shadow:0 8px 0 #E7E2EC,0 16px 0 #E7E2EC,0 24px 0 #E7E2EC;} #cgsv .cgsv__miniCv--signature{border-top:3px solid #EEE7FF;} #cgsv .cgsv__miniCv--modern{background:linear-gradient(110deg,#F2ECFF 0 35%,#fff 35%);border-left:4px solid #6B48E0;} #cgsv .cgsv__miniCv--executive{border-top:18px solid #171126;} #cgsv .cgsv__miniCv--editorial{border-left:6px solid #EFE4FF;} #cgsv .cgsv__miniCv--original{background:#FAFAFA;} #cgsv .cgsv__designStudioNote{margin:10px 0 0;font-size:10.5px;color:#7A7386;} @media(max-width:900px){ #cgsv .cgsv__tplGrid--premium{grid-template-columns:repeat(2,minmax(0,1fr));} #cgsv .cgsv__designStudioGrid{grid-template-columns:repeat(3,minmax(0,1fr));} } @media(max-width:560px){ #cgsv .cgsv__designStudioHead{align-items:flex-start;flex-direction:column;gap:4px;} #cgsv .cgsv__designStudioHead small{text-align:left;} #cgsv .cgsv__designStudioGrid{grid-template-columns:repeat(2,minmax(0,1fr));} } #cgsv .cgsv__designStudio.is-four .cgsv__designStudioGrid{grid-template-columns:repeat(4,minmax(0,1fr));} @media(max-width:900px){#cgsv .cgsv__designStudio.is-four .cgsv__designStudioGrid{grid-template-columns:repeat(2,minmax(0,1fr));}}