diff --git a/promo/README.md b/promo/README.md index 7991356..83cda32 100644 --- a/promo/README.md +++ b/promo/README.md @@ -17,6 +17,49 @@ dépendance réseau), sœurs de thème et liées entre elles par la barre de nav - **Thème** : identité *Alliance Boréale* (ciel nocturne + aurore + constellation), reprise des thèmes Keycloak/Forgejo du dépôt. + +## Conventions communes — à respecter pour toute modification + +Les quatre pages forment un ensemble navigable : ce qui suit doit rester **identique** +partout, sous peine de dérive (c'est déjà arrivé une fois, et il a fallu une passe +complète pour la résorber). + +| Élément | Règle | +|---|---| +| **Adresse au lecteur** | **Vouvoiement**, sans exception. Ce sont des pages commerciales. | +| **Barre de navigation** | `Capacités · Offres · Tarifs · Valeur` + bouton « Nous parler ». Même ordre, mêmes libellés, page courante marquée `aria-current="page"`. | +| **Marque** | `Set-OPS · Chezlepro` dans la barre ; `Chezlepro inc. · Saint-Bruno-de-Montarville, Québec` au pied. | +| **``** | `Set-OPS — <Section> · Chezlepro` | +| **Vocabulaire d'état** | Trois valeurs seulement : **Éprouvé** (`.st.ok`), **En chantier** (`.st.wip`), **Feuille de route** (`.st.road`). Jamais d'autre mot, jamais d'autre classe. | +| **Fin de page** | Section `#reserves` (bloc `.honest`) puis bloc `.close`. Les quatre pages assument leurs limites. | +| **CSS partagé** | Un sélecteur commun (`section`, `.card`, `.sec-head`, `ul.does`, `.st`, `footer`…) doit avoir **la même déclaration** dans les quatre fichiers. | + +Vérifier avant de committer : + +```bash +python3 - <<'EOF' +import re,pathlib +from collections import defaultdict +r=defaultdict(dict) +for f in ['index.html','offres.html','tarifs.html','valeur.html']: + css=re.sub(r'/\*.*?\*/','',re.search(r'<style>(.*?)</style>', + pathlib.Path('promo',f).read_text(encoding='utf-8'),re.S).group(1),flags=re.S) + d,buf,sel=0,'',None + for c in css: + if c=='{': + d+=1 + if d==1: sel,buf=buf.strip(),'' + else: buf+=c + elif c=='}': + d-=1 + if d==0: + if not sel.startswith('@'): r[sel][f]=re.sub(r'\s+','',buf) + buf='' + else: buf+=c + else: buf+=c +print("conflits CSS :",sum(1 for s,d in r.items() if len(set(d.values()))>1)) +EOF +``` - **Honnêteté** : les capacités **éprouvées** (déployées sur VM réelles) sont distinguées de ce qui est **en chantier** et de la **feuille de route**, conformément au principe « ne jamais affirmer plus que ce qui est prouvé » (cf. `docs/audit/`). Les trois pages diff --git a/promo/index.html b/promo/index.html index 0cb0c59..5d19e03 100644 --- a/promo/index.html +++ b/promo/index.html @@ -3,8 +3,8 @@ <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> -<title>Set-OPS — Ton écosystème numérique souverain, prouvé - +Set-OPS — Capacités du moteur · Chezlepro + @@ -14,7 +14,7 @@ --ink:#e9ecff; --dim:#99a1c9; --dim-2:#727aa6; --line:rgba(255,255,255,.10); --line-2:rgba(255,255,255,.06); --panel:rgba(255,255,255,.045); --panel-2:rgba(255,255,255,.03); - --teal:#4fe3c1; --cyan:#56c2ff; --violet:#a98bff; + --teal:#4fe3c1; --cyan:#56c2ff; --violet:#a98bff; --amber:#ffc46b; --aurora:linear-gradient(100deg,var(--teal) 0%,var(--cyan) 46%,var(--violet) 100%); --sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen,Ubuntu,Cantarell,"Noto Sans","Helvetica Neue",Arial,sans-serif; --mono:ui-monospace,"SF Mono","JetBrains Mono",Menlo,Consolas,"Liberation Mono",monospace; @@ -44,9 +44,7 @@ animation:drift 24s ease-in-out infinite alternate; } @keyframes drift{from{transform:translate(-3%,0) scale(1)}to{transform:translate(3%,2%) scale(1.08)}} - .wrap{max-width:var(--wrap);margin-inline:auto;padding-inline:24px} - /* ---- nav ---- */ header.nav{position:sticky;top:0;z-index:20;backdrop-filter:blur(12px); background:linear-gradient(180deg,rgba(5,6,15,.72),rgba(5,6,15,.28)); @@ -55,25 +53,25 @@ .brand{display:flex;align-items:center;gap:11px;font-weight:650;letter-spacing:.2px;text-decoration:none;color:var(--ink)} .brand svg{width:30px;height:30px;flex:none} .brand b{font-weight:750} - .nav nav{margin-left:auto;display:flex;gap:26px;align-items:center} + .nav nav{margin-left:auto;display:flex;gap:24px;align-items:center} .nav nav a{color:var(--dim);text-decoration:none;font-size:.94rem;font-weight:500} .nav nav a:hover{color:var(--ink)} + .nav nav a[aria-current="page"]{color:var(--ink);font-weight:640} + .nav nav a[aria-current="page"]::after{content:"";display:block;height:2px;border-radius:2px;background:var(--aurora);margin-top:3px} .nav .cta-mini{padding:8px 16px;border-radius:999px;background:var(--aurora);color:#04121a;font-weight:700;font-size:.9rem} .nav .cta-mini:hover{color:#04121a;filter:brightness(1.08)} @media(max-width:760px){.nav nav a:not(.cta-mini){display:none}} - /* ---- typographie ---- */ .eyebrow{font-family:var(--mono);font-size:.76rem;letter-spacing:.28em;text-transform:uppercase;color:var(--cyan);font-weight:600} h1,h2,h3{text-wrap:balance;line-height:1.08;margin:0} .grad{background:var(--aurora);-webkit-background-clip:text;background-clip:text;color:transparent} p{margin:0} .lede{color:var(--dim);font-size:1.12rem;max-width:60ch} - /* ---- hero ---- */ - .hero{position:relative;padding:88px 0 76px} + .hero{position:relative;padding:82px 0 60px} .hero .eyebrow{display:block;margin-bottom:22px} - .hero h1{font-size:clamp(2.5rem,6.4vw,5rem);font-weight:800;letter-spacing:-.02em;max-width:16ch} - .hero .lede{margin-top:26px;font-size:clamp(1.05rem,1.9vw,1.28rem);max-width:64ch} + .hero h1{font-size:clamp(2.3rem,6vw,4.6rem);font-weight:800;letter-spacing:-.02em;max-width:17ch} + .hero .lede{margin-top:26px;font-size:clamp(1.05rem,1.9vw,1.26rem);max-width:64ch} .cta-row{display:flex;flex-wrap:wrap;gap:14px;margin-top:36px} .btn{display:inline-flex;align-items:center;gap:9px;padding:14px 24px;border-radius:999px;font-weight:700;text-decoration:none;font-size:1rem;border:1px solid transparent;transition:transform .15s ease,filter .15s ease,border-color .15s ease} .btn-primary{background:var(--aurora);color:#04121a} @@ -83,60 +81,56 @@ .flow{margin-top:40px;font-family:var(--mono);font-size:.92rem;color:var(--dim);display:flex;flex-wrap:wrap;gap:10px 14px;align-items:center} .flow code{color:var(--teal);background:var(--panel);border:1px solid var(--line-2);padding:4px 10px;border-radius:7px;white-space:nowrap} .flow .arw{color:var(--dim-2)} - /* ---- bandeaux de section ---- */ - section{padding:76px 0;position:relative} - .sec-head{max-width:66ch;margin-bottom:44px} - .sec-head h2{font-size:clamp(1.75rem,3.4vw,2.7rem);font-weight:750;letter-spacing:-.015em;margin-top:14px} - .sec-head p{margin-top:16px;color:var(--dim);font-size:1.08rem} + section{padding:72px 0;position:relative} + .sec-head{max-width:68ch;margin-bottom:42px} + .sec-head h2{font-size:clamp(1.75rem,3.4vw,2.6rem);font-weight:750;letter-spacing:-.015em;margin-top:14px} + .sec-head p{margin-top:16px;color:var(--dim);font-size:1.07rem} .rule{height:1px;background:linear-gradient(90deg,var(--line),transparent);border:0;margin:0} - /* ---- méthode : 4 temps ---- */ - .beats{display:grid;grid-template-columns:repeat(4,1fr);gap:18px} + .beats{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:18px} .beat{background:var(--panel-2);border:1px solid var(--line-2);border-radius:15px;padding:22px} .beat .n{font-family:var(--mono);font-size:.8rem;color:var(--cyan);letter-spacing:.1em} - .beat h3{font-size:1.08rem;font-weight:680;margin:12px 0 8px} - .beat p{color:var(--dim);font-size:.95rem} - @media(max-width:880px){.beats{grid-template-columns:repeat(2,1fr)}} - @media(max-width:520px){.beats{grid-template-columns:1fr}} - + .beat h3{font-size:1.06rem;font-weight:680;margin:12px 0 8px} + .beat p{color:var(--dim);font-size:.94rem} /* ---- piliers (capacités) ---- */ .pillars{display:grid;grid-template-columns:repeat(2,1fr);gap:20px} @media(max-width:820px){.pillars{grid-template-columns:1fr}} - .card{position:relative;background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:26px 26px 24px;overflow:hidden;transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease} - .card:hover{transform:translateY(-3px);border-color:rgba(86,194,255,.42);box-shadow:0 18px 50px -24px rgba(86,194,255,.5)} + .card{position:relative;background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:26px;overflow:hidden;transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease} + .card:hover{transform:translateY(-3px);border-color:rgba(86,194,255,.42);box-shadow:0 18px 50px -24px rgba(86,194,255,.45)} .card::before{content:"";position:absolute;inset:0 0 auto 0;height:2px;background:var(--aurora);opacity:.75} .card .kick{display:flex;align-items:center;gap:12px;margin-bottom:14px} .card .dot{width:34px;height:34px;border-radius:10px;flex:none;display:grid;place-items:center;background:rgba(86,194,255,.12);border:1px solid rgba(86,194,255,.28)} .card .dot svg{width:19px;height:19px} - .card h3{font-size:1.24rem;font-weight:720} + .card h3{font-size:1.2rem;font-weight:720;margin-bottom:10px} .card .sub{color:var(--dim);font-size:.96rem;margin-top:8px} .chips{display:flex;flex-wrap:wrap;gap:7px;margin:16px 0 4px} .chip{font-family:var(--mono);font-size:.76rem;color:var(--ink);background:rgba(255,255,255,.05);border:1px solid var(--line);padding:4px 9px;border-radius:7px} - ul.does{list-style:none;padding:0;margin:14px 0 0;display:grid;gap:9px} - ul.does li{position:relative;padding-left:22px;color:var(--dim);font-size:.95rem} + ul.does{list-style:none;padding:0;margin:16px 0 0;display:grid;gap:9px} + ul.does li{position:relative;padding-left:22px;color:var(--dim);font-size:.94rem} ul.does li::before{content:"";position:absolute;left:2px;top:.62em;width:7px;height:7px;border-radius:2px;background:var(--aurora);transform:rotate(45deg)} ul.does b{color:var(--ink);font-weight:640} - .tag{display:inline-flex;align-items:center;gap:6px;font-family:var(--mono);font-size:.7rem;letter-spacing:.08em;text-transform:uppercase;padding:3px 9px;border-radius:999px;margin-left:auto} - .tag.proven{color:#062b22;background:linear-gradient(90deg,var(--teal),#7ff0d6)} - .tag.soon{color:var(--violet);background:transparent;border:1px solid rgba(169,139,255,.5)} - .card .kick .tag{margin-left:auto} - + .card .kick .st{margin-left:auto} /* ---- console opérateur ---- */ .console{background:linear-gradient(180deg,rgba(10,13,36,.9),rgba(5,6,15,.9));border:1px solid var(--line);border-radius:16px;overflow:hidden;box-shadow:0 24px 70px -30px rgba(0,0,0,.8)} .console .bar{display:flex;align-items:center;gap:8px;padding:12px 16px;border-bottom:1px solid var(--line-2);background:rgba(255,255,255,.02)} .console .bar i{width:11px;height:11px;border-radius:50%;display:block} - .console .bar i:nth-child(1){background:#ff5f57}.console .bar i:nth-child(2){background:#febc2e}.console .bar i:nth-child(3){background:#28c840} + .console .bar i:nth-child(1){background:#ff5f57} + .console .bar i:nth-child(2){background:#febc2e} + .console .bar i:nth-child(3){background:#28c840} .console .bar span{margin-left:8px;font-family:var(--mono);font-size:.82rem;color:var(--dim)} .console pre{margin:0;padding:22px 20px;font-family:var(--mono);font-size:.86rem;line-height:1.85;overflow-x:auto} - .console .c{color:var(--dim-2)} /* commentaire */ - .console .p{color:var(--teal)} /* prompt/cmd */ - .console .o{color:var(--ink)} /* sortie */ - .console .g{color:var(--cyan)} /* mise en avant */ + .console .c{color:var(--dim-2)} + /* commentaire */ + .console .p{color:var(--teal)} + /* prompt/cmd */ + .console .o{color:var(--ink)} + /* sortie */ + .console .g{color:var(--cyan)} + /* mise en avant */ .split{display:grid;grid-template-columns:1.05fr .95fr;gap:40px;align-items:center} @media(max-width:860px){.split{grid-template-columns:1fr;gap:28px}} - /* ---- cycle de vie ---- */ .life{display:grid;grid-template-columns:repeat(4,1fr);gap:0} .life .step{padding:24px 22px;border:1px solid var(--line-2);border-right:0;background:var(--panel-2);position:relative} @@ -146,7 +140,6 @@ .life .step h3{font-size:1.02rem;margin:10px 0 7px;font-weight:680} .life .step p{color:var(--dim);font-size:.9rem} @media(max-width:820px){.life{grid-template-columns:1fr}.life .step{border-right:1px solid var(--line-2);border-bottom:0}.life .step:first-child{border-radius:15px 15px 0 0}.life .step:last-child{border-radius:0 0 15px 15px}} - /* ---- preuve : traits ---- */ .proof{display:grid;grid-template-columns:repeat(3,1fr);gap:20px} @media(max-width:820px){.proof{grid-template-columns:1fr}} @@ -155,34 +148,42 @@ .pf h3 svg{width:20px;height:20px} .pf p{color:var(--dim);font-size:.95rem} .pf code{font-family:var(--mono);color:var(--teal);font-size:.85em} - - .stats{display:flex;flex-wrap:wrap;gap:14px;margin-top:34px} - .stat{flex:1 1 150px;background:var(--panel-2);border:1px solid var(--line-2);border-radius:14px;padding:18px 20px} + .stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:16px;margin-bottom:34px} + .stat{background:var(--panel-2);border:1px solid var(--line-2);border-radius:15px;padding:22px} .stat b{display:block;font-size:1.9rem;font-weight:800;font-variant-numeric:tabular-nums} .stat b .grad{font-weight:800} .stat span{color:var(--dim);font-size:.86rem} - /* ---- feuille de route ---- */ .roadmap{display:flex;flex-wrap:wrap;gap:14px} .rm{flex:1 1 260px;border:1px dashed rgba(169,139,255,.4);border-radius:14px;padding:20px 22px;background:rgba(169,139,255,.05)} .rm .k{font-family:var(--mono);font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--violet)} .rm h3{font-size:1.05rem;margin:9px 0 6px;font-weight:680} .rm p{color:var(--dim);font-size:.9rem} - /* ---- clôture ---- */ + .st{display:inline-flex;align-items:center;gap:6px;font-family:var(--mono);font-size:.7rem;letter-spacing:.07em;text-transform:uppercase;padding:4px 10px;border-radius:999px;white-space:nowrap;margin-left:auto;flex:none} + .st.ok{color:#7ff0d0;background:rgba(79,227,193,.12);border:1px solid rgba(79,227,193,.32)} + .st.wip{color:#ffd79a;background:rgba(255,196,107,.1);border:1px solid rgba(255,196,107,.3)} + .st.road{color:#c3b2ff;background:rgba(169,139,255,.1);border:1px solid rgba(169,139,255,.3)} + .honest{background:var(--panel-2);border:1px solid var(--line);border-left:3px solid var(--amber);border-radius:14px;padding:24px 26px} + .honest h3{font-size:1.04rem;font-weight:700;margin-bottom:12px;color:var(--amber)} + .honest ul{margin:0;padding-left:20px;display:grid;gap:10px} + .honest li{color:var(--dim);font-size:.95rem} + .honest b{color:var(--ink);font-weight:640} + .close{text-align:center;padding:88px 0 96px} + .close h2{font-size:clamp(1.9rem,4.6vw,3.1rem);font-weight:800;letter-spacing:-.02em;max-width:20ch;margin-inline:auto} + .close p{margin:20px auto 0;color:var(--dim);max-width:56ch;font-size:1.06rem} + .close .cta-row{justify-content:center} .closing{text-align:center;padding:96px 0 40px} .closing h2{font-size:clamp(2rem,4.4vw,3.2rem);font-weight:800;letter-spacing:-.02em;max-width:18ch;margin-inline:auto} .closing p{margin:20px auto 0;color:var(--dim);max-width:52ch;font-size:1.08rem} - - footer{border-top:1px solid var(--line-2);padding:38px 0;color:var(--dim)} - footer .wrap{display:flex;flex-wrap:wrap;gap:16px 40px;align-items:center} + footer{border-top:1px solid var(--line-2);padding:40px 0;color:var(--dim-2);font-size:.9rem} + footer .wrap{display:flex;flex-wrap:wrap;gap:16px 28px;align-items:center;justify-content:space-between} footer .brand{opacity:.95} footer .meta{margin-left:auto;display:flex;flex-wrap:wrap;gap:6px 22px;font-size:.86rem} footer .meta span b{color:var(--ink);font-weight:600} - footer a{color:var(--cyan);text-decoration:none} - + footer a{color:var(--dim);text-decoration:none} /* ---- révélations au scroll ---- */ - .reveal{opacity:0;transform:translateY(18px);transition:opacity .7s ease,transform .7s ease} + .reveal{opacity:0;transform:translateY(16px);transition:opacity .6s ease,transform .6s ease} .reveal.in{opacity:1;transform:none} :focus-visible{outline:2px solid var(--cyan);outline-offset:3px;border-radius:6px} @media(prefers-reduced-motion:reduce){ @@ -198,7 +199,7 @@
- + - Set‑OPS · Alliance Boréale + Set‑OPS · Chezlepro
@@ -230,11 +229,11 @@
Alliance Boréale · moteur d'écosystèmes souverains -

