/* usine:socle : le SOCLE FIXE de l'usine 1000 (Cedia 26/09). Posé en CODE après chaque build (astro_site.pose_socle, dernière feuille du de chaque page), vérifié par verif_en_ligne (points socle:*, verif_socle.py). Aucun appel à un LLM. Chaque règle a son seuil chiffré. */ /* S1 logo du header : 52 px de haut en bureau (48 à 64), 38 px en mobile (≥ 32). Cedia 27/09, actu-pme.com : à 44 px le logo « peut être plus gros ». */ header [data-usine="logo"] img, header img[data-usine="logo"] { height: 52px !important; width: auto !important; max-width: min(60vw, 340px); object-fit: contain; } /* S2 pages internes (contact, à propos, auteurs...) : conteneur à la largeur du site, jamais une colonne de 700 px encadrée. Le conteneur porte data-usine-page="interne". */ [data-usine-page="interne"] { min-width: min(100%, 60rem); margin-inline: auto; } /* S3 ... mais un texte courant de page interne reste une colonne lisible (≤ 75 caractères). */ /* 54ch, pas 60ch : le seuil de verif_socle est cpl_max = 80 caractères par ligne et 60ch en valait 86 sur la-gazette-assurance (ch = chasse du « 0 » ≈ 8,8 px en Inter Tight, soit 528 px de colonne pour 6,14 px par caractère moyen ; 54ch ≈ 475 px ≈ 77 car.). Le socle ne tenait pas son propre seuil. */ [data-usine-page="interne"] p { max-width: min(54ch, 31em); } [data-usine-page="interne"] .text-center p, [data-usine-page="interne"] p.text-center { margin-inline: auto; } /* ... jamais dans un article : le texte remplit la colonne du kit, la mesure se règle sur la colonne (Cedia 27/09, blog-business-entreprise : paragraphes de 432 px dans une colonne de 896, encadré auteur écrasé). */ /* !important : une règle de thème ou de retouche (« p, li { max-width: 68ch } ») faisait le même effet. */ .ka-cadre .ka-corps :is(p, li), .ka-cadre .ka-auteur p { max-width: none !important; } /* S4 images d'un bloc de home hors hero : 480 px de haut au plus (une frise ou un parcours n'étale jamais une photo pleine largeur par étape). */ [data-bh-home] [data-bloc]:not([data-bloc="hero"]) img, [data-usine-bloc]:not([data-usine-bloc="hero"]) img { max-height: 480px; object-fit: cover; } /* sauf l'avant / après : ses deux vues couvrent tout le cadre (blog-mutuelle-sante 27/09, vide de 245 px dessous) */ [data-usine-bloc] [data-avant-apres] img, [data-bh-home] [data-bloc] [data-avant-apres] img { max-height: none; } /* sauf la carte « image seule » d'une mosaïque : l'image EST le cadre. Le kit étire déjà son lien (`flex: 1 1 0%`) et lui demande `height: 100%` ; le plafond la laissait à 480 px et la légende tombait 405 px plus bas, trou mesuré DANS la carte vedette (decorateur-maison.com 28/09, portier home:mosaique). Même exclusion dans verif_socle.py, point images-hors-hero. */ [data-usine-bloc] [class*="cs-image-seule"] img, [data-bh-home] [data-bloc] [class*="cs-image-seule"] img { max-height: none; } /* S5 texte courant d'article : 16 px au moins, interligne 1,5 au moins. */ body { font-size: max(16px, 1em); } .ka-corps p, .ka-corps li { font-size: max(16px, 1em); line-height: 1.65; } /* S6 aucun média plus large que son conteneur (débordement horizontal). */ img, video, iframe { max-width: 100%; } pre { overflow-x: auto; } /* S7 quiz : une affirmation à la fois quand le kit_vivant est chargé (sans JS, tout reste lisible). */ [data-quiz] [data-question][hidden] { display: none !important; } @media (max-width: 767px) { header [data-usine="logo"] img, header img[data-usine="logo"] { height: 38px !important; } /* S8 cibles tactiles : 44 px au moins en mobile. */ header a, header button, .kv-bouton, [data-quiz] button { min-height: 44px; min-width: 44px; display: inline-flex; align-items: center; justify-content: center; } } /* S9 le menu SUIT le logo (Cedia 27/09, actu-pme.com : logo isolé à gauche, menu collé à droite). Dans la rangée du header qui porte le logo, le premier groupe de liens (≥ 3 liens) se colle au logo ; ce qui suit (bouton de contact) part à droite. Seuil : écart logo → menu ≤ 96 px à 1440 (socle:header-groupe). Un thème qui place son menu autrement (position absolue) se corrige dans sites//socle-site.css. */ @media (min-width: 1024px) { header :is(div, nav):has(> [data-usine="logo"], > * > [data-usine="logo"]) > :not(:has([data-usine="logo"])):is(:has(li ~ li ~ li), :has(a ~ a ~ a)) { margin-inline-start: clamp(24px, 2.5vw, 40px) !important; margin-inline-end: auto !important; flex-grow: 0 !important; justify-content: flex-start !important; } } /* usine:socle-site : assurance-pro-entreprise-com */ /* Corrections mesurées d'assurance-pro-entreprise.com (agent-1446-1, 27/09/2026). Posé par astro_site.pose_socle APRÈS le socle commun, à chaque build : hors de la copie de travail (astro/), donc un réhabillage ne l'efface pas. Chaque règle vient d'une mesure au navigateur (mesure_home_socle.py), pas d'une impression. */ /* 1. socle:hero-plein-media — la photo du hero, en rond de 350 px dans un hero de 1440 x 782, ne couvre que 10,9 % de la surface (seuil 12 %). Mesuré au navigateur (mesure_hero_image.py) : la taille est un couloir étroit, parce que le second critère du hero (portier_da.da_hauteurs) exige que le hero finisse PILE au bas du premier écran, à 3 px près. Le hero a une hauteur plancher de 782 px (100svh - header de 118) et son contenu vaut image + 384 px : dès 384 px d'image le contenu dépasse le plancher, le hero grandit et son bas passe à 906 px → deploy REFUSE. image 350 → hero 782, bas 900 OK · média 10,9 % REFUS image 368 → hero 782, bas 900 OK · média 12,2 % OK ← la seule qui passe les deux image 384 → hero 788, bas 906 REFUS · média 13,0 % image 432 → hero 816, bas 934 REFUS · média 15,9 % 368 px est donc la plus grande image possible, et elle passe les deux critères de justesse : ne pas la regrossir sans remesurer. On ne touche qu'au grand écran : à 390 px la photo est un rond de 80 px qui tient dans la colonne. */ @media (min-width: 1024px) { [data-usine-bloc="hero"] .hero-media img { width: 368px; height: 368px; } } /* 2. socle:stats-lisibles — le bloc « Repères » est une frise datée : son année est un chiffre clé, pas une étiquette de rubrique. Le `.tag` du thème la servait à 11 px (seuil 28 px à 1440, 24 px à 390). */ [data-usine-bloc="reperes"] .tag { font-size: 1.75rem; line-height: 1.25; letter-spacing: 0.02em; font-variant-numeric: tabular-nums; } @media (max-width: 640px) { [data-usine-bloc="reperes"] .tag { font-size: 1.5rem; } } /* 3. home:faq-centree — l'accordéon porte `max-w-[52rem]` et restait calé à gauche (marge gauche 98 px / droite 350 px mesurées). L'en-tête et la liste se centrent. */ [data-usine-bloc="faq"] .accordeon { margin-left: auto; margin-right: auto; } [data-usine-bloc="faq"] .kick, [data-usine-bloc="faq"] .bloc-titre { text-align: center; }