#use-cases-hub{--uc-paper:#fcfcfa;--uc-ink:#163c3b;--uc-muted:#5b706f;--uc-line:#dbe6e2;--uc-teal:#2b7067;--uc-tint:#eaf3ef;background:var(--uc-paper);color:var(--uc-ink);font-family:Inter,Arial,sans-serif;font-size:15px;line-height:1.6;max-width:1640px;margin:auto;container-type:inline-size;color-scheme:light} #use-cases-hub *{box-sizing:border-box} #use-cases-hub h1,#use-cases-hub h2,#use-cases-hub h3,#use-cases-hub p{margin:0} #use-cases-hub a{color:inherit;text-decoration:none} #use-cases-hub .uc-rail{width:93%;margin:auto;padding-inline:clamp(28px,3cqw,56px)} #use-cases-hub .uc-hero{display:grid;grid-template-columns:1.4fr 1fr;gap:54px;align-items:end;padding-block:64px 48px} #use-cases-hub .uc-eyebrow{font-size:12px;text-transform:uppercase;letter-spacing:.13em;font-weight:650;color:var(--uc-teal);margin-bottom:17px} #use-cases-hub h1{font-family:Merriweather,Georgia,serif;font-size:clamp(32px,4.6cqw,54px);font-weight:580;line-height:1.18;letter-spacing:-.045em} #use-cases-hub .uc-hero p{font-size:17px;line-height:1.7;color:var(--uc-muted);max-width:350px;padding-bottom:4px} #use-cases-hub .uc-cases{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:21px;padding-bottom:52px} #use-cases-hub .uc-case{border:1px solid var(--uc-line);border-radius:15px;background:#fff;display:flex;flex-direction:column;overflow:hidden;min-width:0;transition:border-color .16s,box-shadow .16s} #use-cases-hub .uc-case:hover{border-color:#7faea3;box-shadow:0 4px 18px #17483b09} #use-cases-hub .uc-case:focus-visible{outline:3px solid var(--uc-teal);outline-offset:4px} #use-cases-hub .uc-moment{padding:29px 30px 27px;background:var(--uc-tint);min-height:145px;display:flex;align-items:center;font-family:Merriweather,Georgia,serif;font-size:25px;line-height:1.4;letter-spacing:-.035em;font-weight:400} #use-cases-hub .uc-case:nth-child(3) .uc-moment{background:#edf1f7} #use-cases-hub .uc-case:nth-child(4) .uc-moment{background:#f1f0eb} #use-cases-hub .uc-case:nth-child(5) .uc-moment{background:#f8efe9} #use-cases-hub .uc-case:nth-child(6) .uc-moment{background:#f0edf6} #use-cases-hub .uc-case:nth-child(7) .uc-moment{background:#f7f4e9} #use-cases-hub .uc-copy{padding:25px 30px 23px;display:flex;flex-direction:column;flex:1} #use-cases-hub h2{font-size:22px;line-height:1.3;font-weight:650;letter-spacing:-.035em;margin-bottom:12px} #use-cases-hub .uc-description{font-size:14px;line-height:1.65;color:var(--uc-muted);max-width:390px;margin-bottom:23px} #use-cases-hub .uc-cta{margin-top:auto;display:flex;align-items:center;justify-content:space-between;gap:16px;font-size:13px;font-weight:650;color:var(--uc-teal);padding-top:16px;border-top:1px solid var(--uc-line)} #use-cases-hub .uc-cta b{font-weight:400;font-size:20px} #use-cases-hub .uc-featured{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;background:#eff5f2} #use-cases-hub .uc-featured .uc-moment{min-height:265px;font-size:34px;line-height:1.35;padding:37px 40px;background:#e3efea} #use-cases-hub .uc-featured .uc-copy{padding:32px 34px;background:#f6faf7} #use-cases-hub .uc-featured h2{font-size:26px} #use-cases-hub .uc-featured .uc-description{font-size:15px} @container(max-width:832px){#use-cases-hub .uc-rail{padding-inline:20px}#use-cases-hub .uc-nav{gap:18px}#use-cases-hub .uc-hero{gap:30px;padding-top:48px}#use-cases-hub .uc-featured .uc-moment{padding:26px;font-size:30px}#use-cases-hub .uc-featured .uc-copy{padding:26px}#use-cases-hub .uc-moment{padding:24px;font-size:23px}#use-cases-hub .uc-copy{padding:24px}#use-cases-hub .uc-footer-columns{grid-template-columns:repeat(3,minmax(0,1fr))}} @container(max-width:600px){#use-cases-hub .uc-nav{min-height:72px}#use-cases-hub .uc-nav-item{display:none}#use-cases-hub .uc-mobile-menu{display:block;font-size:14px}#use-cases-hub .uc-hero{grid-template-columns:1fr;gap:18px;padding-block:34px 30px}#use-cases-hub h1{font-size:34px}#use-cases-hub .uc-hero p{font-size:16px}#use-cases-hub .uc-cases{grid-template-columns:1fr;gap:18px}#use-cases-hub .uc-featured{display:flex}#use-cases-hub .uc-featured .uc-moment{min-height:155px;font-size:28px;padding:25px}#use-cases-hub .uc-featured .uc-copy{padding:24px}#use-cases-hub .uc-featured h2{font-size:23px}#use-cases-hub .uc-moment{min-height:135px;font-size:24px}#use-cases-hub .uc-footer-top{display:block}#use-cases-hub .uc-footer-top p{margin-top:10px}#use-cases-hub .uc-footer-columns{grid-template-columns:repeat(2,minmax(0,1fr));gap:25px 20px}} #use-cases-hub{max-width:none;padding-top:100px} #use-cases-hub .uc-rail{box-sizing:border-box;width:min(1640px,93vw);padding-inline:clamp(28px,3vw,56px)} #use-cases-hub .uc-reading{display:grid;grid-template-columns:1.2fr 1fr;gap:64px;border-top:1px solid var(--uc-line);padding-block:48px} #use-cases-hub .uc-reading h2{font:580 clamp(28px,3vw,40px)/1.25 Merriweather,Georgia,serif;letter-spacing:-.035em} #use-cases-hub .uc-reading p:not(.uc-eyebrow){max-width:560px;color:var(--uc-muted);line-height:1.75} #use-cases-hub .uc-reading p+p{margin-top:16px} #use-cases-hub .uc-reading-last{padding-bottom:64px} @media(max-width:832px){#use-cases-hub .uc-rail{padding-inline:20px}#use-cases-hub .uc-reading{grid-template-columns:1fr;gap:20px;padding-block:32px}} /* ── 12/09 · LOT QA168 · rythme du pied, hub use-cases UNIQUEMENT ───────── ⚠️ TERRITOIRE DE PIX (les colonnes et l'espacement du pied lui appartiennent). Posé sur demande de Kevin/LEAD, et signalé comme tel. MESURÉ sur le rendu, a 1440, AVANT correction : home /_home-v4/ pistes 260 · 134 · 150 · 241 · 161 · 107 ecarts 28x5 hub /use-cases-v4/ pistes 260 · 134 · 150 · 241 · 161 · 107 ecarts 28x5 📌 Le pied du hub EST donc deja celui de la home, piste pour piste — la contrainte « reprends celui de la HOME » etait deja satisfaite par le shell compare-v4 dont PIX l'a construit. Ce qui restait est le defaut de RYTHME : pistes ponderees au contenu, donc blocs de texte non rythmes alors que le `gap` est constant. Meme correction que sur brief-v4 : colonnes dimensionnees sur leur contenu, mou reparti a egalite. ⛔ Specificite superieure et non ordre de source : page.css charge AVANT menu.css. ⛔ >=1281px seulement, comme sur brief : en dessous la grille de PIX passe proprement en plusieurs rangees avec des ecarts uniformes — rien a corriger. 📌 LA HOME ET LES 22 AUTRES PAGES GARDENT LE DEFAUT. Ce n'est pas un oubli : generaliser n'a pas ete demande, et c'est un arbitrage Kevin, pas une consequence de la mesure. */ @media(min-width:1281px){ html body.uc-navigation-v2[data-tool-page="use-cases-hub"] #footer.ft-footer .ft-footer-top{ grid-template-columns:260px repeat(5,max-content)!important; justify-content:space-between!important; } } /* QA162: locale-only wrapping; COPY text and explicit quote breaks stay exact. */ @media(min-width:833px){html[lang="fr"] #use-cases-hub .uc-featured .uc-moment{font-size:32px;text-wrap:balance}} @media(max-width:600px){html[lang="ja"] #use-cases-hub .uc-hero h1{font-size:40px!important;text-wrap:balance}}