Ton écosystème numérique, souverain — et prouvé.

-

Set‑OPS est un moteur Ansible qui construit et exploite tout un écosystème interne — identité, confiance, DNS, données, courriel, observabilité, forge — sur ta propre grappe Proxmox. À partir d'un plan déclaratif. Sans SaaS. Sans conteneur propriétaire. Et exploitable sans aucune IA.

+

Votre écosystème numérique, souverain — et prouvé.

+

Set‑OPS est un moteur Ansible qui construit et exploite tout un écosystème interne — identité, confiance, DNS, données, courriel, observabilité, forge — sur votre propre grappe Proxmox. À partir d'un plan déclaratif. Sans SaaS. Sans conteneur propriétaire. Et exploitable sans aucune IA.

- Voir tout ce que tu peux faire → - De zéro à ton écosystème + Voir tout ce qu'il sait faire → + De zéro à votre écosystème
édite le plan→ @@ -250,11 +249,11 @@
La méthode -

Tu décris. Le moteur génère. Ansible déploie. La preuve suit.

-

Set‑OPS se pilote par un plan, pas par l'édition de l'inventaire. Les registres sont la source unique de vérité ; l'inventaire Ansible en est dérivé. Tu ne touches jamais hosts.yml à la main.

+

Vous décrivez. Le moteur génère. Ansible déploie. La preuve suit.

