/*!/wp-content/plugins/dawnstar-design/assets/dnr.css*//** * DAWNSTAR - CSS global du site public · v1.1 * DA « FORGE » : ardoise (#0d1117) · rouge accent (#CC2828) · esprit console / ops. * Aligné sur les tokens --ds-* de Leaderboard Ops -> cohérence site + application. * Fichier externe, chargé sur TOUT le site (dans le ). * Fond animé : voir le fichier compagnon dawnstar-bg.js (chargé en footer). * * CHANGELOG * v1.1 (26/09/2026) - chantier SEO, étape 1 * - Fonds d'image mobiles neutralisés sous 1024 px (section « FONDS MOBILES »). * À utiliser avec dawnstar-bg.js v2.1 (ciel figé sous 1024 px). * v1.0 - version d'origine. */ /* ══════════════════════════ TOKENS (miroir FORGE) ══════════════════════════ */ :root{ /* Rouge / accents */ --ds-r:#CC2828; --ds-rk:#991818; --ds-rl:#E03838; --ds-glow:rgba(204,40,40,.28); /* Ardoise / fonds */ --ds-bg:#0d1117; --ds-bg0:#0a0d12; --ds-bg1:#161b22; --ds-bg2:#1f2937; /* Bordures */ --ds-bdr:rgba(204,40,40,.18); --ds-bdrh:rgba(204,40,40,.45); /* Texte */ --ds-txt:#D0DCF0; --ds-txt2:#B0B8C4; --ds-txt3:#7888A0; /* Sémantique */ --ds-gold:#C89030; --ds-ok:#10B981; --ds-warn:#F59E0B; --ds-err:#EF4444; /* Boutons neutres */ --ds-btn:#253040; --ds-btn-bdr:#354560; /* Surface lisible (panneaux de texte au-dessus du fond animé) */ --ds-surface:rgba(13,17,23,.72); /* Typographie */ --font-display:'Chakra Petch','Rajdhani',sans-serif; --font-body:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif; --font-mono:'Consolas','SF Mono','JetBrains Mono',monospace; /* Rythme / rayons */ --r-sharp:3px; --r-card:4px; --cut:12px; } /* ══════════════════════════ BASE ══════════════════════════ */ html{ background:var(--ds-bg0); } body{ background-color:transparent !important; /* laisse voir le canvas de fond animé */ color:var(--ds-txt); font-family:var(--font-body); font-size:17px; line-height:1.72; -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; } ::selection{ background:var(--ds-r); color:#fff; } a{ color:var(--ds-rl); text-decoration:none; transition:color .2s ease; } a:hover{ color:#fff; } /* Canvas de fond animé (injecté par dawnstar-bg.js) — sécurité si le JS charge avant/après */ #dsn-bg-canvas{ position:fixed; inset:0; width:100vw; height:100vh; z-index:-2; pointer-events:none; display:block; } /* Scanlines CRT très discrètes (signature FORGE) — supprimer ce bloc si non désiré */ body::after{ content:''; position:fixed; inset:0; z-index:-1; pointer-events:none; background:repeating-linear-gradient(0deg,transparent,transparent 3px,rgba(0,0,0,.022) 3px,rgba(0,0,0,.022) 4px); } .site-header .header-inner{ z-index:99999; } .custom-logo{ margin-left:30px; } #site-footer{ display:none; } /* ══════════════════════════ FONDS MOBILES (v1.1) ══════════════════════════ Sous 1024 px, le kit Elementor (Backgroundjpg.jpg, 156 Ko) et les réglages de 9 pages (PNG de 1,47 Mo, sous 767 px) posaient une image sur le body. Elle recouvrait le fond animé et pesait sur le premier affichage mobile. Le ciel est désormais dessiné une seule fois par dawnstar-bg.js v2.1. Les pages WooCommerce (réservées aux membres) gardent leur fond. Retour arrière : commenter ce bloc. */ @media (max-width:1024px){ body:not(.woocommerce-page):not(.single-product):not(.woocommerce-cart):not(.woocommerce-checkout){ background-image:none !important; } } /* ══════════════════════════ TYPOGRAPHIE ══════════════════════════ */ h1,h2,h3,h4,h5,h6, .elementor-heading-title{ font-family:var(--font-display) !important; font-weight:700; color:#fff; text-transform:uppercase; letter-spacing:.04em; line-height:1.08; margin:0 0 .6em; } h1{ font-size:clamp(2.4rem,5vw,4rem); } h2{ font-size:clamp(1.8rem,3.4vw,2.7rem); } h3{ font-size:clamp(1.25rem,2.2vw,1.6rem); font-weight:600; letter-spacing:.03em; } h4{ font-size:1.15rem; font-weight:600; } p{ margin:0 0 1em; } /* Corps de texte MARKETING (Elementor) : le kit impose Roboto -> on force Inter + couleur remontée à --ds-txt. VOLONTAIREMENT limité au contenu Elementor : ces règles de couleur/police ne débordent PAS sur les plugins (WooCommerce, Tutor, UM, événements, wpDiscuz...), dont la lisibilité/colorimétrie reste gérée par eux + la section COMPATIBILITÉ PLUGINS en bas de fichier. .elementor-widget-text-editor, .elementor-widget-text-editor p, .elementor-widget-text-editor li, .elementor-widget-text-editor span, .elementor-widget .elementor-icon-box-description, .elementor-widget .elementor-image-box-description{ font-family:var(--font-body) !important; color:var(--ds-txt) !important; } .dsn-mono,.elementor-widget-text-editor .dsn-mono{ font-family:var(--font-mono) !important; }*/ /* Titres de section H2 : filet rouge animé façon « scan » */ h2::after, .elementor-widget-heading h2.elementor-heading-title::after{ content:''; display:block; width:72px; height:2px; margin:.7em auto 0; background:linear-gradient(90deg,transparent,var(--ds-r) 40%,var(--ds-rl) 60%,transparent); background-size:200% 100%; animation:ds-scan 4.5s ease-in-out infinite; } @keyframes ds-scan{ 0%,100%{ background-position:200% 0; opacity:.55; } 50%{ background-position:0 0; opacity:1; } } /* Étiquette « ops » (kicker au-dessus d'un titre) : ajouter la classe .dsn-kicker */ .dsn-kicker{ font-family:var(--font-mono) !important; font-size:.72rem !important; font-weight:600 !important; text-transform:uppercase; letter-spacing:.28em; color:var(--ds-r) !important; } /* Données techniques (IDs, montants, coordonnées) : classe .dsn-mono */ .dsn-mono{ font-family:var(--font-mono) !important; letter-spacing:.02em; } /* ══════════════════════════ BOUTONS ══════════════════════════ */ /* Base commune : boutons Elementor + utilitaire générique .dsn-btn */ .elementor-button, .dsn-btn{ --btn-bg:linear-gradient(135deg,var(--ds-r) 0%,var(--ds-rk) 100%); --btn-bd:var(--ds-rl); display:inline-flex !important; align-items:center; justify-content:center; gap:.55em; font-family:var(--font-display) !important; font-weight:600 !important; font-size:.92rem !important; text-transform:uppercase !important; letter-spacing:.08em !important; line-height:1 !important; color:#fff !important; text-decoration:none; cursor:pointer; padding:14px 30px !important; border-radius:var(--r-sharp) !important; background:var(--btn-bg) !important; border:1px solid var(--btn-bd) !important; box-shadow:0 6px 18px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.14) !important; transition:transform .18s cubic-bezier(.4,0,.2,1), box-shadow .18s ease, filter .18s ease, background .18s ease !important; position:relative; overflow:hidden; } /* Balayage lumineux au survol */ .elementor-button::before, .dsn-btn::before{ content:''; position:absolute; top:0; left:-120%; width:60%; height:100%; background:linear-gradient(120deg,transparent,rgba(255,255,255,.18),transparent); transition:left .5s ease; pointer-events:none; } .elementor-button:hover, .dsn-btn:hover{ transform:translateY(-2px); filter:brightness(1.08); box-shadow:0 0 26px var(--ds-glow), 0 10px 24px rgba(0,0,0,.45) !important; } .elementor-button:hover::before, .dsn-btn:hover::before{ left:130%; } .elementor-button:active, .dsn-btn:active{ transform:translateY(1px); box-shadow:inset 0 3px 8px rgba(0,0,0,.4) !important; } .elementor-button:focus-visible, .dsn-btn:focus-visible{ outline:2px solid var(--ds-rl); outline-offset:2px; } /* — Variantes (dans Elementor : widget Bouton > Avancé > Classes CSS) — */ /* Secondaire (ardoise) */ .dsn-btn.is-secondary,.elementor-button.is-secondary{ --btn-bg:var(--ds-btn); --btn-bd:var(--ds-btn-bdr); color:var(--ds-txt) !important; box-shadow:0 4px 14px rgba(0,0,0,.3) !important; } .dsn-btn.is-secondary:hover,.elementor-button.is-secondary:hover{ --btn-bd:var(--ds-rl); box-shadow:0 0 20px var(--ds-glow),0 6px 16px rgba(0,0,0,.4) !important; } /* Fantôme (contour) */ .dsn-btn.is-ghost,.elementor-button.is-ghost{ --btn-bg:rgba(10,13,18,.5); --btn-bd:var(--ds-bdrh); color:var(--ds-txt) !important; box-shadow:none !important; } .dsn-btn.is-ghost:hover,.elementor-button.is-ghost:hover{ --btn-bg:rgba(204,40,40,.14); --btn-bd:var(--ds-rl); box-shadow:0 0 18px var(--ds-glow) !important; } /* Coupe biseautée sci-fi (option) */ .dsn-btn.is-cut,.elementor-button.is-cut{ border-radius:0 !important; clip-path:polygon(var(--cut) 0,100% 0,100% calc(100% - var(--cut)),calc(100% - var(--cut)) 100%,0 100%,0 var(--cut)); } /* Tailles */ .dsn-btn.is-lg,.elementor-button.is-lg{ padding:18px 40px !important; font-size:1.02rem !important; } .dsn-btn.is-sm,.elementor-button.is-sm{ padding:9px 18px !important; font-size:.8rem !important; } /* ══════════════════════════ CARTES / PANNEAUX (façon FORGE) ══════════════════════════ */ .dsn-card{ background:linear-gradient(165deg,var(--ds-bg1),var(--ds-bg)); border:1px solid var(--ds-bdr); clip-path:polygon(var(--cut) 0,100% 0,100% calc(100% - var(--cut)),calc(100% - var(--cut)) 100%,0 100%,0 var(--cut)); padding:22px; transition:border-color .2s ease, box-shadow .2s ease, transform .2s ease; } .dsn-card:hover{ border-color:var(--ds-bdrh); box-shadow:0 0 26px rgba(204,40,40,.14); transform:translateY(-3px); } /* Surface lisible : envelopper un bloc de texte posé sur le fond animé */ .dsn-surface{ background:var(--ds-surface); backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px); border:1px solid var(--ds-bdr); border-radius:var(--r-card); padding:clamp(20px,3vw,40px); } /* Léger relief au survol des widgets « cartes » d'Elementor (icon-box / image-box) */ .elementor-widget-icon-box,.elementor-widget-image-box{ transition:transform .22s ease, filter .22s ease; } .elementor-widget-icon-box:hover,.elementor-widget-image-box:hover{ transform:translateY(-4px); filter:drop-shadow(0 8px 20px var(--ds-glow)); } /* ══════════════════════════ COMPTEURS / STATS ══════════════════════════ */ .elementor-counter .elementor-counter-number{ font-family:var(--font-display) !important; font-weight:700 !important; font-size:clamp(2.4rem,4vw,3.6rem) !important; color:#fff !important; text-shadow:0 0 24px var(--ds-glow); } .elementor-counter .elementor-counter-title{ font-family:var(--font-mono) !important; text-transform:uppercase; letter-spacing:.18em; color:var(--ds-txt3) !important; font-size:.8rem !important; } /* ══════════════════════════ NAVIGATION (léger, non intrusif) ══════════════════════════ */ .site-header .site-navigation ul.menu li a, .mega-menu-item > a.mega-menu-link{ font-family:var(--font-display) !important; text-transform:uppercase; letter-spacing:.05em; font-weight:600; } /* ══════════════════════════ SCROLLBAR ══════════════════════════ */ *{ scrollbar-color:var(--ds-r) var(--ds-bg1); } ::-webkit-scrollbar{ width:10px; height:10px; } ::-webkit-scrollbar-track{ background:var(--ds-bg1); } ::-webkit-scrollbar-thumb{ background:var(--ds-r); border-radius:5px; border:2px solid var(--ds-bg1); } ::-webkit-scrollbar-thumb:hover{ background:var(--ds-rl); } /* ══════════════════════════ MOTION / A11Y ══════════════════════════ */ @media (prefers-reduced-motion:reduce){ *,*::before,*::after{ animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; } } /* ══════════════════════════ RESPONSIVE ══════════════════════════ */ @media (max-width:768px){ body{ font-size:15px; } .dsn-btn,.elementor-button{ padding:12px 22px !important; } } /* ═══════════════════════════════════════════════════════════════════════════ COMPATIBILITÉ PLUGINS — repris de l'ancien CSS (post 540) But : les plugins déjà stylés (hors thème / hors Elementor) gardent EXACTEMENT leur lisibilité et leur colorimétrie, même une fois l'ancien fichier supprimé. Ces règles sont volontairement en fin de fichier pour l'emporter sur la base FORGE. Les variables d'origine sont réintroduites ci-dessous (valeurs d'origine, inchangées). NB : le rouge d'origine est #AF3838 (≠ #CC2828 FORGE). Pour tout unifier plus tard, il suffira de pointer --primary-red* vers --ds-r/--ds-rk/--ds-rl. ═══════════════════════════════════════════════════════════════════════════ */ :root{ --primary-red:#AF3838; --primary-red-dark:#8B2C2C; --primary-red-light:#D14545; --primary-red-glow:rgba(175,56,56,.3); --dark-bg:rgba(15,15,20,.95); --dark-bg-light:rgba(25,25,35,.9); --dark-bg-lighter:rgba(35,35,45,.85); --text-primary:#E5E7EB; --text-secondary:#9CA3AF; --text-muted:#6B7280; --border-color:rgba(175,56,56,.2); --border-glow:rgba(175,56,56,.4); } /* La base FORGE (titres Chakra Petch en capitales + filet rouge) ne s'impose PAS dans les applications de plugins : on rend leurs titres neutres et lisibles (ils gèrent leur couleur). */ :is(.tutor-wrap,.woocommerce,.woocommerce-page,.um,.wpem-main,.single_event_listing,.wpem-single-event-page,.em) :is(h1,h2,h3,h4,h5,h6,.elementor-heading-title){ text-transform:none; letter-spacing:normal; } :is(.tutor-wrap,.woocommerce,.woocommerce-page,.um,.wpem-main,.single_event_listing,.wpem-single-event-page,.em) :is(h1,h2,h3,h4,h5,h6)::after{ display:none !important; } /* ── My Sticky Bar ─────────────────────────────────────────────────────────── */ #mysticky-nav.wrapfixed .myfixed{height:120px;background:var(--dark-bg);border-bottom:2px solid var(--primary-red);box-shadow:0 4px 20px rgba(0,0,0,.3);} #mysticky-wrap .wrapfixed .site-header{padding-block-start:.5rem;} #mysticky-wrap .wrapfixed #site-header .header-inner{margin-top:0;height:50px;} #mysticky-wrap .wrapfixed #site-header .header-inner .site-branding a{width:50px;} /* ── Boutons .button / HelloAsso (#af-wrapper) ─────────────────────────────── */ .button,#af-wrapper .button{font-family:"Roboto",Sans-serif;font-size:16px;font-weight:600;text-transform:capitalize;line-height:1em;color:#FFF !important;background:linear-gradient(135deg,var(--primary-red) 0%,var(--primary-red-dark) 100%);border:2px solid var(--primary-red-light);border-radius:20px;padding:10px 20px;text-shadow:0 0 20px rgba(0,0,0,.3);transition:all .3s cubic-bezier(.4,0,.2,1);display:inline-block;text-align:center;position:relative;overflow:hidden;letter-spacing:.5px;} .button::before,#af-wrapper .button::before{content:'';position:absolute;inset:0;background:#fff;opacity:0;transition:opacity .3s;} .button:hover,#af-wrapper .button:hover{border-color:var(--primary-red-light);transform:translateY(-2px);box-shadow:0 0 20px var(--primary-red-glow),0 4px 12px rgba(0,0,0,.3);} .button:hover::before{opacity:.15;} /* ── Ultimate Member : boutons + soumission ───────────────────────────────── */ #um-submit-btn{display:none !important;} #promote-user,.um-button,input[type="submit"].um-button,.um-button.um-alt,#af-wrapper .button-normal,#af-wrapper .button-red,.button.button-neutral{border-radius:20px !important;font-size:16px !important;font-weight:600 !important;color:#FFF !important;background:linear-gradient(135deg,var(--primary-red) 0%,var(--primary-red-dark) 100%) !important;border:2px solid var(--primary-red-light) !important;transition:all .3s cubic-bezier(.4,0,.2,1);letter-spacing:.5px;text-transform:uppercase;box-shadow:0 2px 8px rgba(0,0,0,.2);} .um-button:hover,#af-wrapper .button-normal:hover,#af-wrapper .button-red:hover,.button.button-neutral:hover,#af-wrapper .button:hover{transform:translateY(-2px);color:#FFF !important;font-weight:700 !important;box-shadow:0 0 20px var(--primary-red-glow),0 4px 12px rgba(0,0,0,.3);} /* ── Champs de formulaire (Ultimate Member + select2) ─────────────────────── */ .select2-container .select2-choice,.select2-container-multi .select2-choices,.select2-drop,.select2-drop-active,.select2-drop.select2-drop-above,.um .um-form input[type="number"],.um .um-form input[type="password"],.um .um-form input[type="search"],.um .um-form input[type="tel"],.um .um-form input[type="text"],.um .um-form textarea,.um .upload-progress{border-radius:20px;background:var(--dark-bg);border:1px solid var(--border-color);color:var(--text-primary);transition:all .3s cubic-bezier(.4,0,.2,1);} .um .um-form input:focus,.um .um-form textarea:focus{outline:none;border-color:var(--primary-red);box-shadow:0 0 16px var(--primary-red-glow);} /* ── Éditeur TinyMCE / wp-link ────────────────────────────────────────────── */ .mce-toolbar .mce-btn-group .mce-btn,.qt-dfw,.mce-window .mce-btn.mce-primary,.mce-window .mce-btn{background:transparent !important;border:none !important;box-shadow:none !important;margin-right:5px !important;} textarea.tutor-form-control,.tutor-comment-text{color:#000;} /* ── WooCommerce (+ Printful) ─────────────────────────────────────────────── */ .single-product,.woocommerce-cart,.woocommerce-checkout,.woocommerce-page{background-image:url("https://dawnstar.fr/wp-content/uploads/2025/06/star-citizen-video-game-concept-art-z5-2048x1152.jpg");background-size:cover;background-attachment:fixed;} .wp-block-woocommerce-cart-line-items-block{border:solid 4px !important;border-color:var(--primary-red) !important;border-radius:12px;box-shadow:0 0 20px var(--primary-red-glow);} #main .product,.wp-block-woocommerce-cart,.wp-block-woocommerce-checkout,.woocommerce-order,.woocommerce-MyAccount-content,.woocommerce-MyAccount-navigation{padding:25px;background:var(--dark-bg);border-radius:25px;margin-bottom:25px !important;border:1px solid var(--border-color);box-shadow:0 8px 24px rgba(0,0,0,.4);backdrop-filter:blur(10px);} .added_to_cart{background:linear-gradient(135deg,var(--primary-red) 0%,var(--primary-red-dark) 100%) !important;color:#fff !important;border-radius:25px !important;padding:12px 24px 13px !important;border:2px solid var(--primary-red-light) !important;transition:all .3s cubic-bezier(.4,0,.2,1);} .added_to_cart:hover{transform:translateY(-2px);box-shadow:0 0 20px var(--primary-red-glow);} .variations .value select{background:#fff !important;border-radius:8px;} .single_add_to_cart_button{background:linear-gradient(135deg,var(--primary-red) 0%,var(--primary-red-dark) 100%);border:2px solid var(--primary-red-light);transition:all .3s cubic-bezier(.4,0,.2,1);} .single_add_to_cart_button:hover{transform:translateY(-2px);box-shadow:0 0 20px var(--primary-red-glow);} .woocommerce div.product div.images .flex-control-thumbs li{width:10% !important;} .pswp__button,.pf-size-guide-modal__close{border-style:none !important;} /* ── Ultimate Member : profils & annuaire ─────────────────────────────────── */ .um-profile-meta a,.um .um-field-label,.um:not(.um-admin),.um .um-field-label{color:#fff !important;} .um-profile.um .um-profile-headericon a{color:#3ba1da !important;transition:all .3s cubic-bezier(.4,0,.2,1);} .um-profile.um .um-profile-headericon a:hover{color:var(--primary-red) !important;text-shadow:0 0 10px var(--primary-red-glow);} .um-directory .um-members-wrapper .um-members.um-members-grid .um-member{background:var(--dark-bg) !important;border:1px solid var(--border-color);border-radius:12px;transition:all .3s cubic-bezier(.4,0,.2,1);} .um-directory .um-members-wrapper .um-members.um-members-grid .um-member:hover{border-color:var(--border-glow);box-shadow:0 0 20px var(--primary-red-glow);transform:translateY(-4px);} .um-directory .um-member-directory-header .um-member-directory-header-row .um-filtered-line .um-members-filter-tag{background:linear-gradient(135deg,var(--primary-red) 0%,var(--primary-red-dark) 100%) !important;border-radius:12px;border:1px solid var(--primary-red-light);} .um-profile.um-viewing .um-field-label{text-transform:uppercase;font-weight:600;letter-spacing:.5px;} .um-directory .um-members-wrapper .um-members.um-members-grid .um-member .um-member-card .um-members-edit-btn a.um-edit-profile-btn{padding:5px !important;transition:all .3s cubic-bezier(.4,0,.2,1);} /* ── Responsive plugins (Events Manager, Tutor, UM) ───────────────────────── */ @media (max-width:767px){ .em.em-calendar section{display:flex;flex-wrap:wrap;} .em.em-calendar .em-cal-head{display:none;} .em.em-calendar .em-cal-nav .month{text-align:center;} .em.pixelbones a{color:#fff !important;} .em.em-calendar.preview-tooltips .em-cal-event-content .em-item-actions .button{padding:10px !important;margin:5px !important;} } @media (min-width:800px){ .tutor-course-details-page .tutor-course-details-tab .tutor-is-sticky,.tutor-nav:not(.tutor-nav-pills):not(.tutor-nav-tabs){border-radius:50px;} .um-250.um .um-profile-body{max-width:100% !important;} } /* ═══════════════════ FIN COMPATIBILITÉ PLUGINS ═══════════════════ */ /* Polices locales (licence SIL OFL 1.1, voir fonts/OFL.txt), jeu latin. Mêmes adresses que le préchargement du plugin (sans version), pour éviter un double téléchargement. */ @font-face{font-family:"DNR Display";src:url("/wp-content/plugins/dawnstar-design/assets/fonts/chakra-petch-500.woff2") format("woff2");font-weight:500;font-style:normal;font-display:swap} @font-face{font-family:"DNR Display";src:url("/wp-content/plugins/dawnstar-design/assets/fonts/chakra-petch-600.woff2") format("woff2");font-weight:600;font-style:normal;font-display:swap} @font-face{font-family:"DNR Display";src:url("/wp-content/plugins/dawnstar-design/assets/fonts/chakra-petch-700.woff2") format("woff2");font-weight:700;font-style:normal;font-display:swap} @font-face{font-family:"DNR Text";src:url("/wp-content/plugins/dawnstar-design/assets/fonts/ibm-plex-sans-400.woff2") format("woff2");font-weight:400;font-style:normal;font-display:optional} @font-face{font-family:"DNR Text";src:url("/wp-content/plugins/dawnstar-design/assets/fonts/ibm-plex-sans-500.woff2") format("woff2");font-weight:500;font-style:normal;font-display:optional} @font-face{font-family:"DNR Text";src:url("/wp-content/plugins/dawnstar-design/assets/fonts/ibm-plex-sans-600.woff2") format("woff2");font-weight:600;font-style:normal;font-display:optional} @font-face{font-family:"DNR Mono";src:url("/wp-content/plugins/dawnstar-design/assets/fonts/ibm-plex-mono-400.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap} @font-face{font-family:"DNR Mono";src:url("/wp-content/plugins/dawnstar-design/assets/fonts/ibm-plex-mono-500.woff2") format("woff2");font-weight:500;font-style:normal;font-display:swap} /* Texte courant (DNR Text) en font-display: optional : s'il n'est pas là au premier affichage, le repli ajusté reste pour ce chargement (aucun décalage, les paragraphes ne changent jamais de nombre de lignes) ; il sert depuis le cache ensuite. Titres et libellés en swap : leurs replis gardent la même mise en page (mesuré par tools/test_cls_polices.py). */ /* Replis locaux aux métriques ajustées (CLS) : pendant le chargement, Arial (Windows, macOS, iOS) ou Liberation (Linux) occupe la même place que nos polices ; aucun décalage quand elles arrivent. Calculés par tools/replis.py. */ @font-face{font-family:"DNR Text Repli";src:local("Arial"),local("ArialMT"),local("Liberation Sans");font-weight:400;font-style:normal;size-adjust:100.02%;ascent-override:102.48%;descent-override:27.49%;line-gap-override:0.00%; font-display:swap;} @font-face{font-family:"DNR Text Repli";src:local("Arial"),local("ArialMT"),local("Liberation Sans");font-weight:500;font-style:normal;size-adjust:103.01%;ascent-override:99.50%;descent-override:26.70%;line-gap-override:0.00%; font-display:swap;} @font-face{font-family:"DNR Text Repli";src:local("Arial Bold"),local("Arial-BoldMT"),local("Liberation Sans Bold");font-weight:600;font-style:normal;size-adjust:96.50%;ascent-override:106.22%;descent-override:28.50%;line-gap-override:0.00%; font-display:swap;} @font-face{font-family:"DNR Display Repli";src:local("Arial Bold"),local("Arial-BoldMT"),local("Liberation Sans Bold");font-weight:500;font-style:normal;size-adjust:88.94%;ascent-override:111.54%;descent-override:34.63%;line-gap-override:0.00%; font-display:swap;} @font-face{font-family:"DNR Display Repli";src:local("Arial Bold"),local("Arial-BoldMT"),local("Liberation Sans Bold");font-weight:600;font-style:normal;size-adjust:91.26%;ascent-override:108.70%;descent-override:33.75%;line-gap-override:0.00%; font-display:swap;} @font-face{font-family:"DNR Display Repli";src:local("Arial Bold"),local("Arial-BoldMT"),local("Liberation Sans Bold");font-weight:700;font-style:normal;size-adjust:94.16%;ascent-override:105.35%;descent-override:32.71%;line-gap-override:0.00%; font-display:swap;} @font-face{font-family:"DNR Mono Repli";src:local("Courier New"),local("CourierNewPSMT"),local("Liberation Mono");font-style:normal;ascent-override:102.50%;descent-override:27.50%;line-gap-override:0.00%; font-display:swap;} /* Jetons du système « Transmission » (spec 4.1, 4.2 et 6). Seul bloc global du nouveau système avec les @font-face. */ :root{ --dnr-bg:#070A0F;--dnr-bg2:#0B0F16; --dnr-ink:#F4F6FA;--dnr-txt:#D2DAE6;--dnr-txt2:#BCC7D8;--dnr-txt3:#AEBACB;--dnr-mut:#8391A6; --dnr-line:rgba(238,242,248,.12);--dnr-line2:rgba(238,242,248,.22); --dnr-red:#CC2828;--dnr-red-h:#E03838;--dnr-red-l:#FF6B5E;--dnr-ok:#31D07F;--dnr-gold:#E0A640; /* accent (plan 3, spec 5.1) : rouge par défaut, changé par data-dnr-ton (55-tons.css) ; triplets pour les transparences */ --dnr-acc:#CC2828;--dnr-acc-l:#FF6B5E;--dnr-acc-rgb:204,40,40;--dnr-acc-m-rgb:232,69,60;--dnr-acc-l-rgb:255,107,94; --dnr-r1:#9AA7BA;--dnr-r2:#5FC4AE;--dnr-r3:#6F9BF5;--dnr-r4:#B48CF5;--dnr-r5:#E0A640; --dnr-disp:"DNR Display","Chakra Petch","DNR Display Repli","Segoe UI",sans-serif; --dnr-body:"DNR Text","IBM Plex Sans","DNR Text Repli","Segoe UI",Roboto,sans-serif; --dnr-mono:"DNR Mono","IBM Plex Mono","DNR Mono Repli",Consolas,"SF Mono",monospace; --dnr-gut:clamp(16px,4.5vw,64px); --dnr-t1:180ms;--dnr-t2:320ms;--dnr-t3:640ms;--dnr-t4:1100ms; --dnr-ease:cubic-bezier(.16,1,.3,1);--dnr-ease-io:cubic-bezier(.65,0,.35,1);--dnr-stagger:70ms; } /* Base du nouveau système, limitée à .dnr-page (les pages non converties ne changent pas). Le style global impose la police des titres avec !important via --font-display : on redéfinit la variable ici plutôt que de surenchérir. */ .dnr-page{--font-display:var(--dnr-disp);--font-body:var(--dnr-body);position:relative;isolation:isolate;color:var(--dnr-txt);font:400 17px/1.7 var(--dnr-body);-webkit-font-smoothing:antialiased;overflow-x:clip;text-align:left} .dnr-page *,.dnr-page *::before,.dnr-page *::after{box-sizing:border-box} /* Pleine largeur dans un conteneur Elementor : sa marge intérieure (--padding-left/right, héritées, 10 px par défaut) est annulée ; hors Elementor ces variables n'existent pas et la marge reste nulle. */ .dnr-page{margin-inline:calc(-1 * var(--padding-left, 0px)) calc(-1 * var(--padding-right, 0px))} .dnr-page :is(h1,h2,h3,h4){margin:0;color:var(--dnr-ink);font-family:var(--dnr-disp);font-weight:700;text-transform:uppercase;letter-spacing:0;line-height:1.05;text-wrap:balance} .dnr-page :is(h1,h2)::after{content:none} .dnr-page h2{font-size:clamp(32px,3.6vw,52px);line-height:1.02} .dnr-page h3{font-size:clamp(20px,1.6vw,22px);font-weight:600;line-height:1.2} .dnr-page p{margin:0} .dnr-page :is(ul,ol){margin:0;padding-left:1.2em} .dnr-page li+li{margin-top:.35em} .dnr-page a{color:var(--dnr-ink);text-decoration-thickness:1px;text-underline-offset:3px} .dnr-page a:hover{color:var(--dnr-acc-l)} .dnr-page :focus-visible{outline:2px solid var(--dnr-acc-l);outline-offset:3px} .dnr-page img{display:block;max-width:100%;height:auto} .dnr-page strong{color:var(--dnr-ink);font-weight:600} .dnr-page code{font:400 .9em/1 var(--dnr-mono);color:var(--dnr-ink)} .dnr-page ::selection{background:var(--dnr-acc);color:#fff} /* Libellés techniques : texte réel (.dnr-lab) ou libellé décoratif porté par data-dnr-label (pas dans le texte de la page) */ .dnr-page .dnr-lab,.dnr-page [data-dnr-label]::before{font:500 12px/1.4 var(--dnr-mono);letter-spacing:.22em;text-transform:uppercase;color:var(--dnr-mut)} .dnr-page [data-dnr-label]::before{content:attr(data-dnr-label);content:attr(data-dnr-label) / "";display:block;color:var(--dnr-acc-l)} .dnr-page .dnr-lab--r{color:var(--dnr-acc-l)} /* Numéro décoratif devant un libellé réel :

Le point de départ

*/ .dnr-page .dnr-lab[data-dnr-label]::before{display:inline;margin-right:.6em} .dnr-page :is(.dnr-lab,.dnr-small) b{color:var(--dnr-acc-l);font-weight:inherit} .dnr-page .dnr-lab--ok{color:var(--dnr-ok)} .dnr-page .dnr-small{font-size:14px;color:var(--dnr-mut)} .dnr-page .dnr-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--dnr-ok);margin-right:8px;vertical-align:1px} .dnr-page button{white-space:normal} /* v2.0.1 : le thème ([type=button], button) interdit le retour à la ligne des boutons */ /* Mise en page (spec 4.3) : grille de 12 colonnes, gouttière 24 px, marges 16 à 64 px, ruptures 1 024 et 560 px. */ .dnr-page .dnr-wrap{padding-inline:var(--dnr-gut)} .dnr-page .dnr-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:24px} .dnr-page .dnr-read{max-width:68ch} .dnr-page .dnr-lead{max-width:68ch;font-size:19px;line-height:1.8;color:var(--dnr-txt2)} /* Zone de lecture : sommaire à gauche (2 colonnes), contenu sur 10 colonnes (zone du sommaire réduite de moitié, demande de zygo du 28 sept. 2026) */ .dnr-page .dnr-reading{padding-block:88px 0} /* --dnr-top : hauteur d'un éventuel en-tête collant du site (0 par défaut), seul réglage des éléments collants et des ancres */ .dnr-page .dnr-reading>.dnr-toc{grid-column:1/span 2;grid-row:1/span 9;position:sticky;top:calc(var(--dnr-top, 0px) + 110px);align-self:start} .dnr-page .dnr-art{grid-column:3/span 10;display:flex;flex-direction:column;gap:120px;min-width:0} .dnr-page .dnr-sec{display:flex;flex-direction:column;gap:26px;scroll-margin-top:calc(var(--dnr-top, 0px) + 110px)} .dnr-page .dnr-shead{display:flex;flex-direction:column;gap:14px} /* Avec sommaire et bandeau (maquette validée) : le sommaire colle sur les lignes 1 à 3, la lecture est en lignes 1 et 3, le bandeau occupe toute la largeur en ligne 2 et le sommaire passe par-dessus (demande de zygo, 28 sept. 2026, v2.0.1) */ .dnr-page .dnr-reading.dnr-grid>.dnr-art{grid-row:1} .dnr-page .dnr-reading.dnr-grid>.dnr-art--2{grid-row:3;padding-top:120px} /* Désactivé le 28 sept. 2026 (v2.0.1) : Elementor remet à 0 les marges de toute
d'un widget (.elementor .elementor-widget:not(...):not(...) figure, plus forte) ; le bandeau perdait sa marge et le bord à bord. .dnr-page .dnr-reading.dnr-grid>.dnr-band{grid-column:1/-1;grid-row:2;z-index:2;margin:120px calc(-1 * var(--dnr-gut)) 0} */ .dnr-page.dnr-page .dnr-reading.dnr-grid>.dnr-band{grid-column:1/-1;grid-row:2;z-index:2;margin:120px calc(-1 * var(--dnr-gut)) 0} .dnr-page .dnr-reading>.dnr-toc{z-index:3} @media (max-width:1024px){ .dnr-page .dnr-reading{display:block;padding-block:0} .dnr-page .dnr-art{gap:80px;padding-top:48px} .dnr-page .dnr-sec{scroll-margin-top:calc(var(--dnr-top, 0px) + 140px)} .dnr-page .dnr-reading>.dnr-toc{top:var(--dnr-top, 0px);z-index:40} .dnr-page .dnr-reading.dnr-grid>.dnr-art--2{padding-top:80px} /* Désactivé le 28 sept. 2026 (v2.0.1), même raison que la règle ordinateur : .dnr-page .dnr-reading.dnr-grid>.dnr-band{margin-top:80px} */ .dnr-page.dnr-page .dnr-reading.dnr-grid>.dnr-band{margin-top:80px} } /* Composants du système « Transmission » (spec 5), repris de la maquette validée. États d'animation : 60-motion.css. */ /* ---------- Ciel en couches (module ciel) ---------- */ .dnr-page .dnr-sky{position:fixed;inset:0;z-index:-1;overflow:hidden;pointer-events:none} .dnr-page .dnr-sky i{position:absolute;left:0;right:0;top:0;height:calc(100% + 1024px);background-repeat:repeat} @media (min-width:1025px){.dnr-page .dnr-sky i{will-change:transform}} /* ---------- Boutons ---------- */ .dnr-page .dnr-btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:0 26px;overflow:hidden;font:600 15px/1 var(--dnr-disp);letter-spacing:.14em;text-transform:uppercase;text-decoration:none;cursor:pointer;border:1px solid transparent;border-radius:0;background:transparent;color:var(--dnr-ink);transition:background var(--dnr-t2) var(--dnr-ease),color var(--dnr-t2) var(--dnr-ease),border-color var(--dnr-t2) var(--dnr-ease),transform var(--dnr-t1) var(--dnr-ease)} /* v2.6.0 : bouton qui passe sur deux lignes (mobile) : lignes équilibrées et centrées, jamais « ▸▸ » seul sur la dernière ; interligne desserré (une seule ligne : hauteur du bouton inchangée, 52 px) */ .dnr-page .dnr-btn{text-wrap:balance;text-align:center;line-height:1.25} .dnr-page .dnr-btn--p{background:var(--dnr-red);color:#fff} .dnr-page .dnr-btn--p:hover{background:var(--dnr-red-h);color:#fff} .dnr-page .dnr-btn--o{border-color:var(--dnr-line2);color:var(--dnr-ink)} .dnr-page .dnr-btn--o:hover{border-color:var(--dnr-acc-l);color:var(--dnr-ink)} .dnr-page .dnr-btn:active{transform:scale(.98)} .dnr-page .dnr-btn.is-done{border-color:var(--dnr-ok);color:var(--dnr-ok)} .dnr-page .dnr-btns{display:flex;flex-wrap:wrap;gap:12px} /* ---------- Puces ---------- */ .dnr-page .dnr-chips{display:flex;flex-wrap:wrap;gap:6px;margin:0;padding:0;list-style:none} .dnr-page .dnr-chips li{margin:0;font:400 12px/1 var(--dnr-mono);color:#CFD8E6;background:rgba(238,242,248,.06);border:1px solid var(--dnr-line);padding:6px 9px} .dnr-page .dnr-chipset{display:flex;flex-wrap:wrap;gap:8px} .dnr-page .dnr-chipset button,.dnr-page .dnr-tabs [role=tab]{min-height:44px;padding:0 14px;font:500 12px/1 var(--dnr-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--dnr-txt3);background:transparent;border:1px solid var(--dnr-line2);border-radius:0;cursor:pointer;transition:color var(--dnr-t1),border-color var(--dnr-t1),background var(--dnr-t1)} .dnr-page .dnr-chipset button:hover,.dnr-page .dnr-tabs [role=tab]:hover{color:var(--dnr-ink);border-color:var(--dnr-acc-l);background:transparent} .dnr-page .dnr-chipset button[aria-pressed=true],.dnr-page .dnr-tabs [role=tab][aria-selected=true]{color:var(--dnr-ink);border-color:var(--dnr-acc-l);background:rgba(var(--dnr-acc-rgb),.14)} /* ---------- Ouverture ---------- */ .dnr-page .dnr-hero{position:relative;min-height:clamp(560px,82vh,820px);display:flex;flex-direction:column;justify-content:flex-end;overflow:hidden;isolation:isolate;padding:clamp(110px,14vh,150px) calc(var(--dnr-gut) + 24px) clamp(40px,7vw,96px)} /* Désactivé le 28 sept. 2026 (v2.0.1) : image d'ouverture un peu moins foncée (demande de zygo). .dnr-page .dnr-hero__img{position:absolute;left:0;right:0;top:-6%;width:100%;height:112%;max-width:none;z-index:-3;object-fit:cover;object-position:55% 38%;filter:saturate(.75) contrast(1.1) brightness(.72)} */ .dnr-page .dnr-hero__img{position:absolute;left:0;right:0;top:-6%;width:100%;height:112%;max-width:none;z-index:-3;object-fit:cover;object-position:55% 38%;filter:saturate(.8) contrast(1.1) brightness(.86)} .dnr-page .dnr-hero__fx{position:absolute;inset:0;z-index:-2;pointer-events:none;background:linear-gradient(180deg,rgba(7,10,15,.85) 0%,rgba(7,10,15,.1) 22%,rgba(7,10,15,.15) 48%,rgba(7,10,15,.95) 90%,var(--dnr-bg) 100%),linear-gradient(90deg,rgba(7,10,15,.85) 0%,rgba(7,10,15,.2) 55%,rgba(7,10,15,.05) 100%),radial-gradient(60% 50% at 18% 78%,rgba(var(--dnr-acc-rgb),.22),rgba(var(--dnr-acc-rgb),0) 70%)} .dnr-page .dnr-hero__fx::before{content:"";position:absolute;left:clamp(12px,2.8vw,40px);right:clamp(12px,2.8vw,40px);top:clamp(16px,2.8vw,40px);bottom:clamp(16px,2.8vw,40px);border:1px solid rgba(238,242,248,.1);background:linear-gradient(var(--dnr-acc-l),var(--dnr-acc-l)) 0 0/18px 2px no-repeat,linear-gradient(var(--dnr-acc-l),var(--dnr-acc-l)) 0 0/2px 18px no-repeat,linear-gradient(var(--dnr-acc-l),var(--dnr-acc-l)) 100% 100%/18px 2px no-repeat,linear-gradient(var(--dnr-acc-l),var(--dnr-acc-l)) 100% 100%/2px 18px no-repeat} .dnr-page .dnr-hero::before{position:absolute;left:calc(clamp(12px,2.8vw,40px) + 24px);top:calc(clamp(16px,2.8vw,40px) + 20px);color:#CFD8E6} .dnr-page .dnr-hero[data-dnr-status]::after{content:"\25CF\00A0" attr(data-dnr-status);content:"\25CF\00A0" attr(data-dnr-status) / "";position:absolute;right:calc(clamp(12px,2.8vw,40px) + 24px);top:calc(clamp(16px,2.8vw,40px) + 20px);font:500 12px/1.4 var(--dnr-mono);letter-spacing:.22em;text-transform:uppercase;color:var(--dnr-ok)} .dnr-page .dnr-hero__body{display:flex;align-items:flex-end;justify-content:space-between;gap:40px} .dnr-page .dnr-hero__title{max-width:800px;display:flex;flex-direction:column;gap:20px} .dnr-page .dnr-hero h1{font-size:clamp(44px,7vw,104px);line-height:.92} .dnr-page .dnr-hero h1 small{display:block;margin-top:20px;font:600 clamp(13px,1.4vw,20px)/1.3 var(--dnr-disp);letter-spacing:.32em;color:var(--dnr-acc-l)} .dnr-page .dnr-hero__lead{max-width:600px;font-size:clamp(16px,1.35vw,19px);line-height:1.65;color:var(--dnr-txt2)} .dnr-page .dnr-brief{width:380px;flex-shrink:0;padding:24px 26px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 24px;background:rgba(9,12,18,.55);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid rgba(238,242,248,.14)} .dnr-page .dnr-stat{display:flex;flex-direction:column;gap:2px} .dnr-page .dnr-stat b{font:700 34px/1.1 var(--dnr-disp);color:var(--dnr-ink);font-variant-numeric:tabular-nums} .dnr-page .dnr-stat span{font-size:13px;line-height:1.4;color:var(--dnr-txt3)} .dnr-page .dnr-count{font-variant-numeric:tabular-nums} /* ---------- Encart ---------- */ .dnr-page .dnr-note{position:relative;max-width:720px;padding:22px 26px;display:flex;flex-direction:column;gap:8px;background:rgba(var(--dnr-acc-rgb),.08)} .dnr-page .dnr-note::after{content:"";position:absolute;inset:0;border:1px solid rgba(var(--dnr-acc-m-rgb),.55);pointer-events:none} .dnr-page .dnr-note p{font-size:19px;line-height:1.7;color:var(--dnr-ink)} .dnr-page .dnr-note--warn{background:rgba(224,166,64,.08)} .dnr-page .dnr-note--warn::before{color:var(--dnr-gold)} .dnr-page .dnr-note--warn::after{border-color:rgba(224,166,64,.5)} .dnr-page .dnr-note--ok::before{color:var(--dnr-ok)} .dnr-page .dnr-note--ok::after{border-color:rgba(49,208,127,.45)} .dnr-page .dnr-note--logo{display:grid;grid-template-columns:96px minmax(0,1fr);align-items:center;column-gap:22px} .dnr-page .dnr-note--logo{max-width:none} /* v2.4.0 : présentation sur toute la largeur de la colonne (Divisions, demande de zygo) */ .dnr-page .dnr-note--logo::before{grid-column:1/-1} .dnr-page .dnr-note__logo{width:96px;height:96px;object-fit:contain} /* ---------- Cartes ---------- */ .dnr-page .dnr-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px} .dnr-page .dnr-card{position:relative;overflow:hidden;padding:24px;display:flex;flex-direction:column;gap:14px;background:linear-gradient(180deg,rgba(238,242,248,.05),rgba(238,242,248,.015));border:1px solid rgba(238,242,248,.1)} .dnr-page .dnr-card::after{content:"";position:absolute;left:0;right:0;top:0;height:2px;background:rgba(238,242,248,.35);transform-origin:0 50%} /* Désactivé le 28 sept. 2026 (zygo) : sans interaction, la première carte ne doit pas sembler sélectionnée. .dnr-page .dnr-card:first-child::after{background:var(--dnr-red-l)} */ .dnr-page .dnr-card h3{font-size:22px} .dnr-page .dnr-card p:not(.dnr-lab){font-size:15px;line-height:1.65;color:var(--dnr-txt3)} .dnr-page .dnr-card .dnr-lab{color:var(--dnr-mut)} .dnr-page .dnr-card .dnr-lab--r{color:var(--dnr-acc-l)} .dnr-page .dnr-halo{position:absolute;left:0;top:0;width:360px;height:360px;margin:-180px 0 0 -180px;border-radius:50%;background:radial-gradient(closest-side,rgba(var(--dnr-acc-l-rgb),.13),rgba(var(--dnr-acc-l-rgb),0));pointer-events:none;opacity:0;transform:translate(var(--dnr-hx,0),var(--dnr-hy,0));transition:opacity var(--dnr-t2) var(--dnr-ease)} .dnr-page .is-halo>.dnr-halo{opacity:1} /* ---------- Lignes ---------- */ .dnr-page .dnr-rows{display:flex;flex-direction:column;border-top:1px solid var(--dnr-line)} .dnr-page .dnr-row{position:relative;display:grid;grid-template-columns:110px minmax(0,1fr) minmax(0,1.3fr);gap:24px;padding:22px 0;border-bottom:1px solid var(--dnr-line);align-items:baseline} .dnr-page .dnr-row h3{font-size:20px} .dnr-page .dnr-row p:not(.dnr-lab){font-size:15px;line-height:1.65;color:var(--dnr-txt3)} .dnr-page .dnr-row .dnr-lab{letter-spacing:.14em} /* ---------- Image et bandeau ---------- */ .dnr-page .dnr-fig{position:relative;margin:0;display:flex;flex-direction:column;gap:10px} .dnr-page .dnr-fig img{width:100%;aspect-ratio:21/9;object-fit:cover;border:1px solid var(--dnr-line);filter:saturate(.8) contrast(1.08) brightness(.82)} .dnr-page .dnr-fig::before,.dnr-page .dnr-fig::after{content:"";position:absolute;z-index:1;width:18px;height:18px;border:0 solid var(--dnr-acc-l);pointer-events:none} .dnr-page .dnr-fig::before{left:10px;top:10px;border-top-width:2px;border-left-width:2px} .dnr-page .dnr-fig::after{right:10px;top:calc(100% - 38px);border-bottom-width:2px;border-right-width:2px;display:none} .dnr-page .dnr-fig figcaption{font-size:14px;color:var(--dnr-mut)} .dnr-page .dnr-band{position:relative;margin:0;height:clamp(360px,48vw,580px);overflow:hidden;isolation:isolate;display:flex;align-items:center;justify-content:flex-end;padding-inline:calc(var(--dnr-gut) + 32px)} .dnr-page .dnr-band img{position:absolute;left:0;right:0;top:-14%;width:100%;height:128%;max-width:none;z-index:-2;object-fit:cover;object-position:50% 42%;filter:saturate(.85) brightness(.8)} .dnr-page .dnr-band::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,var(--dnr-bg) 0%,rgba(7,10,15,0) 16%,rgba(7,10,15,0) 82%,var(--dnr-bg) 100%),linear-gradient(90deg,rgba(7,10,15,0) 38%,rgba(7,10,15,.72) 58%,rgba(7,10,15,.9) 100%)} /* bandeau plus haut et plus clair à gauche, côté texte assombri (demande de zygo du 28 sept. 2026) */ /* v2.4.0 : cadrage plus bas (Divisions, demande de zygo) : l'image remonte de 25 px, marge basse de la parallaxe gardée */ .dnr-page .dnr-band--bas img{top:calc(-14% - 25px)} .dnr-page .dnr-band blockquote{margin:0;padding:0;border:0;width:min(560px,100%);display:flex;flex-direction:column;gap:16px;background:none} .dnr-page .dnr-band blockquote p{font:600 clamp(24px,2.6vw,36px)/1.22 var(--dnr-disp);color:var(--dnr-ink)} /* ---------- Onglets ---------- */ .dnr-page .dnr-tabs{display:flex;flex-direction:column;gap:22px} .dnr-page .dnr-tabs [role=tablist]{display:none;flex-wrap:wrap;gap:8px} html.dnr-js .dnr-page .dnr-tabs [role=tablist]{display:flex} .dnr-page .dnr-tabs [role=tabpanel]{display:flex;flex-direction:column;gap:14px;padding:24px;border:1px solid var(--dnr-line);background:rgba(238,242,248,.025)} .dnr-page .dnr-tabs [role=tabpanel][hidden]{display:none} /* ---------- Filtre et table ---------- */ .dnr-page .dnr-filter{display:flex;flex-direction:column;gap:14px} .dnr-page .dnr-filter__bar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px} .dnr-page .dnr-filter input[type=search]{min-height:44px;min-width:220px;padding:0 14px;font:400 15px/1 var(--dnr-body);color:var(--dnr-ink);background:rgba(238,242,248,.04);border:1px solid var(--dnr-line2);border-radius:0} .dnr-page .dnr-filter input[type=search]:focus-visible{border-color:var(--dnr-acc-l)} .dnr-page .dnr-filter [hidden]{display:none} .dnr-page .dnr-tbl{overflow-x:auto;border:1px solid var(--dnr-line)} .dnr-page .dnr-tbl table{width:100%;margin:0;border-collapse:collapse;font-size:15px;background:none} .dnr-page .dnr-tbl caption{padding:12px 18px;text-align:left;font:500 12px/1.4 var(--dnr-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--dnr-mut)} .dnr-page .dnr-tbl :is(th,td){text-align:left;padding:12px 18px;border:0;border-bottom:1px solid var(--dnr-line);background:none} .dnr-page .dnr-tbl :is(th,td){line-height:inherit} /* v2.0.1 : le thème impose 1.5 aux cellules (table td, table th), l'aperçu validé suit le texte */ .dnr-page .dnr-tbl thead th{font:500 11px/1.3 var(--dnr-mono);letter-spacing:.18em;text-transform:uppercase;color:var(--dnr-mut);background:rgba(238,242,248,.03)} .dnr-page .dnr-tbl tbody th{font-weight:600;color:var(--dnr-ink)} .dnr-page .dnr-tbl td{color:var(--dnr-txt3)} .dnr-page .dnr-rar{display:inline-flex;align-items:center;gap:8px;font:500 12px/1 var(--dnr-mono);letter-spacing:.06em;color:var(--dnr-r1)} .dnr-page .dnr-rar::before{content:"";width:8px;height:8px;background:currentColor} .dnr-page .dnr-rar[data-r="2"]{color:var(--dnr-r2)} .dnr-page .dnr-rar[data-r="3"]{color:var(--dnr-r3)} .dnr-page .dnr-rar[data-r="4"]{color:var(--dnr-r4)} .dnr-page .dnr-rar[data-r="5"]{color:var(--dnr-r5)} /* ---------- Réponses toutes faites ---------- */ .dnr-page .dnr-answers{display:flex;flex-direction:column;gap:14px} .dnr-page .dnr-answer{padding:18px 22px;border-left:2px solid var(--dnr-acc-l);background:rgba(238,242,248,.03);color:var(--dnr-txt2)} .dnr-page .dnr-answer[hidden]{display:none} /* ---------- FAQ ---------- */ .dnr-page .dnr-faq{display:flex;flex-direction:column;border-top:1px solid var(--dnr-line)} .dnr-page .dnr-q{border-bottom:1px solid var(--dnr-line)} .dnr-page .dnr-q summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:18px;min-height:44px;padding:22px 0;font:600 20px/1.35 var(--dnr-body);color:var(--dnr-ink)} .dnr-page .dnr-q summary::-webkit-details-marker{display:none} .dnr-page .dnr-q summary::after{content:"+";content:"+" / "";margin-left:auto;font:400 22px/1 var(--dnr-mono);color:var(--dnr-mut);transition:transform var(--dnr-t2) var(--dnr-ease),color var(--dnr-t2)} .dnr-page .dnr-q[open] summary::after{transform:rotate(45deg);color:var(--dnr-acc-l)} .dnr-page .dnr-q__a{padding:0 0 22px;max-width:720px;display:flex;flex-direction:column;gap:12px;font-size:17px;line-height:1.75;color:var(--dnr-txt2)} /* ---------- Sommaire ---------- */ .dnr-page .dnr-toc{display:flex;flex-direction:column;gap:2px;z-index:1} .dnr-page .dnr-toc__bar{position:relative;display:block;height:2px;margin:4px 0 18px;overflow:hidden;background:var(--dnr-line)} .dnr-page .dnr-toc__bar::after{content:"";position:absolute;inset:0;background:var(--dnr-acc-l);transform-origin:0 50%;transform:scaleX(var(--dnr-p,0))} .dnr-page .dnr-toc a{display:flex;gap:14px;align-items:baseline;min-height:44px;padding:10px 0 10px 14px;border-left:2px solid var(--dnr-line);text-decoration:none;color:var(--dnr-txt3);font-size:15px;transition:color var(--dnr-t2),border-color var(--dnr-t2)} .dnr-page .dnr-toc a .dnr-lab{letter-spacing:.1em} .dnr-page .dnr-toc a:hover,.dnr-page .dnr-toc a[aria-current=true]{color:var(--dnr-ink);border-left-color:var(--dnr-acc-l)} .dnr-page .dnr-toc a[aria-current=true] .dnr-lab{color:var(--dnr-acc-l)} /* ---------- Appel final ---------- */ .dnr-page .dnr-cta{position:relative;margin:120px var(--dnr-gut) 0;padding:clamp(28px,5vw,64px);display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:24px 40px;align-items:center;overflow:hidden;background:radial-gradient(80% 120% at 0% 50%,rgba(var(--dnr-acc-rgb),.28),rgba(var(--dnr-acc-rgb),0) 60%),var(--dnr-bg2)} .dnr-page .dnr-cta::before{grid-column:1/-1} .dnr-page .dnr-cta::after{content:"";position:absolute;inset:0;border:2px solid rgba(238,242,248,.22);pointer-events:none} .dnr-page .dnr-cta h2{font-size:clamp(30px,3.4vw,48px);line-height:1} .dnr-page .dnr-cta p:not(.dnr-lab):not(.dnr-cta__links){font-size:17px;line-height:1.7;color:var(--dnr-txt2)} .dnr-page .dnr-cta__txt{display:flex;flex-direction:column;gap:16px} .dnr-page .dnr-cta__act{display:flex;flex-direction:column;gap:12px} .dnr-page .dnr-cta__act .dnr-lab{text-align:center} /* ---------- Mobile et tablette : lecture d'abord ---------- */ @media (max-width:1024px){ .dnr-page .dnr-hero{min-height:620px;padding:110px calc(var(--dnr-gut) + 12px) 56px} .dnr-page .dnr-hero__body{flex-direction:column;align-items:stretch;gap:22px} .dnr-page .dnr-brief{width:auto;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px} .dnr-page .dnr-stat b{font-size:26px} .dnr-page .dnr-stat span{font-size:12px} .dnr-page .dnr-toc{position:sticky;top:0;z-index:40;flex-direction:row;gap:8px;overflow-x:auto;padding:12px var(--dnr-gut);margin-inline:calc(-1 * var(--dnr-gut));background:rgba(7,10,15,.9);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--dnr-line);scrollbar-width:none} .dnr-page .dnr-toc>.dnr-lab,.dnr-page .dnr-toc__bar{display:none} .dnr-page .dnr-toc a{flex-shrink:0;align-items:center;padding:0 12px;border:1px solid var(--dnr-line);font-size:13px;white-space:nowrap} .dnr-page .dnr-toc a[aria-current=true]{border-color:var(--dnr-acc-l)} .dnr-page .dnr-cards{grid-template-columns:minmax(0,1fr)} .dnr-page .dnr-row{grid-template-columns:minmax(0,1fr);gap:8px} .dnr-page .dnr-band{padding-inline:var(--dnr-gut);justify-content:flex-start} .dnr-page .dnr-cta{grid-template-columns:minmax(0,1fr);margin-top:80px} } @media (max-width:560px){ .dnr-page .dnr-brief{grid-template-columns:repeat(2,minmax(0,1fr))} .dnr-page .dnr-hero[data-dnr-status]::after{display:none} .dnr-page .dnr-tbl :is(th,td){padding:10px 12px} .dnr-page .dnr-filter input[type=search]{min-width:0;width:100%} .dnr-page .dnr-note--logo{grid-template-columns:64px minmax(0,1fr)} .dnr-page .dnr-note__logo{width:64px;height:64px} } /* ---------- Ajouts de la page pilote Minage (plan 2, tâche 9) ---------- */ /* En bref en liste de définitions : le libellé (dt) précède la valeur (dd) dans le HTML, la valeur s'affiche au-dessus */ .dnr-page dl.dnr-brief{margin:0} .dnr-page .dnr-brief :is(dt,dd){margin:0} .dnr-page dl.dnr-brief .dnr-stat{flex-direction:column-reverse;justify-content:flex-end} .dnr-page .dnr-stat dd{font:700 20px/1.15 var(--dnr-disp);color:var(--dnr-ink);font-variant-numeric:tabular-nums} .dnr-page .dnr-stat dd.dnr-count{font-size:30px;line-height:1.05} .dnr-page .dnr-stat dt{font-size:13px;line-height:1.4;color:var(--dnr-txt3);white-space:nowrap} /* une ligne : pas de décalage quand la police arrive (CLS) */ .dnr-page .dnr-stat .dnr-ok{color:var(--dnr-ok)} /* Colonnes : blocs côte à côte (titre h4, liste ou puces), par exemple dans un panneau d'onglet */ .dnr-page .dnr-cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:22px 28px;margin-top:6px} .dnr-page .dnr-cols>div{display:flex;flex-direction:column;gap:10px;min-width:0} .dnr-page .dnr-cols h4{font:500 12px/1.4 var(--dnr-mono);letter-spacing:.2em;color:var(--dnr-mut);padding-bottom:8px;border-bottom:1px dashed rgba(var(--dnr-acc-m-rgb),.35)} .dnr-page .dnr-cols p{font-size:15px;line-height:1.6;color:var(--dnr-txt2)} .dnr-page .dnr-cols ul:not(.dnr-chips){list-style:none;padding:0} .dnr-page .dnr-cols ul:not(.dnr-chips) li{position:relative;padding-left:18px;font-size:15px;line-height:1.6;color:var(--dnr-txt2)} .dnr-page .dnr-cols ul:not(.dnr-chips) li::before{content:"\25B8";content:"\25B8" / "";position:absolute;left:0;color:var(--dnr-acc-l)} /* Mention « instable » dans une table */ .dnr-page .dnr-inst{font:500 12px/1 var(--dnr-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--dnr-acc-l)} .dnr-page .dnr-inst::before{content:"\26A0\00A0";content:"\26A0\00A0" / ""} /* Recherche du filtre avec son libellé visible */ .dnr-page .dnr-filter__q{display:flex;flex-direction:column;gap:6px;min-width:260px;flex:0 1 380px} /* Liens de fin de l'appel final */ .dnr-page .dnr-cta__links{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:0 24px;padding-top:12px;border-top:1px solid var(--dnr-line)} .dnr-page .dnr-cta__links a{display:inline-flex;align-items:center;min-height:44px;font:500 12px/1.4 var(--dnr-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--dnr-txt3);text-decoration:none} .dnr-page .dnr-cta__links a:hover{color:var(--dnr-acc-l)} /* Zone de lecture sans sommaire : colonne centrée */ .dnr-page .dnr-reading:not(.dnr-grid)>.dnr-art{max-width:1180px;margin-inline:auto} @media (max-width:1024px){ .dnr-page .dnr-stat dd{font-size:18px} .dnr-page .dnr-stat dd.dnr-count{font-size:26px} } @media (max-width:560px){ .dnr-page .dnr-filter__q{min-width:0;width:100%} .dnr-page .dnr-stat dt{font-size:12px} } /* ---------- Plan 3, Divisions (v2.4.0) : petites règles génériques, communes à toutes les pages ---------- */ /* Carte au ton d'un élément (data-dnr-ton sur la carte) : trait supérieur au ton ; mention civile en vert */ .dnr-page .dnr-card[data-dnr-ton]::after{background:var(--dnr-acc-l)} .dnr-page .dnr-card .dnr-lab--ok{color:var(--dnr-ok)} /* Étapes numérotées en lignes (ol.dnr-rows) */ .dnr-page ol.dnr-rows{margin:0;padding:0;list-style:none} /* Guide du débutant (v2.5.0) : valeur à surveiller dans un dossier en bref, quatre cartes en deux colonnes, grille d'encarts (dnr-notes), titre d'encart, touches du jeu (kbd) */ .dnr-page .dnr-stat .dnr-warn{color:var(--dnr-gold)} .dnr-page .dnr-cards--4{grid-template-columns:repeat(2,minmax(0,1fr))} .dnr-page .dnr-notes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px} .dnr-page .dnr-notes>.dnr-note{max-width:none} .dnr-page .dnr-notes .dnr-note p{font-size:17px} .dnr-page .dnr-note h3{font:600 18px/1.3 var(--dnr-disp);letter-spacing:.03em;text-transform:uppercase;color:var(--dnr-ink)} .dnr-page .dnr-note--warn h3{color:var(--dnr-gold)} .dnr-page kbd{display:inline-block;min-width:1.9em;padding:1px 7px;border:1px solid var(--dnr-line2);border-bottom-width:2px;background:rgba(238,242,248,.05);font:600 13px/1.45 var(--dnr-mono);text-align:center;color:var(--dnr-ink)} @media (max-width:1024px){.dnr-page .dnr-cards--4,.dnr-page .dnr-notes{grid-template-columns:minmax(0,1fr)}} /* Commerce (v2.6.0) : citation avec sa source (dnr-citation), précision en petite police à chasse fixe (dnr-precision) */ .dnr-page .dnr-citation{margin:0;padding:22px 26px;display:flex;flex-direction:column;gap:12px;border:0;border-left:3px solid var(--dnr-acc-l);background:rgba(var(--dnr-acc-rgb),.07)} .dnr-page .dnr-citation p{font:500 clamp(18px,1.6vw,21px)/1.55 var(--dnr-disp);color:var(--dnr-ink)} .dnr-page .dnr-citation cite{font:500 12px/1.4 var(--dnr-mono);font-style:normal;letter-spacing:.16em;text-transform:uppercase;color:var(--dnr-mut)} .dnr-page .dnr-precision{font:400 14px/1.6 var(--dnr-mono);color:var(--dnr-mut)} /* Tons d'accent (plan 3, spec 5.1) : data-dnr-ton sur .dnr-page ou sur un élément de la page (carte, encart). Le ton colore traits, libellés, repères, focus et halos ; les boutons principaux restent rouges (identité). Libellés (--dnr-acc-l) à 4,5:1 au moins sur les deux fonds, vérifié par tools/test_contrast.py. */ .dnr-page[data-dnr-ton=rouge],.dnr-page [data-dnr-ton=rouge]{--dnr-acc:#CC2828;--dnr-acc-l:#FF6B5E;--dnr-acc-rgb:204,40,40;--dnr-acc-m-rgb:232,69,60;--dnr-acc-l-rgb:255,107,94} .dnr-page[data-dnr-ton=ambre],.dnr-page [data-dnr-ton=ambre]{--dnr-acc:#D9822B;--dnr-acc-l:#FFB35C;--dnr-acc-rgb:217,130,43;--dnr-acc-m-rgb:238,146,58;--dnr-acc-l-rgb:255,179,92} .dnr-page[data-dnr-ton=acier],.dnr-page [data-dnr-ton=acier]{--dnr-acc:#5C7A99;--dnr-acc-l:#A9C1DA;--dnr-acc-rgb:92,122,153;--dnr-acc-m-rgb:122,152,184;--dnr-acc-l-rgb:169,193,218} .dnr-page[data-dnr-ton=cyan],.dnr-page [data-dnr-ton=cyan]{--dnr-acc:#1FA7B8;--dnr-acc-l:#6FE3F0;--dnr-acc-rgb:31,167,184;--dnr-acc-m-rgb:52,190,206;--dnr-acc-l-rgb:111,227,240} .dnr-page[data-dnr-ton=vert],.dnr-page [data-dnr-ton=vert]{--dnr-acc:#27A866;--dnr-acc-l:#6FE8A6;--dnr-acc-rgb:39,168,102;--dnr-acc-m-rgb:49,208,127;--dnr-acc-l-rgb:111,232,166} .dnr-page[data-dnr-ton=violet],.dnr-page [data-dnr-ton=violet]{--dnr-acc:#7B55D9;--dnr-acc-l:#C3A6FF;--dnr-acc-rgb:123,85,217;--dnr-acc-m-rgb:150,116,236;--dnr-acc-l-rgb:195,166,255} .dnr-page[data-dnr-ton=or],.dnr-page [data-dnr-ton=or]{--dnr-acc:#C9962E;--dnr-acc-l:#F2CD7A;--dnr-acc-rgb:201,150,46;--dnr-acc-m-rgb:224,166,64;--dnr-acc-l-rgb:242,205,122} /* Gris (plan 3, tâche 7) : couleur des recrues, Guide du débutant (zygo, 29 sept. 2026 : « pour les recrue c'est #607d8b ») ; #607D8B pour les traits et les remplissages ; libellés dans la nuance claire de la même famille (#B0BEC5) : #607D8B seul ne donne que 4,4:1 sur le second fond, sous les 4,5:1 des libellés de 12 px .dnr-page[data-dnr-ton=gris],.dnr-page [data-dnr-ton=gris]{--dnr-acc:#7E858F;--dnr-acc-l:#C9CED6;--dnr-acc-rgb:126,133,143;--dnr-acc-m-rgb:154,161,171;--dnr-acc-l-rgb:201,206,214} : gris neutre de l'aperçu v2 */ .dnr-page[data-dnr-ton=gris],.dnr-page [data-dnr-ton=gris]{--dnr-acc:#607D8B;--dnr-acc-l:#B0BEC5;--dnr-acc-rgb:96,125,139;--dnr-acc-m-rgb:120,144,156;--dnr-acc-l-rgb:176,190,197} /* Rose (plan 3, tâche 6) : Scientifique, teinte de son insigne */ .dnr-page[data-dnr-ton=rose],.dnr-page [data-dnr-ton=rose]{--dnr-acc:#D9336C;--dnr-acc-l:#FF7FAD;--dnr-acc-rgb:217,51,108;--dnr-acc-m-rgb:236,72,128;--dnr-acc-l-rgb:255,127,173} /* Variantes d'ouverture et pièces signature (plan 3, spec 5.1) : déplacées le 29 sept. 2026 (v2.4.0, choix de zygo sur le poids du style commun) dans src/css/pieces/, une feuille par pièce, chargée seulement par les pages qui l'utilisent (déclencheurs lus par tools/build.py dans son commentaire de tête, cherchés dans le contenu de la page par class-front.php). Petites règles génériques de Divisions : en fin de 50-components.css. */ /* États d'animation (spec 6) : actifs seulement quand html.dnr-m est posé (jamais sans script, jamais avec la réduction des animations ni le réglage « animations : non »). Propriétés animées : transform, opacity, clip-path. Le H1 et le texte courant ne sont jamais cachés. */ .dnr-page .dnr-readbar{position:fixed;left:0;right:0;top:var(--wp-admin--admin-bar--height,0px);z-index:9999;height:2px;background:var(--dnr-acc-l);transform-origin:0 50%;transform:scaleX(0);pointer-events:none} .dnr-page .dnr-star{position:fixed;z-index:0;width:140px;height:1px;background:linear-gradient(90deg,rgba(220,230,255,0),rgba(220,230,255,.9));transform-origin:100% 50%;pointer-events:none;opacity:0} html.dnr-m[data-dnr-motion=douce] .dnr-page{--dnr-t3:420ms;--dnr-t4:700ms;--dnr-stagger:40ms;--dnr-rise:12px} /* Apparitions : montée et fondu, cascade par --i */ html.dnr-m .dnr-page :is(.dnr-lead,.dnr-sec>p,[data-dnr-in],.dnr-note,.dnr-tabs,.dnr-filter,.dnr-answers){opacity:0;transform:translateY(var(--dnr-rise,28px));transition:opacity var(--dnr-t3) var(--dnr-ease),transform var(--dnr-t3) var(--dnr-ease)} html.dnr-m .dnr-page :is(.dnr-lead,.dnr-sec>p,[data-dnr-in],.dnr-note,.dnr-tabs,.dnr-filter,.dnr-answers).in{opacity:1;transform:none} html.dnr-m .dnr-page :is(.dnr-cards,.dnr-rows,.dnr-faq,.dnr-chips)>*{opacity:0;transform:translateY(var(--dnr-rise,28px));transition:opacity var(--dnr-t3) var(--dnr-ease),transform var(--dnr-t3) var(--dnr-ease);transition-delay:calc(var(--i,0) * var(--dnr-stagger))} html.dnr-m .dnr-page :is(.dnr-cards,.dnr-rows,.dnr-faq,.dnr-chips).in>*{opacity:1;transform:none} /* Titres depuis un masque */ html.dnr-m .dnr-page .dnr-mk{display:block;overflow:hidden;padding-bottom:.06em} html.dnr-m .dnr-page .dnr-mk>span{display:block;transform:translateY(106%);transition:transform var(--dnr-t4) var(--dnr-ease)} html.dnr-m .dnr-page .in .dnr-mk>span{transform:none} /* Traits et cadres qui se tracent */ html.dnr-m .dnr-page .dnr-card::after{transform:scaleX(0);transition:transform var(--dnr-t4) var(--dnr-ease);transition-delay:calc(var(--i,0) * 120ms + 200ms)} html.dnr-m .dnr-page .in>.dnr-card::after{transform:scaleX(1)} html.dnr-m .dnr-page .dnr-row{border-bottom-color:transparent} html.dnr-m .dnr-page .dnr-row::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;background:var(--dnr-line2);transform-origin:0 50%;transform:scaleX(0);transition:transform var(--dnr-t4) var(--dnr-ease);transition-delay:calc(var(--i,0) * 110ms)} html.dnr-m .dnr-page .in>.dnr-row::after{transform:scaleX(1)} html.dnr-m .dnr-page :is(.dnr-note,.dnr-cta)::after{clip-path:inset(0 100% 100% 0);transition:clip-path 1400ms var(--dnr-ease-io)} html.dnr-m .dnr-page :is(.dnr-note,.dnr-cta).in::after{clip-path:inset(0)} /* Images en fondu simple, citations mot à mot, tableaux ligne à ligne */ html.dnr-m .dnr-page :is(.dnr-fig,.dnr-band) img{opacity:0;transition:opacity 1000ms var(--dnr-ease)} html.dnr-m .dnr-page :is(.dnr-fig,.dnr-band).in img{opacity:1} html.dnr-m .dnr-page .dnr-word{display:inline-block;opacity:0;transform:translateY(.4em);transition:opacity var(--dnr-t3) var(--dnr-ease),transform var(--dnr-t3) var(--dnr-ease);transition-delay:calc(var(--i,0) * 55ms)} html.dnr-m .dnr-page .in .dnr-word{opacity:1;transform:none} html.dnr-m .dnr-page .dnr-tbl tbody tr{opacity:0;transform:translateX(-14px);transition:opacity var(--dnr-t2) var(--dnr-ease),transform var(--dnr-t2) var(--dnr-ease);transition-delay:calc(var(--i,0) * 28ms)} html.dnr-m .dnr-page .dnr-tbl.in tbody tr{opacity:1;transform:none} /* Ouverture au chargement : voile sur l'image (l'image reste peinte pour le LCP), cadre, sous-titre, dossier en bref */ html.dnr-m .dnr-page .dnr-hero__fx::after{content:"";position:absolute;inset:0;background:var(--dnr-bg);opacity:1;transition:opacity var(--dnr-t4) var(--dnr-ease)} html.dnr-m .dnr-page .dnr-hero.go .dnr-hero__fx::after{opacity:0} html.dnr-m .dnr-page .dnr-hero__fx::before{clip-path:inset(0 100% 100% 0);transition:clip-path var(--dnr-t4) var(--dnr-ease) 300ms} html.dnr-m .dnr-page .dnr-hero.go .dnr-hero__fx::before{clip-path:inset(0)} html.dnr-m .dnr-page .dnr-hero h1 small{clip-path:inset(0 100% 0 0);transition:clip-path 1400ms var(--dnr-ease) 400ms} html.dnr-m .dnr-page .dnr-hero.go h1 small{clip-path:inset(0)} html.dnr-m .dnr-page .dnr-brief{transform:translateX(24px);transition:transform var(--dnr-t4) var(--dnr-ease) 500ms} html.dnr-m .dnr-page .dnr-hero.go .dnr-brief{transform:none} html.dnr-m .dnr-page .dnr-dot{animation:dnr-pulse 2400ms ease-in-out infinite} @keyframes dnr-pulse{0%,100%{opacity:1}50%{opacity:.35}} html.dnr-paused .dnr-page .dnr-dot{animation-play-state:paused} /* Reflet du bouton principal (ordinateur) */ @media (hover:hover) and (pointer:fine){ html.dnr-m .dnr-page .dnr-btn--p::after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,rgba(255,255,255,0) 35%,rgba(255,255,255,.28) 50%,rgba(255,255,255,0) 65%);transform:translateX(-120%);pointer-events:none} html.dnr-m .dnr-page .dnr-btn--p:hover::after{transform:translateX(120%);transition:transform 800ms var(--dnr-ease)} } /* Mobile : cascades raccourcies, aucune animation continue */ @media (max-width:1024px){ html.dnr-m .dnr-page{--dnr-stagger:40ms} html.dnr-m .dnr-page .dnr-dot{animation:none} }