:root{--primary: #B4762A;--primary-hover: #C98F42;--on-primary: #14171A;--secondary: #14171A;--secondary-hover: #262B30;--bg: #EDE7DC;--surface: #F6F2EA;--text: #14171A;--text-secondary: #4A5057;--text-strong: #0B0E10;--text-muted: #5F666D;--text-faint: #C9C1B4;--fill: #E3DBCD;--border: #D2C8B8;--white: #FFFFFF;--callout-bg: #F5EAD8;--callout-text: #6B4517;--callout-border: #D8BE8E;--blue:#8A5A1E;--ink:#14171A;--cyan:#F2E7CF;--paper:#EDE7DC;--line:#D2C8B8;--muted:#5F666D;--font-heading:Archivo,sans-serif;--font-body:Archivo,sans-serif;--serif:Archivo,sans-serif;--sans:Archivo,sans-serif;--mono:'IBM Plex Mono',monospace}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font:15px/1.65 var(--sans)}a{color:inherit;text-decoration:none}.topline{padding:8px max(20px,calc((100vw - 1240px)/2));background:var(--ink);color:#C9C1B4;font:11px var(--mono);display:flex;justify-content:space-between;letter-spacing:.04em}.dot:before{content:'●';color:var(--cyan);margin-right:7px}.nav-wrap{height:79px;padding:0 max(20px,calc((100vw - 1240px)/2));display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:9px;font-size:16px;letter-spacing:.08em;font-weight:500}.brand b{font-weight:800}.brand-mark{width:31px;height:31px;border-radius:50%;display:grid;place-items:center;background:var(--blue);color:white;font:700 18px var(--serif)}.main-nav{display:flex;align-items:center;gap:23px;font-size:12px;font-weight:700}.main-nav a{transition:color .2s}.main-nav a:hover{color:var(--blue)}.nav-method{border:1px solid var(--ink);padding:7px 12px}.menu-btn{display:none;background:none;border:0}.hero,.section,.workflow,.cta,.archive-page,.rubric-page,.method-page{padding-left:max(20px,calc((100vw - 1120px)/2));padding-right:max(20px,calc((100vw - 1120px)/2))}.hero{display:grid;grid-template-columns:1.35fr .65fr;gap:70px;min-height:570px;padding-top:83px;padding-bottom:70px;background-image:linear-gradient(#D2C8B850 1px,transparent 1px),linear-gradient(90deg,#D2C8B850 1px,transparent 1px);background-size:32px 32px}.eyebrow{font:11px var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--blue);margin:0 0 15px}.hero h1,.archive-hero h1,.rubric-hero h1,.method-hero h1{font:700 clamp(44px,6vw,76px)/.98 var(--serif);letter-spacing:-.045em;margin:0}.hero h1 em,.archive-hero em,.method-hero em{color:var(--blue);font-style:italic}.lead{font-size:18px;max-width:610px;color:#4A5057;margin:28px 0}.hero-actions{display:flex;align-items:center;gap:27px;margin-top:33px}.button{display:inline-flex;align-items:center;gap:12px;background:var(--blue);color:white;padding:13px 18px;font-size:12px;font-weight:800;transition:transform .2s,background .2s}.button:hover{transform:translateY(-2px);background:#6F4715}.button svg,.text-link svg{width:16px}.text-link{display:inline-flex;align-items:center;gap:9px;font-weight:800;font-size:13px;border-bottom:1px solid currentColor}.hero-index{background:#F6F2EA;border:1px solid var(--ink);padding:20px;align-self:start;box-shadow:10px 10px 0 var(--primary)}.index-top{display:flex;justify-content:space-between;font:10px var(--mono)}.pulse{color:#00855e}.pulse:before{content:'●';margin-right:5px}.part-sketch{height:160px;display:flex;align-items:center;justify-content:center;gap:12px;background:#E3DBCD;margin:18px 0}.part-sketch svg{width:58px;height:58px;color:var(--blue)}.part-sketch span{font:13px var(--mono)}.index-line{display:grid;grid-template-columns:35px 1fr 20px;border-top:1px solid var(--line);padding:10px 0;font-size:12px}.index-line b{color:var(--blue)}.hero-index p{font-size:11px;margin:12px 0 0;color:var(--muted)}.numbers{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--ink);border-bottom:1px solid var(--ink);margin:0 max(20px,calc((100vw - 1120px)/2));padding:0}.numbers div{padding:25px 18px;border-right:1px solid var(--line);display:flex;align-items:center;gap:12px}.numbers div:first-child{padding-left:0}.numbers div:last-child{border:0}.numbers strong{font:700 34px var(--serif);color:var(--blue)}.numbers span{font-size:11px;line-height:1.4}.section{padding-top:110px;padding-bottom:110px}.intro{display:grid;grid-template-columns:1fr 1fr;gap:100px}.section h2,.workflow h2,.cta h2,.status-guide h2{font:700 clamp(34px,4vw,54px)/1 var(--serif);letter-spacing:-.04em;margin:0}.prose{max-width:470px;font-size:16px}.prose p{margin-top:0;margin-bottom:18px}.prose code{font:13px var(--mono);color:var(--blue)}.topics{background:#E3DBCD}.section-head{display:flex;justify-content:space-between;gap:50px;margin-bottom:42px}.section-head>p{max-width:380px;margin:9px 0;color:#4A5057}.topic-grid{display:grid;grid-template-columns:repeat(4,1fr)}.topic-card{min-height:270px;padding:20px;border:1px solid var(--ink);margin:-1px 0 0 -1px;display:flex;flex-direction:column;transition:.25s}.topic-card:hover{background:white;transform:translateY(-5px)}.topic-card span{font:11px var(--mono);color:var(--blue)}.topic-card svg{margin:35px 0 auto;width:35px;height:35px;color:var(--blue)}.topic-card h3{font:700 27px/1 var(--serif);margin:0}.topic-card p{font-size:11px;margin:12px 0 0}.topic-card.dark{background:var(--ink);color:white}.topic-card.dark svg{color:var(--cyan)}.topic-card.cyan{background:var(--cyan)}.workflow{padding-top:105px;padding-bottom:105px;background:var(--ink);color:white;display:grid;grid-template-columns:.85fr 1.15fr;gap:75px}.workflow .eyebrow{color:var(--cyan)}.workflow ol{list-style:none;margin:0;padding:0}.workflow li{display:grid;grid-template-columns:55px 1fr;border-top:1px solid #3A3F45;padding:16px 0}.workflow b{font:12px var(--mono);color:var(--cyan)}.workflow h3{margin:0;font-size:17px}.workflow p{margin:4px 0 0;color:#B9B2A5;font-size:13px}.cta{padding-top:94px;padding-bottom:94px;background:var(--blue);color:white}.cta .eyebrow{color:var(--cyan)}.button-light{background:white;color:var(--blue);margin-top:25px}.button-light:hover{background:var(--cyan)}.site-footer{padding:60px max(20px,calc((100vw - 1120px)/2)) 23px;background:#E3DBCD}.footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr 1fr;gap:38px}.footer-grid p:not(.eyebrow){max-width:290px;font-size:13px}.footer-grid a,.footer-grid span:not(.brand-mark){display:block;font-size:12px;margin:7px 0}.footer-bottom{border-top:1px solid var(--line);margin-top:42px;padding-top:16px;display:flex;justify-content:space-between;font:10px var(--mono);color:var(--muted)}.archive-page{padding-top:70px;padding-bottom:90px}.archive-hero{max-width:720px}.archive-hero h1{font-size:72px}.archive-hero p{font-size:16px;color:var(--muted);max-width:620px}.archive-tools{margin:45px 0 18px}.archive-tools label{display:flex;align-items:center;gap:10px;border:1px solid var(--ink);background:white;padding:0 14px;max-width:560px}.archive-tools input{width:100%;border:0;padding:14px 0;font:13px var(--sans);outline:0}.filters{display:flex;flex-wrap:wrap;gap:7px;margin-top:14px}.filter{border:1px solid var(--line);background:transparent;padding:7px 9px;font:11px var(--sans);cursor:pointer}.filter.active,.filter:hover{background:var(--ink);color:white;border-color:var(--ink)}.table-wrap{overflow:auto;border-top:2px solid var(--ink)}table{border-collapse:collapse;width:100%;min-width:920px}th{text-align:left;padding:13px 10px;font:10px var(--mono);letter-spacing:.06em;text-transform:uppercase;border-bottom:1px solid var(--ink)}td{vertical-align:top;padding:17px 10px;border-bottom:1px solid var(--line);font-size:12px}td:first-child,th:first-child{padding-left:0}.vehicle{display:block;font-weight:800}td code{display:block;color:var(--blue);font:12px var(--mono);font-weight:500}td small{display:block;margin-top:5px;color:var(--muted);font-size:10px;line-height:1.4}time{display:block;margin-top:7px;font:10px var(--mono)}.status{font-size:10px;font-weight:800;padding:4px 7px;background:#ddf4ea;color:#006948;white-space:nowrap}.status.fuori-produzione{background:#f2e5df;color:#91482e}.status.revisionabile{background:#e0eff6;color:#146083}.status.refabbricato{background:#e8e5fa;color:#5036a0}.empty{padding:25px;background:white}.archive-note{font:11px var(--mono);color:var(--muted);margin-top:16px}.rubric-hero,.method-hero{padding:86px 0 70px;max-width:840px}.rubric-body{background:#E3DBCD;padding:70px max(20px,calc((100vw - 1120px)/2));display:grid;grid-template-columns:1.25fr .65fr;gap:110px}.rubric-body article{font-size:16px;max-width:620px}.rubric-body h2{font:700 32px var(--serif);margin:0 0 12px}.rubric-body aside{padding:23px;border:1px solid var(--ink);height:max-content;background:var(--paper)}.rubric-body aside h3{font:700 25px var(--serif);margin:0}.rubric-body ul{padding-left:17px;font-size:12px}.rubric-cta{padding:85px max(20px,calc((100vw - 1120px)/2))}.rubric-cta span{font:13px var(--mono);color:var(--blue)}.rubric-cta h2{font:700 48px var(--serif);margin:7px 0 20px}.method-page{padding:0}.method-hero{margin:0 max(20px,calc((100vw - 1120px)/2));padding-left:0;padding-right:0}.method-grid{display:grid;grid-template-columns:100px 1fr 100px 1fr 100px 1fr;border-top:1px solid var(--ink);border-bottom:1px solid var(--ink);padding:35px max(20px,calc((100vw - 1120px)/2));gap:15px}.method-no{font:13px var(--mono);color:var(--blue)}.method-grid article h2{font:700 25px var(--serif);margin:0}.method-grid article p{font-size:12px;margin-top:7px}.status-guide{padding:90px max(20px,calc((100vw - 1120px)/2));display:grid;grid-template-columns:1fr 1fr;gap:100px;background:#E3DBCD}.status-guide dl{margin:0}.status-guide dt{font-weight:800;border-top:1px solid var(--ink);padding-top:12px;margin-top:12px;font-size:13px}.status-guide dd{margin:3px 0;font-size:12px;color:var(--muted)}.not-found{min-height:60vh;padding:110px max(20px,calc((100vw - 1120px)/2))}.not-found h1{font:700 55px/1 var(--serif);max-width:570px}.reveal-on-scroll{opacity:0;transform:translateY(20px);transition:opacity .6s ease,transform .6s ease}.reveal-on-scroll.revealed{opacity:1;transform:none}@media(max-width:800px){.main-nav{display:none;position:absolute;z-index:5;top:79px;left:0;right:0;background:var(--paper);padding:20px;flex-direction:column;align-items:flex-start;border-bottom:1px solid var(--ink)}.main-nav.open{display:flex}.menu-btn{display:block}.menu-btn svg{width:22px}.hero{grid-template-columns:1fr;gap:40px;padding-top:54px}.hero-index{max-width:420px}.numbers{grid-template-columns:1fr 1fr}.numbers div:nth-child(2){border-right:0}.numbers div:nth-child(n+3){border-top:1px solid var(--line)}.numbers div:first-child{padding-left:18px}.intro,.workflow,.rubric-body,.status-guide{grid-template-columns:1fr;gap:35px}.section-head{display:block}.topic-grid{grid-template-columns:1fr 1fr}.workflow{padding-top:70px;padding-bottom:70px}.footer-grid{grid-template-columns:1fr 1fr}.footer-grid>div:first-child{grid-column:1/-1}.footer-bottom{display:block}.footer-bottom span{display:block;margin:5px 0}.method-grid{grid-template-columns:45px 1fr;padding-top:28px;padding-bottom:28px;gap:8px 15px}.method-grid article{margin-bottom:18px}.archive-hero h1{font-size:56px}}@media(max-width:480px){.topline span:last-child{display:none}.hero h1{font-size:47px}.numbers{margin:0}.numbers strong{font-size:29px}.numbers div{padding:16px 9px;gap:7px}.topic-grid{grid-template-columns:1fr}.topic-card{min-height:205px}.archive-page{padding-top:50px}.archive-hero h1{font-size:48px}.rubric-hero,.method-hero{padding-top:55px}.rubric-hero h1,.method-hero h1{font-size:47px}.section{padding-top:70px;padding-bottom:70px}} /* === outils (05-tools) — début === */ .tool-page{padding-left:max(20px,calc((100vw - 1120px)/2));padding-right:max(20px,calc((100vw - 1120px)/2))} .breadcrumb{padding-top:26px;font:11px var(--mono);letter-spacing:.04em;color:var(--muted)} .breadcrumb a{border-bottom:1px solid var(--line)} .breadcrumb a:hover{color:var(--blue)} .breadcrumb span[aria-hidden]{margin:0 7px} .tool-hero{padding:44px 0 40px;max-width:840px} .tool-hero h1{font:700 clamp(38px,5vw,62px)/1 var(--serif);letter-spacing:-.04em;margin:0} .tool-essentials{margin:26px 0 0;padding-left:18px;font-size:14px;max-width:660px} .tool-essentials li{margin:6px 0} .tool-scope{margin:22px 0 0;font-size:13px;color:var(--muted);max-width:660px} .tool-method{border:1px solid var(--callout-border);background:var(--callout-bg);color:var(--callout-text);padding:18px 20px;margin:0 0 34px;max-width:840px} .tool-method p:not(.eyebrow){margin:0;font-size:13px;line-height:1.6} .tool-method .eyebrow{color:var(--callout-text)} .tool-method code{font:12px var(--mono)} .tool-form{border:1px solid var(--ink);background:var(--surface);padding:22px;max-width:840px} .tool-form form{display:flex;flex-wrap:wrap;align-items:flex-end;gap:14px} .tool-form label{display:block;width:100%;font:11px var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-bottom:6px} .tool-form input{flex:1 1 240px;min-width:0;border:1px solid var(--line);background:var(--white);padding:12px 13px;font:14px var(--mono);color:var(--text)} .tool-form input:focus-visible{outline:3px solid var(--focus,#5C3A0F);outline-offset:2px} .tool-form button{border:0;background:var(--blue);color:var(--white);padding:13px 20px;font:800 12px var(--sans);cursor:pointer} .tool-form button:hover{background:#6F4715} .tool-hint{font-size:12px;color:var(--muted);margin:14px 0 0;max-width:760px;line-height:1.6} .tool-result{padding:34px 0 10px;scroll-margin-top:20px} .tool-result:focus{outline:0} .tool-empty{border-left:3px solid var(--blue);background:var(--fill);padding:16px 18px;font-size:14px;max-width:760px;line-height:1.65;margin:0} .tool-count{font:11px var(--mono);letter-spacing:.04em;color:var(--muted);margin:0 0 14px} .tool-faq{padding:20px 0 90px;max-width:840px} .tool-faq h2{font:700 clamp(28px,3.4vw,42px)/1 var(--serif);letter-spacing:-.03em;margin:0 0 22px} .tool-faq details{border-top:1px solid var(--line);padding:14px 0} .tool-faq details:last-of-type{border-bottom:1px solid var(--line)} .tool-faq summary{cursor:pointer;font-weight:700;font-size:15px} .tool-faq summary:focus-visible{outline:3px solid var(--focus,#5C3A0F);outline-offset:3px} .tool-faq details p{margin:10px 0 0;font-size:14px;line-height:1.7;color:var(--muted)} @media(max-width:640px){.tool-form form{display:block}.tool-form input,.tool-form button{width:100%;margin-bottom:12px}} /* === outils (05-tools) — fin === */ /* ===== BLOC SOUS-MENU OUTILS — sans JavaScript (hover + focus-within) ===== */ .nav-item{position:relative;display:inline-flex;align-items:center} .has-sub>a::after{content:"";display:inline-block;width:5px;height:5px;margin-left:7px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg) translateY(-2px)} .has-sub::after{content:"";position:absolute;top:100%;left:0;right:0;height:18px} .sub-nav{position:absolute;top:calc(100% + 18px);left:-16px;z-index:30;min-width:296px;flex-direction:column;gap:1px;padding:8px;background:var(--surface);border:1px solid var(--line);box-shadow:0 18px 34px rgba(31,58,77,.14);display:none} .has-sub:hover>.sub-nav,.has-sub:focus-within>.sub-nav{display:flex} .sub-nav a{display:block;padding:9px 12px;font-size:13px;font-weight:700;line-height:1.25;white-space:nowrap;border-left:2px solid transparent} .sub-nav a small{display:block;margin-top:2px;font-family:var(--font-body);font-size:11px;font-weight:400;color:var(--text-muted)} .sub-nav a:hover,.sub-nav a:focus{background:var(--fill);color:var(--primary);border-left-color:var(--primary)} .sub-nav a:hover small,.sub-nav a:focus small{color:var(--text-secondary)} .sub-nav-all{margin-top:5px;border-top:1px solid var(--line);padding-top:11px!important;color:var(--primary)} @media(max-width:850px){ .nav-item{display:block} .has-sub::after{display:none} .has-sub>a::after{transform:rotate(45deg) translateY(-2px)} .sub-nav{position:static;display:flex;min-width:0;margin:9px 0 4px 2px;padding:2px 0 2px 14px;border:0;border-left:2px solid var(--line);box-shadow:none;background:transparent;gap:0} .sub-nav a{white-space:normal;padding:7px 0;font-size:13px;border-left:0} .sub-nav a small{display:none} .sub-nav a:hover,.sub-nav a:focus{background:transparent} .sub-nav-all{padding-top:8px!important} } /* ===== BLOC LARGEUR UNIFIÉE — toutes les pages à la largeur de la home ===== */ /* * Posé par 06a2-largeur-contenu. Les sélecteurs ci-dessous ont été RELEVÉS * dans les feuilles réellement chargées par le front, pas devinés : c'est la * correction du défaut d'origine, où une liste de classes supposées rendait * le bloc inerte sans que rien ne le signale. * * Largeur de référence relevée sur `.container` : la largeur de `.container`. * * `!important` est délibéré. Une contrainte peut être déclarée dans une * feuille chargée APRÈS celle-ci, ou plus bas dans ce même fichier par un * bloc appendu ultérieurement : à spécificité égale elle gagnerait, et le * bloc serait posé, validé, et sans effet. * * Les contrôles de formulaire, les images et les cartes sont épargnés. * * Ce qui suit la borne « relevé automatique : fin » est CONSERVÉ au rejeu : * c'est là que vivent les règles tranchées à la main. N'écris rien au-dessus. */ /* --- relevé automatique : début --- */ .lead{max-width:none!important} /* styles.css : 610px */ .prose{max-width:none!important} /* styles.css : 470px */ .section-head>p{max-width:none!important} /* styles.css : 380px */ .footer-grid p:not(.eyebrow){max-width:none!important} /* styles.css : 290px */ .archive-hero{max-width:none!important} /* styles.css : 720px */ .archive-hero p{max-width:none!important} /* styles.css : 620px */ .rubric-body article{max-width:none!important} /* styles.css : 620px */ .not-found h1{max-width:none!important} /* styles.css : 570px */ .hero-index{max-width:none!important} /* styles.css : 420px */ .tool-hero{max-width:none!important} /* styles.css : 840px */ .tool-essentials{max-width:none!important} /* styles.css : 660px */ .tool-scope{max-width:none!important} /* styles.css : 660px */ .tool-method{max-width:none!important} /* styles.css : 840px */ .tool-hint{max-width:none!important} /* styles.css : 760px */ .tool-empty{max-width:none!important} /* styles.css : 760px */ .tool-faq{max-width:none!important} /* styles.css : 840px */ .source-list{max-width:none!important} /* styles.css : 820px */ /* Grilles à deux colonnes relevées, NON collapsées d'office : une grille de cartes se collapserait à tort. À trancher au brief 06a2, puis à écrire SOUS la borne de fin ci-dessous. */ /* .hero { grid-template-columns: 1.35fr .65fr } (styles.css) */ /* .workflow { grid-template-columns: .85fr 1.15fr } (styles.css) */ /* .numbers { grid-template-columns: 1fr 1fr } (styles.css) */ /* .topic-grid { grid-template-columns: 1fr 1fr } (styles.css) */ /* .footer-grid { grid-template-columns: 1fr 1fr } (styles.css) */ /* --- relevé automatique : fin --- */ /* Règles tranchées à la main, conservées au rejeu de 06a2. */ /* Règles tranchées à la main, conservées au rejeu de 06a2. */ /* Règles tranchées à la main, conservées au rejeu de 06a2. */ /* Règles tranchées à la main, conservées au rejeu de 06a2. */ /* --- arbitrage des grilles (06a2) --- */ /* * Huit grilles à deux colonnes relevées, tranchées une par une. * * COLLAPSÉES — grilles de TEXTE : un intitulé à gauche, le corps à droite. * .intro chapeau + h2 à gauche, .prose à droite. C'est la grille qui * porte tout le corps des pages piliers, des outils et de * /chi-siamo : elle bridait le texte à la moitié de la bande. * .rubric-body l'article et son unique encadré latéral. Un seul bloc à côté * du corps n'est pas une grille de cartes ; l'encadré passe * dessous, pleine largeur, et reste lisible. * .status-guide même patron sur /metodo : intitulé à gauche, définitions à droite. * * CONSERVÉES — grilles de CARTES, ou mise en page propre à la home : * .hero copie éditoriale + encart d'index. La home EST la largeur de * référence : la collapser reviendrait à déplacer la référence. * .workflow bande sombre de la home, titre et liste ordonnée côte à côte. * N'apparaît sur aucune page de contenu. * .numbers .topic-grid .footer-grid * leur « 1fr 1fr » est la valeur MOBILE, déclarée dans * @media(max-width:800px) — en desktop ce sont des grilles de * 4 et 5 cartes. Une déclaration inconditionnelle posée ici * écraserait la règle mobile et figerait deux colonnes partout, * défaut invisible au test desktop. */ .intro{grid-template-columns:1fr!important;gap:34px!important} .rubric-body{grid-template-columns:1fr!important;gap:34px!important} .status-guide{grid-template-columns:1fr!important;gap:34px!important} /* --- fin arbitrage des grilles (06a2) --- */ /* --- double rembourrage (06a2) --- */ :is(.archive-page,.rubric-page,.tool-page) :is(.hero,.section,.workflow,.cta,.rubric-body,.rubric-cta){padding-left:0!important;padding-right:0!important} :is(.archive-page,.rubric-page,.tool-page) :is(.section.topics,.rubric-body){padding-left:28px!important;padding-right:28px!important} /* --- fin double rembourrage (06a2) --- */ /* Règles tranchées à la main, conservées au rejeu de 06a2. */ .content-narrow{max-width:none!important} .content-narrow select,.content-narrow input[type=number],.content-narrow input[type=text]{max-width:520px} .article-layout{width:min(1140px,calc(100% - 40px));margin-inline:auto} .article-body{max-width:72ch} .article-layout{width:min(100% - 28px,1140px)} .pillar-updated{margin:20px 0 0;font:11px var(--mono);letter-spacing:.04em;color:var(--muted)} .pillar-toc{border-top:1px solid var(--ink);border-bottom:1px solid var(--ink);padding:20px 0;margin:0 0 10px;max-width:840px} .pillar-toc ol{margin:10px 0 0;padding-left:20px;font-size:14px;columns:2;column-gap:36px} .pillar-toc li{margin:5px 0;break-inside:avoid} .pillar-toc a{border-bottom:1px solid var(--line)} .pillar-toc a:hover{color:var(--blue)} .pillar-page .section.intro{padding-top:64px;padding-bottom:0;padding-left:0;padding-right:0} .pillar-rows{padding:70px 0 0} .pillar-rows h2,.pillar-next h2{font:700 clamp(28px,3.4vw,44px)/1 var(--serif);letter-spacing:-.03em;margin:0 0 18px} .pillar-next{padding:70px 0 90px;max-width:840px} .pillar-next ul{margin:16px 0 0;padding-left:18px;font-size:15px} .pillar-next li{margin:8px 0} .pillar-cta{display:flex;flex-wrap:wrap;align-items:center;gap:24px;margin:30px 0 0} /* ===== ENVELOPPE + OUVERTURE NORMÉE (couches 1 et 2 du gabarit) ===== */ .author-card{display:flex;gap:18px;align-items:flex-start;margin:0 0 22px;padding:20px 22px;background:var(--fill);border-left:3px solid var(--primary)} .author-card .author-avatar{flex:0 0 auto;line-height:0} .author-card .author-img{object-fit:cover} .author-footer .author-card .author-img{width:88px;height:88px;object-fit:cover;border-radius:var(--radius-round, 50%)} .author-footer .author-card .author-monogram{width:88px;height:88px;font-size:30px} .author-name{margin:0;font-family:var(--font-heading);font-size:16px;font-weight:700;line-height:1.3} .author-name a{color:var(--text-strong)} .author-name a:hover{color:var(--primary)} .author-job{display:block;margin-top:3px;font-size:11px;font-weight:400;text-transform:uppercase;letter-spacing:1.1px;color:var(--text-muted)} .author-legit{margin:11px 0 0;font-size:14.5px;line-height:1.5;font-weight:600;color:var(--text-strong)} .author-bio{margin:7px 0 0;font-size:13.5px;line-height:1.55;color:var(--text-secondary)} .author-links{margin:10px 0 0;font-size:13px} .author-links a{color:var(--primary);font-weight:700;border-bottom:1px solid currentColor} .page-dates{display:flex;flex-wrap:wrap;gap:6px 20px;margin:0 0 22px;font-size:12px;color:var(--text-muted)} .page-dates time{font-family:var(--font-mono);font-variant-numeric:tabular-nums;color:var(--text-secondary)} .method-note{margin:0 0 26px;padding:17px 19px;background:var(--callout-bg);border:1px solid var(--callout-border);border-left:3px solid var(--primary)} .method-note-title{margin:0 0 6px;font-family:var(--font-heading);font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:1.2px;color:var(--callout-text)} .method-note p:last-child{margin:0;font-size:14px;line-height:1.6;color:var(--callout-text)} .opening{margin:0 0 34px} .opening .answer{margin:0;padding:22px 24px;background:var(--secondary);color:var(--white);font-family:var(--font-heading);font-size:clamp(17px,1.9vw,20px);line-height:1.45;letter-spacing:-.2px} .essentials{margin:0;padding:20px 24px;background:var(--surface);border:1px solid var(--border);border-top:0} .essentials-title{margin:0 0 10px;font-family:var(--font-heading);font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:1.2px;color:var(--text-muted)} .essentials ul{margin:0;padding:0;list-style:none} .essentials li{position:relative;padding:7px 0 7px 22px;font-size:15px;line-height:1.5;color:var(--text)} .essentials li::before{content:"";position:absolute;left:0;top:15px;width:8px;height:2px;background:var(--primary)} .scope{margin:0;padding:14px 24px;background:var(--fill);border:1px solid var(--border);border-top:0;font-size:13.5px;line-height:1.55;color:var(--text-secondary)} .scope span{font-family:var(--font-heading);font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:1.1px;color:var(--text-muted);margin-right:6px} .scope a{color:var(--secondary);font-weight:700;border-bottom:1px solid currentColor} .scope a:hover{color:var(--primary)} .update-log{margin:0;padding:20px 22px;border-top:2px solid var(--secondary);background:var(--fill)} .update-log-title{margin:0 0 9px;font-family:var(--font-heading);font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:1.2px;color:var(--text-muted)} .update-log ul{margin:0;padding:0;list-style:none} .update-log li{padding:6px 0;font-size:13.5px;line-height:1.5;color:var(--text-secondary);border-bottom:1px solid var(--border)} .update-log li:last-child{border-bottom:0} .update-log time{font-family:var(--font-mono);font-variant-numeric:tabular-nums;font-weight:500;color:var(--text-strong)} @media(max-width:640px){.author-card{padding:16px}.opening .answer{padding:18px}.essentials,.scope{padding:16px 18px}} /* Signature de tête — identité et dates sur une seule ligne. Le parcours de l'auteur n'est pas ici : il se lit en pied, via .author-footer. */ .author-byline{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 18px;margin:0 0 26px;padding-bottom:14px;border-bottom:1px solid var(--border,#D3CEC1);font-size:13px;color:var(--text-secondary,#4A554D)} .byline-author a{color:var(--secondary,#3A4A3F);font-weight:700;border-bottom:1px solid currentColor} .byline-author a:hover{color:var(--primary,#A65E2E)} .author-byline .page-dates{margin:0;gap:6px 18px} /* Pied d'article — la carte auteur complète, détachée du corps du texte. */ .author-footer{margin:38px 0 22px;border-top:2px solid var(--secondary,#3A4A3F)} .author-footer .author-card{margin:0} /* Signature dans le hero d'article (blog) : le hero est un aplat sombre, la signature doit y passer en blanc. Sans cette règle, elle hérite des couleurs pensées pour un fond clair et devient illisible (contraste ~1,1:1). */ .guide-hero .author-byline, .guide-hero .author-byline .page-dates, .guide-hero .byline-author a, .guide-hero .page-dates time{color:var(--on-primary,#14171A)} .guide-hero .author-byline{border-bottom-color:rgba(20,23,26,.28)} /* ===== SOURCES — liens sortants cités près de l'affirmation ===== */ .source-note a[rel~="nofollow"]{color:var(--secondary);font-weight:600;border-bottom:1px solid var(--text-faint)} .source-note a[rel~="nofollow"]:hover{color:var(--primary);border-bottom-color:var(--primary)} .tool-table a[rel~="nofollow"]{font-weight:600;text-decoration:none;border-bottom:1px solid var(--text-faint)} .tool-table a[rel~="nofollow"]:hover{color:var(--primary);border-bottom-color:var(--primary)} .source-list{list-style:none;margin:0;padding:0;max-width:820px} .source-list li{padding:10px 0;border-bottom:1px solid var(--line);font-size:14px} .source-list li:last-child{border-bottom:0} .source-list span{display:block;margin-top:2px;font-size:11px;color:var(--text-muted)} /* Ligne dont la provenance n est pas etablie : la mention doit se voir. */ .prova-aperta{color:#6F4715!important;font-weight:700} /* --- filet has-js (reveal-on-scroll) --- */ /* * L'effet d'apparition ne s'arme QUE si le script a tourné. Sans JavaScript, * `.reveal-on-scroll` garde son opacité normale au lieu de laisser la page * vide. Les deux règles sont plus spécifiques que la déclaration d'origine, * elles gagnent sans !important. */ html:not(.has-js) .reveal-on-scroll{opacity:1;transform:none} @media(prefers-reduced-motion:reduce){.reveal-on-scroll{opacity:1;transform:none}} /* --- fin filet has-js --- */ /* ===== 07c — visuels ===== */ /* Lockup de marque : le wordmark remplace le carre placeholder ET le bloc texte. Hauteur fixee, largeur libre — le fichier livre fait 977x160, pas 512x160. */ .brand-logo{display:block;height:30px;width:auto} .footer-brand .brand-logo{height:26px} @media(max-width:480px){.brand-logo{height:23px}} /* Figures des piliers. La section .intro est une grille a deux colonnes et .prose plafonne a 470px : un schema annote y perdrait ses etiquettes. La figure tient donc les deux colonnes. Hauteur libre, jamais de recadrage cover — ces visuels sont des dessins techniques, pas des photos. */ .pillar-figure{grid-column:1/-1;margin:0} .pillar-figure img{display:block;width:100%;height:auto;object-fit:contain;border:1px solid var(--line)} .pillar-hero-figure{margin:30px 0 4px} .section-figure{margin:46px 0 0} @media(max-width:800px){.pillar-hero-figure{margin-top:22px}.section-figure{margin-top:30px}} /* Avatar de l'auteur : le slot existait dans la feuille, vide. */ .author-card .author-img{width:88px;height:88px;object-fit:cover;border-radius:var(--radius-round, 50%)} @media(max-width:480px){.author-card{flex-wrap:wrap}}