+

Set‑OPS se pilote par un plan, pas par l'édition de l'inventaire. Les registres sont la source unique de vérité ; l'inventaire Ansible en est dérivé. Vous ne touchez jamais hosts.yml à la main.

-
01 · décrire

Un plan déclaratif

Serveurs, applications, bases, domaines, nomenclature — des registres lisibles par la machine, ta seule source de vérité.

+
01 · décrire

Un plan déclaratif

Serveurs, applications, bases, domaines, nomenclature — des registres lisibles par la machine, votre seule source de vérité.

02 · générer

Un inventaire dérivé

VMID, IP, VLAN et passerelle sont dérivés de la fonction. make instancier montre le diff avant d'appliquer.

03 · déployer

Par groupes, en couches

Chaque groupe a son playbook homonyme. L'orchestrateur déploie socle → PKI → services → apps → agents, dans l'ordre.

04 · prouver

Une preuve rejouable

make prouver rejoue les vérifications et produit un rapport horodaté. Le dépôt n'affirme jamais plus qu'il ne prouve.

@@ -268,9 +267,9 @@
- Tout ce que tu peux faire + Tout ce qu'il sait faire

Sept piliers. Un écosystème complet, natif, chiffré, relié.

-

Tout ce qu'un hébergeur met en ligne, Set‑OPS le tient en interne — en logiciel libre, sur systemd et paquets, sans dépendance à un géant. Voici, pilier par pilier, ce que tu déploies et exploites. Le badge Éprouvé marque ce qui tourne sur des VM réelles ; Feuille de route ce qui est planifié.

+

Tout ce qu'un hébergeur met en ligne, Set‑OPS le tient en interne — en logiciel libre, sur systemd et paquets, sans dépendance à un géant. Voici, pilier par pilier, ce qu'il déploie et exploite. Le badge Éprouvé marque ce qui tourne sur des VM réelles ; Feuille de route ce qui est planifié.

@@ -280,13 +279,13 @@

Identité & accès

- Éprouvé + Éprouvé

Une identité, un mot de passe, pour tout le parc.

OpenLDAPKeycloakoauth2-proxyOIDC · RBAC
  • Un annuaire central (OpenLDAP) source unique des identités.
    • -
  • SSO web via Keycloak, qui fédère l'annuaire — « se connecter avec ton organisation ».
    • +
  • SSO web via Keycloak, qui fédère l'annuaire — « se connecter avec votre organisation ».
  • Mets n'importe quelle app derrière le SSO avec oauth2-proxy, même sans OIDC natif.
  • RBAC : des rôles de realm pilotent les niveaux d'accès (ex. Grafana Admin/Editor/Viewer).
@@ -297,9 +296,9 @@

Confiance & PKI

- Éprouvé + Éprouvé
-

