. Au défilement l'en-tête se teinte de la nuit incendie pour ne pas trancher avec le héros. ============================================================================ */ .theme-incendie main{ /* accent : rouge incendie */ --accent:#e11d2e; --accent-2:#b3121f; --accent-soft:#ff8a93; /* alias historiques utilisés en dur par les pages et les cartes du blog */ --gold:#b3121f; --gold-2:#e11d2e; --gold-50:#fff1f2; --gold-100:#ffdde0; --gold-light:#ff8a93; --or:#b3121f; --or2:#e11d2e; --brand:#b3121f; --primary:#b3121f; --accent-wash:#fff1f2; /* profondeurs : nuit incendie (pourpre très sombre) au lieu du bleu nuit */ --deep:#160609; --deep-2:#2b0a11; --surface-d:#3a0f17; --border-d:#5c1b25; --txt2-d:#d9b5ba; /* clairs : blanc cassé très légèrement chaud */ --light:#fbf7f7; --gray-50:#fbf7f7; --gray-100:#f3e9ea; --gray-200:#e6d5d7; --gray-300:#cfb6ba; --bg:#fbf7f7; --bg2:#f5eaeb; --surface2:#fbf7f7; --panel2:#fbf7f7; --line:#e6d5d7; --line2:#f3e9ea; } /* En-tête : transparent sur le héros (inchangé), nuit incendie une fois défilé */ .theme-incendie header.scrolled,.theme-incendie header.is-scrolled{ background:rgba(43,10,17,.93);border-bottom-color:#5c1b25;box-shadow:0 8px 30px rgba(22,6,9,.45); } /* Couleurs écrites en dur dans style.css : on les reprend une à une */ .theme-incendie main .subpage-hero{ background:linear-gradient(120deg,var(--deep) 0%,var(--deep-2) 62%,#4a0d17 100%); } .theme-incendie main .subpage-hero::after{ background:repeating-radial-gradient(130% 150% at 0% 100%,transparent 0 16px,rgba(225,29,46,.10) 16px 17px); } .theme-incendie main .section-gray{background:#f5eaeb} .theme-incendie main .btn-primary,.theme-incendie main .btn-demo{ background:linear-gradient(135deg,#e11d2e 0%,#8e0d19 100%); box-shadow:0 8px 20px rgba(179,18,31,.35); } .theme-incendie main .btn-primary:hover,.theme-incendie main .btn-demo:hover{ background:linear-gradient(135deg,#e11d2e 0%,#8e0d19 100%); box-shadow:0 12px 26px rgba(179,18,31,.45); } .theme-incendie main .btn-outline:hover{border-color:var(--accent);background:rgba(225,29,46,.14)} .theme-incendie main .btn-secondary:hover{background:#4a1520} .theme-incendie main .wave-bg::after{ background:repeating-radial-gradient(120% 140% at 0% 100%,transparent 0 14px,rgba(225,29,46,.07) 14px 15px); } /* Lueur animée du héros : un souffle lent, jamais agressif (désactivé si l'utilisateur le demande) */ .theme-incendie main .subpage-hero::before{ content:"";position:absolute;right:-120px;top:-140px;width:520px;height:520px;pointer-events:none;border-radius:50%; background:radial-gradient(circle,rgba(225,29,46,.28) 0%,rgba(225,29,46,.10) 38%,transparent 66%); animation:inc-souffle 9s ease-in-out infinite alternate; } @keyframes inc-souffle{from{transform:scale(.92) translate(0,0);opacity:.75}to{transform:scale(1.08) translate(-30px,20px);opacity:1}} @media (prefers-reduced-motion:reduce){.theme-incendie main .subpage-hero::before{animation:none}} /* Pastille de série (« Le dimanche de l'incendie ») et étiquette d'article de règlement */ .inc-serie{ display:inline-flex;align-items:center;gap:8px;padding:6px 14px;border-radius:999px; font-size:.74rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase; color:#ffd6da;background:rgba(225,29,46,.16);border:1px solid rgba(255,138,147,.35); } .inc-serie .dot{width:8px;height:8px;border-radius:50%;background:#ff8a93;box-shadow:0 0 0 0 rgba(255,138,147,.6);animation:inc-pulse 2.2s infinite} @keyframes inc-pulse{0%{box-shadow:0 0 0 0 rgba(255,138,147,.6)}70%{box-shadow:0 0 0 9px rgba(255,138,147,0)}100%{box-shadow:0 0 0 0 rgba(255,138,147,0)}} @media (prefers-reduced-motion:reduce){.inc-serie .dot{animation:none}} .inc-code{ display:inline-block;font-family:var(--mono);font-weight:700;font-size:.9em;padding:1px 8px;border-radius:6px; background:#fff1f2;color:#8e0d19;border:1px solid #ffdde0;white-space:nowrap; } .section-dark .inc-code,.subpage-hero .inc-code{background:rgba(255,255,255,.08);color:#ffd6da;border-color:rgba(255,138,147,.35)} /* « Ce que dit le texte » : la citation du règlement, toujours sourcée */ .inc-texte{ position:relative;margin:26px 0;padding:22px 24px 18px 28px;border-radius:14px; background:#fff;border:1px solid #f3d3d6;border-left:5px solid #e11d2e;box-shadow:0 10px 30px rgba(22,6,9,.06); } .section-dark .inc-texte{background:rgba(255,255,255,.05);border-color:rgba(255,138,147,.28);border-left-color:#ff8a93} .inc-texte .inc-texte-ref{display:flex;align-items:center;gap:10px;font-size:.78rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#b3121f;margin:0 0 10px} .section-dark .inc-texte .inc-texte-ref{color:#ff8a93} .inc-texte blockquote{margin:0;font-size:15px;line-height:1.8;color:#3b2a2d;font-style:italic} .section-dark .inc-texte blockquote{color:rgba(255,255,255,.85)} .inc-texte cite{display:block;margin-top:10px;font-size:.82rem;font-style:normal;color:#7a5a5f} .section-dark .inc-texte cite{color:#d9b5ba} .inc-texte cite a{color:#b3121f;font-weight:700} .section-dark .inc-texte cite a{color:#ff8a93} /* « À retenir » */ .inc-retenir{ margin:26px 0;padding:22px 24px;border-radius:14px;background:linear-gradient(135deg,#2b0a11,#4a0d17);color:#fff; box-shadow:0 14px 34px rgba(22,6,9,.25); } .inc-retenir h3{margin:0 0 12px;font-size:1.05rem;color:#ffd6da;letter-spacing:.02em} .inc-retenir ul{margin:0;padding-left:20px;line-height:1.75;font-size:15px} .inc-retenir li::marker{color:#ff8a93} /* Tableaux réglementaires : lisibles, défilables sur téléphone */ .inc-tbl-wrap{overflow-x:auto;margin:22px 0;border-radius:14px;border:1px solid #f0d6d9;background:#fff;box-shadow:0 8px 24px rgba(22,6,9,.05)} .section-dark .inc-tbl-wrap{background:rgba(255,255,255,.04);border-color:rgba(255,138,147,.25)} table.inc-tbl{width:100%;border-collapse:collapse;font-size:14.5px;min-width:520px} table.inc-tbl th{background:linear-gradient(135deg,#b3121f,#8e0d19);color:#fff;text-align:left;padding:12px 14px;font-weight:800;font-size:.82rem;letter-spacing:.06em;text-transform:uppercase} table.inc-tbl td{padding:11px 14px;border-top:1px solid #f3e0e2;color:#3b2a2d;vertical-align:top;line-height:1.55} .section-dark table.inc-tbl td{color:rgba(255,255,255,.85);border-top-color:rgba(255,255,255,.08)} table.inc-tbl tr:nth-child(even) td{background:#fdf6f7} .section-dark table.inc-tbl tr:nth-child(even) td{background:rgba(255,255,255,.03)} table.inc-tbl td:first-child{font-weight:700} table.inc-tbl .oui{color:#15803d;font-weight:800} table.inc-tbl .non{color:#b3121f;font-weight:800} /* Sources : la liste obligatoire en fin d'article */ .inc-sources{margin:0;padding:0;list-style:none;display:grid;gap:10px} .inc-sources li{padding:12px 16px;border-radius:10px;background:#fff;border:1px solid #f0d6d9;font-size:14px;line-height:1.55;color:#3b2a2d} .inc-sources li a{color:#b3121f;font-weight:700;word-break:break-word} .inc-sources li small{display:block;color:#7a5a5f;margin-top:2px} /* Cartes de la page d'index : la pastille de catégorie et le survol reprennent le rouge */ .theme-incendie .blog-card:hover{border-color:#ffdde0;box-shadow:0 24px 60px rgba(22,6,9,.16)} .theme-incendie .blog-filter:hover{border-color:#e11d2e;color:#b3121f} .theme-incendie .blog-filter.active{background:#b3121f;border-color:#b3121f} .theme-incendie .blog-card-cat{background:#fff1f2;color:#b3121f} .theme-incendie .blog-card-img{background:#2b0a11} .theme-incendie .blog-card h3 a:hover{color:#b3121f} /* Recherche (partagée avec le blog dirigeant : blog-search.js) */ .blog-search{max-width:680px;margin:0 auto 26px;position:relative} .blog-search input{ width:100%;padding:15px 52px 15px 48px;border-radius:999px;border:1.5px solid var(--gray-300,#b7c8d8);background:#fff; font:inherit;font-size:1rem;color:var(--gray-900,#0b1a2d);box-shadow:0 8px 24px rgba(7,17,30,.06);outline:none; transition:border-color .2s,box-shadow .2s; } .blog-search input:focus{border-color:var(--accent,#2f8fd8);box-shadow:0 0 0 4px var(--gold-50,#eaf4fc)} .blog-search .bs-ico{position:absolute;left:18px;top:50%;transform:translateY(-50%);width:20px;height:20px;color:var(--gray-500,#57697c);pointer-events:none} .blog-search .bs-clear{position:absolute;right:10px;top:50%;transform:translateY(-50%);border:0;background:var(--gray-100,#e6edf5);color:var(--gray-700,#33465c);width:32px;height:32px;border-radius:50%;cursor:pointer;font-size:18px;line-height:1;display:none} .blog-search.has-value .bs-clear{display:block} .blog-search .bs-hint{text-align:center;font-size:.82rem;color:var(--gray-500,#57697c);margin:10px 0 0} .bs-results{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:20px;margin-top:8px} .bs-result{display:flex;flex-direction:column;gap:8px;background:#fff;border:1px solid var(--gray-100,#e6edf5);border-radius:var(--radius-lg,16px);padding:20px 22px;text-decoration:none;color:inherit;transition:transform .25s var(--ease,ease),box-shadow .25s,border-color .25s;box-shadow:var(--shadow-xs)} .bs-result:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg);border-color:var(--gold-100,#d6e9f8)} .bs-result .bs-serie{display:inline-flex;align-items:center;gap:6px;align-self:flex-start;font-size:10.5px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;padding:3px 10px;border-radius:999px} .bs-result .bs-serie.serie-dirigeant{background:#eaf4fc;color:#1a6fb5} .bs-result .bs-serie.serie-incendie{background:#fff1f2;color:#b3121f} .bs-result h3{margin:0;font-size:1.05rem;font-weight:800;color:var(--gray-900,#0b1a2d);line-height:1.35} .bs-result h3 mark,.bs-result p mark{background:#fff3b0;color:inherit;padding:0 2px;border-radius:3px} .bs-result p{margin:0;font-size:.9rem;color:var(--gray-600,#4a5f75);line-height:1.6} .bs-result .bs-meta{font-size:.78rem;color:var(--gray-500,#57697c);margin-top:auto;padding-top:10px;border-top:1px solid var(--gray-100,#e6edf5)} .bs-count{grid-column:1/-1;font-size:.9rem;color:var(--gray-600,#4a5f75);margin:0 0 4px} .bs-empty{grid-column:1/-1;text-align:center;padding:40px 24px;color:var(--gray-500,#57697c);background:var(--gray-50,#f5f8fb);border-radius:var(--radius-lg,16px);border:2px dashed var(--gray-300,#b7c8d8)} /* Bouton « livre » du héros : version rouge (le bouton bleu vit dans blog.html) */ .theme-incendie .livre-btn{background:linear-gradient(135deg,#3a0f17 0%,#7a0f1d 100%)!important;border-color:rgba(255,255,255,.18)!important;box-shadow:0 10px 30px rgba(22,6,9,.35)!important} .theme-incendie .livre-btn:hover{box-shadow:0 16px 38px rgba(22,6,9,.45)!important} .theme-incendie .livre-btn-ico,.theme-incendie .livre-btn-fleche{color:#ff8a93!important} .theme-incendie .livre-btn-txt small{color:#f2c9ce!important} .theme-incendie .livre-btn-2{background:transparent!important;border:1px solid rgba(255,255,255,.22)!important;box-shadow:none!important} /* Passerelle vers l'autre blog (bandeau en bas de l'index) */ .inc-passerelle{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;padding:26px 30px;border-radius:18px;background:linear-gradient(135deg,#0b1a2d,#14355a);color:#fff;margin-top:48px} .inc-passerelle b{font-size:1.1rem} .inc-passerelle small{display:block;color:#a9c1d6;margin-top:4px} .theme-incendie main .inc-passerelle .btn-primary{background:linear-gradient(135deg,#2f8fd8,#155c96);box-shadow:0 8px 20px rgba(26,111,181,.35)} @media print{ .theme-incendie main .subpage-hero::before{display:none} .inc-retenir{background:#fff!important;color:#000!important;border:.5pt solid #666} .inc-retenir h3{color:#000!important} table.inc-tbl th{background:#eee!important;color:#000!important} }