Ta propre autorité de certification. Tout le trafic interne, chiffré et vérifié.

+

Votre propre autorité de certification. Tout le trafic interne, chiffré et vérifié.

step-caACMEclient_pkimTLS
  • Une AC interne (step-ca) qui émet les certificats par ACME.
    • @@ -314,7 +313,7 @@

    Nommage & réseau

    - Éprouvé + Éprouvé

    Un DNS interne cohérent, et un réseau convergé multi-tenant.

    PowerDNSUnboundVLAN dérivémake devis-reseau
    @@ -331,7 +330,7 @@

    Données

    - Éprouvé + Éprouvé

    Bases relationnelles et cache, provisionnés depuis le registre.

    PostgreSQLRedisTLS verify-fullbinding app→base
    @@ -348,9 +347,9 @@

    Courriel souverain

    - Éprouvé + Éprouvé
    -

    Recevoir et envoyer, de bout en bout, sur ton infra.

    +

    Recevoir et envoyer, de bout en bout, sur votre infrastructure.

    PostfixDovecotrspamdDKIM · SASL
    • MTA Postfix + soumission :587 authentifiée (SASL déléguée à Dovecot).
      • @@ -365,7 +364,7 @@

      Reverse-proxy & TLS

      - Éprouvé + Éprouvé

      Déclare une exposition — tout le reste se dérive.

      nginx edgeTLS step-caX-ForwardedWAF
      @@ -382,7 +381,7 @@

      Observabilité & supervision

      - Éprouvé + Éprouvé

      Voir toute la flotte : métriques, journaux, tableaux de bord, impact.

      PrometheusLokiGrafanaIcinga2 · BPM
      @@ -399,9 +398,9 @@

      Applicatif & forge

      - Éprouvé + Éprouvé
      -

      Tes services internes, adossés à l'identité commune.

      +

      Vos services internes, adossés à l'identité commune.

      ForgejoSSO OIDCbranding
      • Forge Git Forgejo : dépôts, CI, wiki — branchée au SSO, comptes auto-créés depuis l'annuaire.
        • @@ -478,7 +477,7 @@
        La console de l'opérateur

        De la grappe nue à l'écosystème vivant.

        -

        Tout passe par make et un plan. Un modèle générique socle — DNS, AC/PKI, edge TLS, courriel — est prêt à copier, renseigner, déployer. Puis tu vis dans le plan.

        +

        Tout passe par make et un plan. Un modèle générique socle — DNS, AC/PKI, edge TLS, courriel — est prêt à copier, renseigner, déployer. Puis vous vivez dans le plan.

        • Golden template Debian 13 construit une fois, cloné pour chaque VM.
        • Clone Proxmox + cloud-init pour l'identité initiale, puis conformité par groupes.
          • @@ -562,39 +561,55 @@
        Collaboration

        Nextcloud & Collabora

        Fichiers, agenda, édition en ligne — sous la même identité SSO. Build prioritaire, offre « maison-OBNL ».

        -
        Couche web

        Frontal & dorsal applicatifs

        Présentation (UI, assets) et application (API), servis derrière l'edge — pour mettre tes propres webapps en ligne.

        +
        Couche web

        Frontal & dorsal applicatifs

        Présentation (UI, assets) et application (API), servis derrière l'edge — pour mettre vos propres applications web en ligne.

        Certification

        Label Souverain · Résilient · Exemplaire

        Trois niveaux accumulatifs pour attester la qualité d'un écosystème — garde-fou social inclus.

+ +
+
+
+ Honnêteté +

Ce que nous ne prétendons pas.

+

La règle du projet est écrite dans son dépôt : ne jamais affirmer plus que ce qu'on prouve. Elle s'applique aussi à cette page.

+
+
+

Nos réserves, en clair

+
    +
  • « Éprouvé » et « feuille de route » ne se mélangent pas. Les capacités marquées éprouvées ont été déployées et vérifiées sur des machines réelles ; les autres sont annoncées comme des intentions, jamais comme des livrables.
    • +
  • Il faut quelqu'un. Set‑OPS réduit énormément le travail d'exploitation ; il ne le supprime pas. Une personne responsable reste nécessaire, à l'interne ou sous contrat.
    • +
  • Le projet repose encore sur un seul mainteneur. C'est le risque principal, et nous le nommons. La documentation, les procédures et le registre de preuves existent précisément pour que le savoir ne vive pas dans une seule tête.
    • +
  • Une épreuve est en cours. Un administrateur système indépendant doit installer l'ensemble à partir de la seule documentation, sans aide et sans IA. Le protocole est public, le résultat sera publié — y compris s'il échoue.
    • +
+
+
+
+ -
-
-

Reprends la souveraineté de ton infrastructure.

-

Un plan, ta grappe Proxmox, et tout un écosystème numérique — libre, chiffré, prouvé. Sous le ciel de l'Alliance Boréale.

-
- Explorer les capacités - Revenir en haut ↑ +
+
+

Reprenez le contrôle de votre infra numérique.

+

Un plan, votre grappe Proxmox, et tout un écosystème numérique — libre, chiffré, prouvé. Sous le ciel de l'Alliance Boréale.

+
+ Voir les offres → + Simuler le coût
- +
- Set‑OPS - -
- Alliance Boréale · Chezlepro — Daniel Allaire - Licence AGPLv3 - Tout est libre. + + + + Chezlepro inc. · Saint-Bruno-de-Montarville, Québec
+ +
Set‑OPS — moteur libre, licence AGPLv3 · chezlepro.ca
diff --git a/promo/offres.html b/promo/offres.html index a1f1832..48fcc4c 100644 --- a/promo/offres.html +++ b/promo/offres.html @@ -3,7 +3,7 @@ -Set-OPS — Les offres +Set-OPS — Les offres · Chezlepro @@ -43,9 +43,7 @@ animation:drift 24s ease-in-out infinite alternate; } @keyframes drift{from{transform:translate(-3%,0) scale(1)}to{transform:translate(3%,2%) scale(1.08)}} - .wrap{max-width:var(--wrap);margin-inline:auto;padding-inline:24px} - header.nav{position:sticky;top:0;z-index:20;backdrop-filter:blur(12px); background:linear-gradient(180deg,rgba(5,6,15,.72),rgba(5,6,15,.28)); border-bottom:1px solid var(--line-2)} @@ -53,22 +51,22 @@ .brand{display:flex;align-items:center;gap:11px;font-weight:650;letter-spacing:.2px;text-decoration:none;color:var(--ink)} .brand svg{width:30px;height:30px;flex:none} .brand b{font-weight:750} - .nav nav{margin-left:auto;display:flex;gap:26px;align-items:center} + .nav nav{margin-left:auto;display:flex;gap:24px;align-items:center} .nav nav a{color:var(--dim);text-decoration:none;font-size:.94rem;font-weight:500} .nav nav a:hover{color:var(--ink)} + .nav nav a[aria-current="page"]{color:var(--ink);font-weight:640} + .nav nav a[aria-current="page"]::after{content:"";display:block;height:2px;border-radius:2px;background:var(--aurora);margin-top:3px} .nav .cta-mini{padding:8px 16px;border-radius:999px;background:var(--aurora);color:#04121a;font-weight:700;font-size:.9rem} .nav .cta-mini:hover{color:#04121a;filter:brightness(1.08)} @media(max-width:900px){.nav nav a:not(.cta-mini){display:none}} - .eyebrow{font-family:var(--mono);font-size:.76rem;letter-spacing:.28em;text-transform:uppercase;color:var(--cyan);font-weight:600} h1,h2,h3{text-wrap:balance;line-height:1.08;margin:0} .grad{background:var(--aurora);-webkit-background-clip:text;background-clip:text;color:transparent} p{margin:0} .lede{color:var(--dim);font-size:1.12rem;max-width:60ch} - - .hero{position:relative;padding:82px 0 58px} + .hero{position:relative;padding:82px 0 60px} .hero .eyebrow{display:block;margin-bottom:22px} - .hero h1{font-size:clamp(2.3rem,6vw,4.6rem);font-weight:800;letter-spacing:-.02em;max-width:16ch} + .hero h1{font-size:clamp(2.3rem,6vw,4.6rem);font-weight:800;letter-spacing:-.02em;max-width:17ch} .hero .lede{margin-top:26px;font-size:clamp(1.05rem,1.9vw,1.26rem);max-width:64ch} .cta-row{display:flex;flex-wrap:wrap;gap:14px;margin-top:36px} .btn{display:inline-flex;align-items:center;gap:9px;padding:14px 24px;border-radius:999px;font-weight:700;text-decoration:none;font-size:1rem;border:1px solid transparent;transition:transform .15s ease,filter .15s ease,border-color .15s ease} @@ -76,21 +74,17 @@ .btn-primary:hover{transform:translateY(-2px);filter:brightness(1.08)} .btn-ghost{color:var(--ink);border-color:var(--line);background:var(--panel)} .btn-ghost:hover{border-color:var(--cyan);transform:translateY(-2px)} - section{padding:72px 0;position:relative} .sec-head{max-width:68ch;margin-bottom:42px} .sec-head h2{font-size:clamp(1.75rem,3.4vw,2.6rem);font-weight:750;letter-spacing:-.015em;margin-top:14px} .sec-head p{margin-top:16px;color:var(--dim);font-size:1.07rem} .rule{height:1px;background:linear-gradient(90deg,var(--line),transparent);border:0;margin:0} - /* ---- principe modulaire ---- */ - .beats{display:grid;grid-template-columns:repeat(3,1fr);gap:18px} + .beats{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:18px} .beat{background:var(--panel-2);border:1px solid var(--line-2);border-radius:15px;padding:22px} .beat .n{font-family:var(--mono);font-size:.8rem;color:var(--cyan);letter-spacing:.1em} .beat h3{font-size:1.06rem;font-weight:680;margin:12px 0 8px} .beat p{color:var(--dim);font-size:.94rem} - @media(max-width:820px){.beats{grid-template-columns:1fr}} - /* ---- offres ---- */ .offres{display:grid;grid-template-columns:repeat(2,1fr);gap:20px} @media(max-width:880px){.offres{grid-template-columns:1fr}} @@ -100,32 +94,29 @@ .offre.phare{border-color:rgba(79,227,193,.42);background:linear-gradient(150deg,rgba(79,227,193,.07),rgba(169,139,255,.05)),var(--panel)} .offre.phare::before{opacity:1;height:3px} .offre .top{display:flex;align-items:flex-start;gap:12px;margin-bottom:6px} - .offre h3{font-size:1.32rem;font-weight:740} + .offre h3{font-size:1.26rem;font-weight:740} .offre .who{color:var(--cyan);font-size:.87rem;font-weight:600;margin-top:4px} - .offre .sub{color:var(--dim);font-size:.96rem;margin-top:12px} + .offre .sub{color:var(--dim);font-size:.95rem;margin-top:13px} .offre .meta{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0 2px} .pill{font-family:var(--mono);font-size:.74rem;color:var(--ink);background:rgba(255,255,255,.05);border:1px solid var(--line);padding:4px 10px;border-radius:7px;white-space:nowrap} ul.does{list-style:none;padding:0;margin:16px 0 0;display:grid;gap:9px} ul.does li{position:relative;padding-left:22px;color:var(--dim);font-size:.94rem} ul.does li::before{content:"";position:absolute;left:2px;top:.62em;width:7px;height:7px;border-radius:2px;background:var(--aurora);transform:rotate(45deg)} ul.does b{color:var(--ink);font-weight:640} - .offre .foot{margin-top:auto;padding-top:18px;color:var(--dim-2);font-size:.87rem;border-top:1px solid var(--line-2);margin-top:20px} + .offre .foot{margin-top:auto;padding-top:18px;color:var(--dim-2);font-size:.86rem;border-top:1px solid var(--line-2)} .offre .foot b{color:var(--dim)} - .st{display:inline-flex;align-items:center;gap:6px;font-family:var(--mono);font-size:.7rem;letter-spacing:.07em;text-transform:uppercase;padding:4px 10px;border-radius:999px;white-space:nowrap;margin-left:auto;flex:none} .st.ok{color:#7ff0d0;background:rgba(79,227,193,.12);border:1px solid rgba(79,227,193,.32)} .st.wip{color:#ffd79a;background:rgba(255,196,107,.1);border:1px solid rgba(255,196,107,.3)} .st.road{color:#c3b2ff;background:rgba(169,139,255,.1);border:1px solid rgba(169,139,255,.3)} - /* ---- services ---- */ .duo{display:grid;grid-template-columns:repeat(2,1fr);gap:20px} @media(max-width:820px){.duo{grid-template-columns:1fr}} - .card{position:relative;background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:26px;overflow:hidden;transition:transform .2s ease,border-color .2s ease} - .card:hover{transform:translateY(-3px);border-color:rgba(86,194,255,.4)} + .card{position:relative;background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:26px;overflow:hidden;transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease} + .card:hover{transform:translateY(-3px);border-color:rgba(86,194,255,.42);box-shadow:0 18px 50px -24px rgba(86,194,255,.45)} .card::before{content:"";position:absolute;inset:0 0 auto 0;height:2px;background:var(--aurora);opacity:.75} - .card h3{font-size:1.16rem;font-weight:720;margin-bottom:10px} + .card h3{font-size:1.2rem;font-weight:720;margin-bottom:10px} .card p{color:var(--dim);font-size:.95rem} - /* ---- label ---- */ .label-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px} @media(max-width:820px){.label-grid{grid-template-columns:1fr}} @@ -133,10 +124,9 @@ .lv .rank{font-family:var(--mono);font-size:.74rem;letter-spacing:.16em;text-transform:uppercase;color:var(--dim-2)} .lv h3{font-size:1.22rem;font-weight:740;margin:10px 0 10px;background:var(--aurora);-webkit-background-clip:text;background-clip:text;color:transparent} .lv p{color:var(--dim);font-size:.94rem} - /* ---- tarification ---- */ .tbl-scroll{overflow-x:auto;border:1px solid var(--line);border-radius:16px;background:var(--panel-2)} - table{border-collapse:collapse;width:100%;min-width:620px;font-size:.94rem} + table{border-collapse:collapse;width:100%;min-width:640px;font-size:.94rem} thead th{text-align:left;padding:15px 18px;font-family:var(--mono);font-size:.74rem;letter-spacing:.13em;text-transform:uppercase;color:var(--dim-2);border-bottom:1px solid var(--line);font-weight:600;white-space:nowrap} tbody td{padding:14px 18px;border-bottom:1px solid var(--line-2);vertical-align:top;color:var(--dim)} tbody tr:last-child td{border-bottom:0} @@ -144,23 +134,19 @@ tbody td:first-child{color:var(--ink);font-weight:640;white-space:nowrap} .note{font-size:.87rem;color:var(--dim-2);margin-top:18px;max-width:76ch} .note b{color:var(--dim)} - .honest{background:var(--panel-2);border:1px solid var(--line);border-left:3px solid var(--amber);border-radius:14px;padding:24px 26px} .honest h3{font-size:1.04rem;font-weight:700;margin-bottom:12px;color:var(--amber)} .honest ul{margin:0;padding-left:20px;display:grid;gap:10px} - .honest li{color:var(--dim);font-size:.96rem} + .honest li{color:var(--dim);font-size:.95rem} .honest b{color:var(--ink);font-weight:640} - .close{text-align:center;padding:88px 0 96px} .close h2{font-size:clamp(1.9rem,4.6vw,3.1rem);font-weight:800;letter-spacing:-.02em;max-width:20ch;margin-inline:auto} .close p{margin:20px auto 0;color:var(--dim);max-width:56ch;font-size:1.06rem} .close .cta-row{justify-content:center} - footer{border-top:1px solid var(--line-2);padding:40px 0;color:var(--dim-2);font-size:.9rem} - footer .wrap{display:flex;flex-wrap:wrap;gap:16px;align-items:center;justify-content:space-between} + footer .wrap{display:flex;flex-wrap:wrap;gap:16px 28px;align-items:center;justify-content:space-between} footer a{color:var(--dim);text-decoration:none} footer a:hover{color:var(--cyan)} - .reveal{opacity:0;transform:translateY(16px);transition:opacity .6s ease,transform .6s ease} .reveal.in{opacity:1;transform:none} @media(prefers-reduced-motion:reduce){ @@ -175,7 +161,7 @@
- + - Set‑OPS · Alliance Boréale + Set‑OPS · Chezlepro
@@ -721,13 +706,13 @@
- Set‑OPS · Alliance Boréale — tout est libre + + + + Chezlepro inc. · Saint-Bruno-de-Montarville, Québec
- + +
Set‑OPS — moteur libre, licence AGPLv3 · chezlepro.ca
diff --git a/promo/tarifs.html b/promo/tarifs.html index e103e37..99f52ff 100644 --- a/promo/tarifs.html +++ b/promo/tarifs.html @@ -3,7 +3,7 @@ -Chezlepro — Tarifs des offres souveraines +Set-OPS — Les tarifs · Chezlepro @@ -43,9 +43,7 @@ animation:drift 24s ease-in-out infinite alternate; } @keyframes drift{from{transform:translate(-3%,0) scale(1)}to{transform:translate(3%,2%) scale(1.08)}} - .wrap{max-width:var(--wrap);margin-inline:auto;padding-inline:24px} - header.nav{position:sticky;top:0;z-index:20;backdrop-filter:blur(12px); background:linear-gradient(180deg,rgba(5,6,15,.72),rgba(5,6,15,.28)); border-bottom:1px solid var(--line-2)} @@ -56,41 +54,37 @@ .nav nav{margin-left:auto;display:flex;gap:24px;align-items:center} .nav nav a{color:var(--dim);text-decoration:none;font-size:.94rem;font-weight:500} .nav nav a:hover{color:var(--ink)} + .nav nav a[aria-current="page"]{color:var(--ink);font-weight:640} + .nav nav a[aria-current="page"]::after{content:"";display:block;height:2px;border-radius:2px;background:var(--aurora);margin-top:3px} .nav .cta-mini{padding:8px 16px;border-radius:999px;background:var(--aurora);color:#04121a;font-weight:700;font-size:.9rem} .nav .cta-mini:hover{color:#04121a;filter:brightness(1.08)} @media(max-width:960px){.nav nav a:not(.cta-mini){display:none}} - .eyebrow{font-family:var(--mono);font-size:.76rem;letter-spacing:.28em;text-transform:uppercase;color:var(--cyan);font-weight:600} h1,h2,h3{text-wrap:balance;line-height:1.08;margin:0} .grad{background:var(--aurora);-webkit-background-clip:text;background-clip:text;color:transparent} p{margin:0} .lede{color:var(--dim);font-size:1.12rem;max-width:60ch} - - .hero{position:relative;padding:82px 0 56px} + .hero{position:relative;padding:82px 0 60px} .hero .eyebrow{display:block;margin-bottom:22px} - .hero h1{font-size:clamp(2.2rem,5.6vw,4.3rem);font-weight:800;letter-spacing:-.02em;max-width:17ch} - .hero .lede{margin-top:26px;font-size:clamp(1.05rem,1.9vw,1.24rem);max-width:64ch} + .hero h1{font-size:clamp(2.3rem,6vw,4.6rem);font-weight:800;letter-spacing:-.02em;max-width:17ch} + .hero .lede{margin-top:26px;font-size:clamp(1.05rem,1.9vw,1.26rem);max-width:64ch} .cta-row{display:flex;flex-wrap:wrap;gap:14px;margin-top:36px} .btn{display:inline-flex;align-items:center;gap:9px;padding:14px 24px;border-radius:999px;font-weight:700;text-decoration:none;font-size:1rem;border:1px solid transparent;transition:transform .15s ease,filter .15s ease,border-color .15s ease} .btn-primary{background:var(--aurora);color:#04121a} .btn-primary:hover{transform:translateY(-2px);filter:brightness(1.08)} .btn-ghost{color:var(--ink);border-color:var(--line);background:var(--panel)} .btn-ghost:hover{border-color:var(--cyan);transform:translateY(-2px)} - - section{padding:70px 0;position:relative} - .sec-head{max-width:68ch;margin-bottom:40px} - .sec-head h2{font-size:clamp(1.7rem,3.3vw,2.5rem);font-weight:750;letter-spacing:-.015em;margin-top:14px} - .sec-head p{margin-top:16px;color:var(--dim);font-size:1.06rem} + section{padding:72px 0;position:relative} + .sec-head{max-width:68ch;margin-bottom:42px} + .sec-head h2{font-size:clamp(1.75rem,3.4vw,2.6rem);font-weight:750;letter-spacing:-.015em;margin-top:14px} + .sec-head p{margin-top:16px;color:var(--dim);font-size:1.07rem} .rule{height:1px;background:linear-gradient(90deg,var(--line),transparent);border:0;margin:0} - /* ---- 3 postes ---- */ - .beats{display:grid;grid-template-columns:repeat(3,1fr);gap:18px} + .beats{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:18px} .beat{background:var(--panel-2);border:1px solid var(--line-2);border-radius:15px;padding:22px} .beat .n{font-family:var(--mono);font-size:.8rem;color:var(--cyan);letter-spacing:.1em} - .beat h3{font-size:1.05rem;font-weight:680;margin:12px 0 8px} - .beat p{color:var(--dim);font-size:.93rem} - @media(max-width:820px){.beats{grid-template-columns:1fr}} - + .beat h3{font-size:1.06rem;font-weight:680;margin:12px 0 8px} + .beat p{color:var(--dim);font-size:.94rem} /* ---- offres tarifées ---- */ .grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px} @media(max-width:900px){.grid{grid-template-columns:1fr}} @@ -99,21 +93,20 @@ .offre::before{content:"";position:absolute;inset:0 0 auto 0;height:2px;background:var(--aurora);opacity:.75} .offre.phare{border-color:rgba(79,227,193,.42);background:linear-gradient(150deg,rgba(79,227,193,.07),rgba(169,139,255,.05)),var(--panel)} .offre.phare::before{opacity:1;height:3px} - .offre h3{font-size:1.24rem;font-weight:740} + .offre h3{font-size:1.26rem;font-weight:740} .offre .say{color:var(--cyan);font-size:.9rem;font-weight:600;margin-top:6px;font-style:italic} - .offre .sub{color:var(--dim);font-size:.95rem;margin-top:14px} + .offre .sub{color:var(--dim);font-size:.95rem;margin-top:13px} .price{display:flex;align-items:baseline;gap:9px;flex-wrap:wrap;margin:20px 0 4px;padding-top:18px;border-top:1px solid var(--line-2)} .price .from{font-family:var(--mono);font-size:.74rem;letter-spacing:.1em;text-transform:uppercase;color:var(--dim-2)} .price .amt{font-size:1.95rem;font-weight:800;letter-spacing:-.02em;background:var(--aurora);-webkit-background-clip:text;background-clip:text;color:transparent;font-variant-numeric:tabular-nums} .price .unit{color:var(--dim);font-size:.92rem} .price .dur{width:100%;color:var(--dim-2);font-size:.85rem;margin-top:2px} - ul.does{list-style:none;padding:0;margin:16px 0 0;display:grid;gap:8px} - ul.does li{position:relative;padding-left:22px;color:var(--dim);font-size:.93rem} + ul.does{list-style:none;padding:0;margin:16px 0 0;display:grid;gap:9px} + ul.does li{position:relative;padding-left:22px;color:var(--dim);font-size:.94rem} ul.does li::before{content:"";position:absolute;left:2px;top:.62em;width:7px;height:7px;border-radius:2px;background:var(--aurora);transform:rotate(45deg)} ul.does b{color:var(--ink);font-weight:640} - .offre .foot{margin-top:auto;padding-top:18px;margin-top:20px;color:var(--dim-2);font-size:.86rem;border-top:1px solid var(--line-2)} + .offre .foot{margin-top:auto;padding-top:18px;color:var(--dim-2);font-size:.86rem;border-top:1px solid var(--line-2)} .offre .foot b{color:var(--dim)} - /* ---- paliers exploitation ---- */ .tiers{display:grid;grid-template-columns:repeat(3,1fr);gap:18px} @media(max-width:900px){.tiers{grid-template-columns:1fr}} @@ -125,7 +118,6 @@ .tier ul{list-style:none;padding:0;margin:0;display:grid;gap:8px} .tier li{position:relative;padding-left:20px;color:var(--dim);font-size:.9rem} .tier li::before{content:"";position:absolute;left:2px;top:.6em;width:6px;height:6px;border-radius:2px;background:var(--aurora);transform:rotate(45deg)} - /* ---- tableaux ---- */ .tbl-scroll{overflow-x:auto;border:1px solid var(--line);border-radius:16px;background:var(--panel-2)} table{border-collapse:collapse;width:100%;min-width:640px;font-size:.94rem} @@ -136,27 +128,22 @@ tbody td:first-child{color:var(--ink);font-weight:640;white-space:nowrap} td.num{font-family:var(--mono);color:var(--ink);font-variant-numeric:tabular-nums;white-space:nowrap} td.free{font-family:var(--mono);color:var(--teal);font-weight:700;white-space:nowrap} - - .note{font-size:.87rem;color:var(--dim-2);margin-top:18px;max-width:78ch} + .note{font-size:.87rem;color:var(--dim-2);margin-top:18px;max-width:76ch} .note b{color:var(--dim)} .note a{color:var(--cyan)} - .honest{background:var(--panel-2);border:1px solid var(--line);border-left:3px solid var(--amber);border-radius:14px;padding:24px 26px} .honest h3{font-size:1.04rem;font-weight:700;margin-bottom:12px;color:var(--amber)} .honest ul{margin:0;padding-left:20px;display:grid;gap:10px} .honest li{color:var(--dim);font-size:.95rem} .honest b{color:var(--ink);font-weight:640} - - .close{text-align:center;padding:84px 0 92px} - .close h2{font-size:clamp(1.85rem,4.4vw,3rem);font-weight:800;letter-spacing:-.02em;max-width:20ch;margin-inline:auto} - .close p{margin:20px auto 0;color:var(--dim);max-width:56ch;font-size:1.05rem} + .close{text-align:center;padding:88px 0 96px} + .close h2{font-size:clamp(1.9rem,4.6vw,3.1rem);font-weight:800;letter-spacing:-.02em;max-width:20ch;margin-inline:auto} + .close p{margin:20px auto 0;color:var(--dim);max-width:56ch;font-size:1.06rem} .close .cta-row{justify-content:center} - - footer{border-top:1px solid var(--line-2);padding:40px 0;color:var(--dim-2);font-size:.89rem} - footer .wrap{display:flex;flex-wrap:wrap;gap:16px;align-items:center;justify-content:space-between} + footer{border-top:1px solid var(--line-2);padding:40px 0;color:var(--dim-2);font-size:.9rem} + footer .wrap{display:flex;flex-wrap:wrap;gap:16px 28px;align-items:center;justify-content:space-between} footer a{color:var(--dim);text-decoration:none} footer a:hover{color:var(--cyan)} - .reveal{opacity:0;transform:translateY(16px);transition:opacity .6s ease,transform .6s ease} .reveal.in{opacity:1;transform:none} @media(prefers-reduced-motion:reduce){ @@ -171,7 +158,7 @@
- + - Chezlepro · tarifs + Set‑OPS · Chezlepro
@@ -613,13 +600,13 @@
+ + + Chezlepro inc. · Saint-Bruno-de-Montarville, Québec
- + +
Set‑OPS — moteur libre, licence AGPLv3 · chezlepro.ca
diff --git a/promo/valeur.html b/promo/valeur.html index 87883bf..cb2a1d9 100644 --- a/promo/valeur.html +++ b/promo/valeur.html @@ -3,7 +3,7 @@ -Set-OPS — La valeur, chiffrée et prouvée +Set-OPS — La valeur · Chezlepro @@ -43,9 +43,7 @@ animation:drift 24s ease-in-out infinite alternate; } @keyframes drift{from{transform:translate(-3%,0) scale(1)}to{transform:translate(3%,2%) scale(1.08)}} - .wrap{max-width:var(--wrap);margin-inline:auto;padding-inline:24px} - header.nav{position:sticky;top:0;z-index:20;backdrop-filter:blur(12px); background:linear-gradient(180deg,rgba(5,6,15,.72),rgba(5,6,15,.28)); border-bottom:1px solid var(--line-2)} @@ -53,19 +51,19 @@ .brand{display:flex;align-items:center;gap:11px;font-weight:650;letter-spacing:.2px;text-decoration:none;color:var(--ink)} .brand svg{width:30px;height:30px;flex:none} .brand b{font-weight:750} - .nav nav{margin-left:auto;display:flex;gap:26px;align-items:center} + .nav nav{margin-left:auto;display:flex;gap:24px;align-items:center} .nav nav a{color:var(--dim);text-decoration:none;font-size:.94rem;font-weight:500} .nav nav a:hover{color:var(--ink)} + .nav nav a[aria-current="page"]{color:var(--ink);font-weight:640} + .nav nav a[aria-current="page"]::after{content:"";display:block;height:2px;border-radius:2px;background:var(--aurora);margin-top:3px} .nav .cta-mini{padding:8px 16px;border-radius:999px;background:var(--aurora);color:#04121a;font-weight:700;font-size:.9rem} .nav .cta-mini:hover{color:#04121a;filter:brightness(1.08)} @media(max-width:860px){.nav nav a:not(.cta-mini){display:none}} - .eyebrow{font-family:var(--mono);font-size:.76rem;letter-spacing:.28em;text-transform:uppercase;color:var(--cyan);font-weight:600} h1,h2,h3{text-wrap:balance;line-height:1.08;margin:0} .grad{background:var(--aurora);-webkit-background-clip:text;background-clip:text;color:transparent} p{margin:0} .lede{color:var(--dim);font-size:1.12rem;max-width:60ch} - .hero{position:relative;padding:82px 0 60px} .hero .eyebrow{display:block;margin-bottom:22px} .hero h1{font-size:clamp(2.3rem,6vw,4.6rem);font-weight:800;letter-spacing:-.02em;max-width:17ch} @@ -76,13 +74,11 @@ .btn-primary:hover{transform:translateY(-2px);filter:brightness(1.08)} .btn-ghost{color:var(--ink);border-color:var(--line);background:var(--panel)} .btn-ghost:hover{border-color:var(--cyan);transform:translateY(-2px)} - section{padding:72px 0;position:relative} .sec-head{max-width:68ch;margin-bottom:42px} .sec-head h2{font-size:clamp(1.75rem,3.4vw,2.6rem);font-weight:750;letter-spacing:-.015em;margin-top:14px} .sec-head p{margin-top:16px;color:var(--dim);font-size:1.07rem} .rule{height:1px;background:linear-gradient(90deg,var(--line),transparent);border:0;margin:0} - /* ---- calculateur ---- */ .calc{display:grid;grid-template-columns:minmax(0,340px) minmax(0,1fr);gap:26px;align-items:start} @media(max-width:900px){.calc{grid-template-columns:1fr}} @@ -94,7 +90,6 @@ .field label b{color:var(--ink);font-family:var(--mono);font-size:.95rem;font-weight:600} .field input[type=range]{width:100%;accent-color:#56c2ff;height:22px;cursor:pointer} .field .sub{font-size:.78rem;color:var(--dim-2);margin-top:5px} - .results{display:grid;gap:18px} .verdict{background:linear-gradient(135deg,rgba(79,227,193,.11),rgba(169,139,255,.09));border:1px solid rgba(86,194,255,.3);border-radius:18px;padding:26px} .verdict .big{font-size:clamp(1.6rem,4.2vw,2.5rem);font-weight:800;letter-spacing:-.02em;line-height:1.15} @@ -111,25 +106,22 @@ .lines li{display:flex;justify-content:space-between;gap:12px;color:var(--dim)} .lines li span:last-child{font-family:var(--mono);color:var(--ink);font-variant-numeric:tabular-nums;white-space:nowrap} .lines li.zero span:last-child{color:var(--teal);font-weight:700} - .note{font-size:.86rem;color:var(--dim-2);margin-top:18px;max-width:74ch} + .note{font-size:.87rem;color:var(--dim-2);margin-top:18px;max-width:76ch} .note b{color:var(--dim)} - /* ---- tableau remplace ---- */ .tbl-scroll{overflow-x:auto;border:1px solid var(--line);border-radius:16px;background:var(--panel-2)} - table{border-collapse:collapse;width:100%;min-width:680px;font-size:.94rem} + table{border-collapse:collapse;width:100%;min-width:640px;font-size:.94rem} thead th{text-align:left;padding:15px 18px;font-family:var(--mono);font-size:.74rem;letter-spacing:.13em;text-transform:uppercase;color:var(--dim-2);border-bottom:1px solid var(--line);font-weight:600;white-space:nowrap} tbody td{padding:14px 18px;border-bottom:1px solid var(--line-2);vertical-align:top;color:var(--dim)} tbody tr:last-child td{border-bottom:0} tbody tr:hover{background:rgba(255,255,255,.022)} tbody td:first-child{color:var(--ink);font-weight:640;white-space:nowrap} tbody td.libre{color:var(--dim);font-family:var(--mono);font-size:.86rem} - .st{display:inline-flex;align-items:center;gap:6px;font-family:var(--mono);font-size:.7rem;letter-spacing:.07em;text-transform:uppercase;padding:3px 9px;border-radius:999px;white-space:nowrap} + .st{display:inline-flex;align-items:center;gap:6px;font-family:var(--mono);font-size:.7rem;letter-spacing:.07em;text-transform:uppercase;padding:4px 10px;border-radius:999px;white-space:nowrap;margin-left:auto;flex:none} .st.ok{color:#7ff0d0;background:rgba(79,227,193,.12);border:1px solid rgba(79,227,193,.32)} .st.wip{color:#ffd79a;background:rgba(255,196,107,.1);border:1px solid rgba(255,196,107,.3)} - /* ---- preuve ---- */ - .stats{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:34px} - @media(max-width:880px){.stats{grid-template-columns:repeat(2,1fr)}} + .stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:16px;margin-bottom:34px} .stat{background:var(--panel-2);border:1px solid var(--line-2);border-radius:15px;padding:22px} .stat .n{font-size:2rem;font-weight:800;letter-spacing:-.02em;background:var(--aurora);-webkit-background-clip:text;background-clip:text;color:transparent;font-variant-numeric:tabular-nums} .stat .l{color:var(--dim);font-size:.9rem;margin-top:5px} @@ -142,36 +134,31 @@ .term .c{color:var(--cyan)} .term .g{color:var(--teal)} .term .w{color:var(--ink)} - /* ---- colonnes génériques ---- */ .duo{display:grid;grid-template-columns:repeat(2,1fr);gap:20px} @media(max-width:820px){.duo{grid-template-columns:1fr}} - .card{position:relative;background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:26px;overflow:hidden;transition:transform .2s ease,border-color .2s ease} - .card:hover{transform:translateY(-3px);border-color:rgba(86,194,255,.4)} + .card{position:relative;background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:26px;overflow:hidden;transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease} + .card:hover{transform:translateY(-3px);border-color:rgba(86,194,255,.42);box-shadow:0 18px 50px -24px rgba(86,194,255,.45)} .card::before{content:"";position:absolute;inset:0 0 auto 0;height:2px;background:var(--aurora);opacity:.75} - .card h3{font-size:1.18rem;font-weight:720;margin-bottom:10px} - .card p{color:var(--dim);font-size:.96rem} - ul.does{list-style:none;padding:0;margin:14px 0 0;display:grid;gap:9px} - ul.does li{position:relative;padding-left:22px;color:var(--dim);font-size:.95rem} + .card h3{font-size:1.2rem;font-weight:720;margin-bottom:10px} + .card p{color:var(--dim);font-size:.95rem} + ul.does{list-style:none;padding:0;margin:16px 0 0;display:grid;gap:9px} + ul.does li{position:relative;padding-left:22px;color:var(--dim);font-size:.94rem} ul.does li::before{content:"";position:absolute;left:2px;top:.62em;width:7px;height:7px;border-radius:2px;background:var(--aurora);transform:rotate(45deg)} ul.does b{color:var(--ink);font-weight:640} - .honest{background:var(--panel-2);border:1px solid var(--line);border-left:3px solid var(--amber);border-radius:14px;padding:24px 26px} - .honest h3{font-size:1.05rem;font-weight:700;margin-bottom:12px;color:var(--amber)} + .honest h3{font-size:1.04rem;font-weight:700;margin-bottom:12px;color:var(--amber)} .honest ul{margin:0;padding-left:20px;display:grid;gap:10px} - .honest li{color:var(--dim);font-size:.96rem} + .honest li{color:var(--dim);font-size:.95rem} .honest b{color:var(--ink);font-weight:640} - .close{text-align:center;padding:88px 0 96px} .close h2{font-size:clamp(1.9rem,4.6vw,3.1rem);font-weight:800;letter-spacing:-.02em;max-width:20ch;margin-inline:auto} .close p{margin:20px auto 0;color:var(--dim);max-width:56ch;font-size:1.06rem} .close .cta-row{justify-content:center} - footer{border-top:1px solid var(--line-2);padding:40px 0;color:var(--dim-2);font-size:.9rem} - footer .wrap{display:flex;flex-wrap:wrap;gap:16px;align-items:center;justify-content:space-between} + footer .wrap{display:flex;flex-wrap:wrap;gap:16px 28px;align-items:center;justify-content:space-between} footer a{color:var(--dim);text-decoration:none} footer a:hover{color:var(--cyan)} - .reveal{opacity:0;transform:translateY(16px);transition:opacity .6s ease,transform .6s ease} .reveal.in{opacity:1;transform:none} @media(prefers-reduced-motion:reduce){ @@ -186,7 +173,7 @@
- + - Set‑OPS · Alliance Boréale + Set‑OPS · Chezlepro
@@ -604,13 +589,13 @@
- Set‑OPS · Alliance Boréale — tout est libre + + + + Chezlepro inc. · Saint-Bruno-de-Montarville, Québec
- + +
Set‑OPS — moteur libre, licence AGPLv3 · chezlepro.ca