/* Theme Name: Science Music Theme URI: https://sciencemusic.live/ Description: Science Music Live — thème standalone v3.0 Author: Science Music Version: 3.0 Text Domain: sml */ /* ============================================================ 0. FONTS — Inter Variable (local), Crushed (local) ============================================================ */ @font-face { font-family: 'Inter'; src: url('assets/fonts/Woff/InterVariable.woff2') format('woff2-variations'); font-weight: 100 900; font-style: normal; font-display: swap; } @font-face { font-family: 'Crushed'; src: url('assets/fonts/Woff/crushed-regular-webfont.woff2') format('woff2'), url('assets/fonts/Woff/crushed-regular-webfont.woff') format('woff'); font-weight: 400; font-style: normal; font-display: swap; } /* ============================================================ 1. VARIABLES CSS GLOBALES — Charte sciencemusic.live ============================================================ */ :root { /* Fonds */ --sml-bg-primary: #111827; --sml-bg-secondary: #1f2937; --sml-bg-elevated: #273548; --sml-bg-surface: #0d1117; /* Accent musique (corail) */ --sml-accent: #ff7043; --sml-accent-hover: #ff8a65; --sml-accent-muted: rgba(255, 112, 67, 0.2); --sml-accent-dark: #e64a19; /* Accent science (violet) */ --sml-accent-science: #a855f7; --sml-accent-science-hover: #b97af9; --sml-accent-science-muted: rgba(168, 85, 247, 0.2); --sml-accent-science-dark: #9333ea; /* Accent actif (défaut musique, overridable) */ --sml-active-accent: #ff7043; --sml-active-accent-hover: #ff8a65; --sml-active-accent-muted: rgba(255, 112, 67, 0.2); /* Texte */ --sml-text-primary: #f9fafb; --sml-text-secondary: #9ca3af; --sml-text-muted: #838d9b; /* était #6b7280 (3.7:1) → 5.3:1 WCAG AA ✅ */ --sml-text-accent: #ff7043; /* Bordures */ --sml-border: #374151; --sml-border-accent: #ff7043; /* Utilitaires */ --sml-success: #10b981; --sml-warning: #f59e0b; --sml-error: #ef4444; /* Typographie */ --sml-font-display: 'Crushed', cursive; --sml-font-body: 'Inter', sans-serif; /* Espacements */ --sml-space-xs: 0.25rem; --sml-space-sm: 0.5rem; --sml-space-md: 1rem; --sml-space-lg: 2rem; --sml-space-xl: 4rem; /* Rayons */ --sml-radius-sm: 4px; --sml-radius-md: 8px; --sml-radius-lg: 16px; --sml-radius-full: 9999px; /* Ombres */ --sml-shadow-sm: 0 2px 8px rgba(0,0,0,0.4); --sml-shadow-md: 0 4px 16px rgba(0,0,0,0.5); --sml-shadow-lg: 0 8px 32px rgba(0,0,0,0.6); --sml-shadow-accent: 0 0 20px rgba(255,112,67,0.25); /* Transitions */ --sml-transition: 0.25s ease; --sml-transition-slow: 0.4s ease; /* Rétrocompatibilité — anciennes variables --sm-* */ --sm-bg-primary: var(--sml-bg-primary); --sm-bg-secondary: var(--sml-bg-secondary); --sm-bg-card: var(--sml-bg-elevated); --sm-bg-sidebar: var(--sml-bg-secondary); --sm-accent: var(--sml-accent); --sm-link: var(--sml-accent); --sm-link-hover: var(--sml-accent-hover); --sm-border: var(--sml-border); --sm-radius: var(--sml-radius-md); --sm-text-primary: var(--sml-text-primary); --sm-text-secondary:var(--sml-text-secondary); --sm-text-muted: var(--sml-text-muted); } /* Thème Science — ajouter .theme-science sur ou la section */ .theme-science { --sml-active-accent: #a855f7; --sml-active-accent-hover: #b97af9; --sml-active-accent-muted: rgba(168, 85, 247, 0.2); --sml-text-accent: #a855f7; --sml-border-accent: #a855f7; } /* ============================================================ 2. BASE GLOBALE ============================================================ */ html { background-color: var(--sml-bg-primary) !important; } body { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; background-color: var(--sml-bg-primary) !important; color: var(--sml-text-primary) !important; font-family: var(--sml-font-body) !important; font-size: 16px !important; font-weight: 300 !important; line-height: 1.75 !important; margin: 0 !important; padding: 0 !important; /* Player fixe 100px + viz strip 32px + nav sticky 36px */ padding-top: 168px !important; } *, *::before, *::after { box-sizing: border-box; } img { max-width: 100%; height: auto; } ul, ol { margin: 0; padding: 0; list-style: none; } h1, h2, h3, h4, h5, h6 { font-family: var(--sml-font-display); color: var(--sml-text-primary); text-transform: lowercase; line-height: 1.1; } h1 { font-size: 2.4rem; } h2 { font-size: 1.8rem; } h3 { font-size: 1.5rem; } h4 { font-size: 1.15rem; color: var(--sml-active-accent); } h5 { font-size: 0.82rem; font-family: var(--sml-font-body); text-transform: uppercase; color: var(--sml-text-secondary); } a { color: var(--sml-text-accent); text-decoration: none !important; transition: color var(--sml-transition); } a:hover { color: var(--sml-accent-hover); } /* ============================================================ 3. BREADCRUMB RANK MATH ============================================================ */ .rank-math-breadcrumb { margin-bottom: 20px; } .rank-math-breadcrumb p { font-family: var(--sml-font-body) !important; font-size: 0.75rem !important; font-weight: 300 !important; color: var(--sml-text-muted) !important; margin: 0 !important; line-height: 1.4 !important; } .rank-math-breadcrumb a { color: var(--sml-text-muted) !important; transition: color var(--sml-transition); } .rank-math-breadcrumb a:hover { color: var(--sml-active-accent) !important; } .rank-math-breadcrumb .separator { margin: 0 6px; color: var(--sml-border); } /* ============================================================ 4. SONG FINDER — Dark Mode + Layout Lignes ============================================================ */ .metaradio_songfinder { background: transparent; color: var(--sml-text-secondary); font-family: var(--sml-font-body); } /* Formulaire */ .metaradio_songfinder form { background: var(--sml-bg-secondary); border: 1px solid var(--sml-border); border-radius: var(--sml-radius-md); padding: 12px 16px; gap: 10px; margin: 0 0 20px 0; } .metaradio_songfinder form input, .metaradio_songfinder form select { background: var(--sml-bg-surface); border: 1px solid var(--sml-border); color: var(--sml-text-primary); border-radius: var(--sml-radius-sm); padding: 6px 10px; font-family: var(--sml-font-body); font-size: 0.88rem; } .metaradio_songfinder form input:focus, .metaradio_songfinder form select:focus { outline: none; border-color: var(--sml-accent); } .metaradio_songfinder form button, .metaradio_songfinder form input[type="submit"] { background: var(--sml-accent); color: #fff; border: none; border-radius: var(--sml-radius-sm); padding: 6px 16px; font-weight: 600; font-family: var(--sml-font-body); cursor: pointer; transition: background var(--sml-transition); } .metaradio_songfinder form button:hover, .metaradio_songfinder form input[type="submit"]:hover { background: var(--sml-accent-hover); } /* Message vide */ .metaradio_songfinder .metaradio_songfinder_nosongs { color: var(--sml-text-muted); padding: 24px; font-size: 0.9rem; } /* Date/heure */ .metaradio_songfinder h3.metaradio_songfinder_datetime { font-family: var(--sml-font-display); font-size: 1rem; font-weight: 400; color: var(--sml-accent); text-transform: lowercase; letter-spacing: 1px; margin: 20px 0 8px; padding: 6px 12px; background: var(--sml-accent-muted); border-left: 3px solid var(--sml-accent); border-radius: 0 var(--sml-radius-sm) var(--sml-radius-sm) 0; } /* Désactiver cards → layout lignes */ .metaradio_songfinder .metaradio_songfinder_layout_cards { display: block !important; grid-template-columns: unset !important; } .metaradio_songfinder .metaradio_songfinder_layout_cards .track_card { display: grid !important; grid-template-columns: 56px 70px 1fr 1fr auto !important; align-items: center; gap: 0 14px; min-height: unset !important; border-radius: 0 !important; background: transparent !important; color: var(--sml-text-secondary) !important; border-bottom: 1px solid var(--sml-border); padding: 6px 10px; transition: background var(--sml-transition); } .metaradio_songfinder .metaradio_songfinder_layout_cards .track_card:hover { background: var(--sml-bg-secondary) !important; } /* Heure */ .metaradio_songfinder .metaradio_songfinder_layout_cards .track_card > div.col-time { font-size: 0.78rem; color: var(--sml-text-muted); font-family: var(--sml-font-body); margin: 0 !important; white-space: nowrap; order: 1; } /* Artwork */ .metaradio_songfinder .metaradio_songfinder_layout_cards .track_card .col-image { min-height: unset !important; margin-bottom: 0 !important; order: 2; width: 56px; height: 56px; position: relative; flex-shrink: 0; } .metaradio_songfinder .metaradio_songfinder_layout_cards .track_card .col-image img { width: 56px !important; height: 56px !important; object-fit: cover; border-radius: var(--sml-radius-sm) !important; } /* Overlay iTunes hover */ .metaradio_songfinder .metaradio_songfinder_layout_cards .track_card .col-image .field-albumart .field-buylinks { position: absolute; inset: 0; opacity: 0; background: rgba(0,0,0,0.72); display: flex; justify-content: center; align-items: center; transition: opacity 0.2s ease; border-radius: var(--sml-radius-sm); } .metaradio_songfinder .metaradio_songfinder_layout_cards .track_card .col-image .field-albumart:hover .field-buylinks { opacity: 1; } .metaradio_songfinder .metaradio_songfinder_layout_cards .track_card .col-image .field-buylinks a { color: var(--sml-accent); font-size: 0.65rem; font-weight: 600; font-family: var(--sml-font-body); text-decoration: none; letter-spacing: 1px; text-transform: uppercase; } .metaradio_songfinder .metaradio_songfinder_layout_cards .track_card .col-image .field-buylinks a:hover { color: #fff; } /* Artiste */ .metaradio_songfinder .metaradio_songfinder_layout_cards .track_card > div.col-artist { font-size: 0.92rem; font-weight: 600; color: var(--sml-text-primary) !important; font-family: var(--sml-font-body); margin: 0 !important; order: 3; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } /* Titre */ .metaradio_songfinder .metaradio_songfinder_layout_cards .track_card > div.col-title { font-size: 0.88rem; font-weight: 300; color: var(--sml-text-secondary) !important; font-family: var(--sml-font-body); margin: 0 !important; order: 4; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } /* Album */ .metaradio_songfinder .metaradio_songfinder_layout_cards .track_card > div.col-album { font-size: 0.75rem; color: var(--sml-text-muted) !important; font-style: italic; margin: 0 !important; order: 5; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } /* Masquer compositeur et notes */ .metaradio_songfinder .metaradio_songfinder_layout_cards .track_card > div.col-composer, .metaradio_songfinder .metaradio_songfinder_layout_cards .track_card > div.track_notes { display: none !important; } /* Entête */ .metaradio_songfinder .metaradio_songfinder_layout_cards::before { content: ''; display: grid; grid-template-columns: 56px 70px 1fr 1fr auto; gap: 0 14px; padding: 8px 10px; background: var(--sml-bg-surface); border-bottom: 2px solid var(--sml-accent); font-family: var(--sml-font-body); font-size: 0.68rem; font-weight: 600; color: var(--sml-accent); letter-spacing: 1px; text-transform: uppercase; } /* Loading */ .metaradio_songfinder .loading_display { background-color: rgba(13, 17, 23, 0.85); } /* Table layout fallback */ .metaradio_songfinder table { width: 100%; border-collapse: collapse; } div.metaradio_songfinder table td, div.metaradio_songfinder table th { padding: 8px 10px; border-bottom: 1px solid var(--sml-border); font-family: var(--sml-font-body); font-size: 0.88rem; } .metaradio_songfinder table tr th { background: var(--sml-bg-surface); color: var(--sml-accent); font-size: 0.68rem; letter-spacing: 1px; text-transform: uppercase; border-bottom: 2px solid var(--sml-accent); } .metaradio_songfinder table tr.day th { background: var(--sml-accent-muted); color: var(--sml-accent); border-left: 3px solid var(--sml-accent); } .metaradio_songfinder table tr.row_even { background: var(--sml-bg-secondary); } .metaradio_songfinder table tr.row_odd { background: transparent; } .metaradio_songfinder table tr:hover { background: var(--sml-bg-elevated) !important; } .metaradio_songfinder table tr.track_notes_row { background: var(--sml-bg-surface); } .metaradio_songfinder img.albumart { border-radius: var(--sml-radius-sm); border: 1px solid var(--sml-border); } /* Responsive */ @media (max-width: 768px) { .metaradio_songfinder .metaradio_songfinder_layout_cards .track_card { grid-template-columns: 44px 1fr 1fr !important; grid-template-rows: auto auto; } .metaradio_songfinder .metaradio_songfinder_layout_cards .track_card > div.col-time { order: 1; font-size: 0.70rem; } .metaradio_songfinder .metaradio_songfinder_layout_cards .track_card .col-image { order: 2; width: 44px; height: 44px; } .metaradio_songfinder .metaradio_songfinder_layout_cards .track_card .col-image img { width: 44px !important; height: 44px !important; } .metaradio_songfinder .metaradio_songfinder_layout_cards .track_card > div.col-artist{ order: 3; } .metaradio_songfinder .metaradio_songfinder_layout_cards .track_card > div.col-title { order: 4; grid-column: 3; } .metaradio_songfinder .metaradio_songfinder_layout_cards .track_card > div.col-album { display: none !important; } } /* ============================================================ 5. SURCHARGES TYPOGRAPHIQUES — Contenu articles Force les styles Crushed/Inter sur le contenu WP ============================================================ */ /* Base body — forcer Inter sur tout */ body { font-family: 'Inter', sans-serif !important; font-size: 16px !important; font-weight: 300; line-height: 1.75; color: var(--sml-text-primary); } /* Contenu articles — tailles lisibles */ .sm-single-content, .sm-page-content, .entry-content { font-size: 1rem !important; } .sm-single-content p, .sm-page-content p, .entry-content p { font-family: 'Inter', sans-serif !important; font-size: 1rem !important; font-weight: 300; line-height: 1.78; color: var(--sml-text-primary) !important; margin-bottom: 18px; } /* H1 — Crushed lowercase */ .sm-single-content h1, .sm-page-content h1 { font-family: 'Crushed', cursive !important; font-size: 2rem !important; font-weight: 400 !important; text-transform: lowercase; color: var(--sml-text-primary) !important; line-height: 1.05; margin-bottom: 12px; } /* H2 */ .sm-single-content h2, .sm-page-content h2 { font-family: 'Crushed', cursive !important; font-size: 1.6rem !important; font-weight: 400 !important; text-transform: lowercase; color: #ffffff !important; margin: 28px 0 12px; } /* H3 */ .sm-single-content h3, .sm-page-content h3 { font-family: 'Crushed', cursive !important; font-size: 1.3rem !important; font-weight: 400 !important; text-transform: lowercase; color: var(--sml-text-primary) !important; margin: 20px 0 10px; } /* H4 — revues de presse, catégories */ .sm-single-content h4, .sm-page-content h4 { font-family: 'Crushed', cursive !important; font-size: 1.15rem !important; font-weight: 400 !important; text-transform: lowercase; color: var(--sml-text-primary) !important; margin: 18px 0 8px; } /* H5 — source, sous-titre */ .sm-single-content h5, .sm-page-content h5 { font-family: 'Inter', sans-serif !important; font-size: 0.78rem !important; font-weight: 600 !important; text-transform: uppercase; letter-spacing: 1px; color: var(--sml-text-secondary) !important; margin: 12px 0 4px; } /* H6 — liens discrets (Lire l'article) */ .sm-single-content h6, .sm-page-content h6 { font-family: 'Inter', sans-serif !important; font-size: 0.82rem !important; font-weight: 300 !important; color: var(--sml-accent) !important; margin: 8px 0 16px; } .sm-single-content h6 a, .sm-page-content h6 a { color: var(--sml-accent) !important; text-decoration: none; } .sm-single-content h6 a:hover, .sm-page-content h6 a:hover { color: var(--sml-accent-hover) !important; } /* Liens dans le contenu */ .sm-single-content a, .sm-page-content a { color: var(--sml-active-accent) !important; font-size: inherit !important; } .sm-single-content a:hover, .sm-page-content a:hover { color: var(--sml-active-accent-hover) !important; } /* Listes */ .sm-single-content ul, .sm-single-content ol, .sm-page-content ul, .sm-page-content ol { font-family: 'Inter', sans-serif !important; font-size: 1rem !important; font-weight: 300; color: var(--sml-text-primary) !important; padding-left: 28px; margin-bottom: 18px; } /* Blockquote */ .sm-single-content blockquote, .sm-page-content blockquote { border-left: 3px solid var(--sml-active-accent) !important; padding-left: 20px; margin: 24px 0; color: var(--sml-text-secondary) !important; font-style: italic; font-weight: 300; } /* Strong / em */ .sm-single-content strong, .sm-page-content strong { color: var(--sml-text-primary) !important; font-weight: 600 !important; } .sm-single-content em, .sm-page-content em { color: #e2e8f0 !important; } /* ── Réseaux sociaux sidebar — couleurs de marque ── */ .sm-social-x { color: #fff !important; background: #000 !important; border-color: #333 !important; } .sm-social-fb { color: #fff !important; background: #1877f2 !important; border-color: #1877f2 !important; } .sm-social-ig { color: #fff !important; background: #e1306c !important; border-color: #e1306c !important; } .sm-social-yt { color: #fff !important; background: #ff0000 !important; border-color: #ff0000 !important; } .sm-social-rss { color: var(--sml-accent-science) !important; background: var(--sml-accent-science-muted) !important; border-color: var(--sml-accent-science) !important; } /* ── IMAGES — contrainte absolue dans la colonne centrale ── */ .sm-single-content img, .sm-single-content .sm-post-thumbnail, #brx-content img, #sm-single-main img { max-width: 100% !important; width: auto !important; height: auto !important; display: block !important; } .sm-single-content .sm-post-thumbnail { width: 100% !important; } /* ============================================================ 6. SURCHARGES GLOBALES — Cohérence typographique cross-pages ============================================================ */ /* Tailles typographiques en px */ html body p, html body li, html body .sm-single-content p, html body .sm-page-content p, html body #sm-single-main p { font-size: 16px !important; font-weight: 300 !important; font-family: 'Inter', sans-serif !important; line-height: 1.78 !important; color: var(--sml-text-primary) !important; } html body h1 { font-size: 32px !important; } html body h2 { font-size: 26px !important; } html body h3 { font-size: 21px !important; } html body h4 { font-size: 18px !important; color: var(--sml-active-accent) !important; } html body h5 { font-size: 13px !important; text-transform: uppercase; letter-spacing: 1px; color: var(--sml-text-secondary) !important; } html body h6 { font-size: 14px !important; color: var(--sml-accent) !important; } /* Cards articles */ html body .sm-post-card-title { font-size: 15px !important; font-weight: 600 !important; font-family: 'Inter', sans-serif !important; } html body .sm-post-card-excerpt { font-size: 13px !important; font-weight: 400 !important; font-family: 'Inter', sans-serif !important; } html body .sm-post-card-date { font-size: 12px !important; font-weight: 400 !important; font-family: 'Inter', sans-serif !important; } html body .sm-post-card-cat { font-size: 11px !important; font-weight: 600 !important; font-family: 'Inter', sans-serif !important; } html body .sm-post-card-img { height: 160px !important; object-fit: cover !important; } /* Articles mini sidebar */ html body .sm-article-mini-title { font-size: 14px !important; font-weight: 600 !important; font-family: 'Inter', sans-serif !important; } html body .sm-article-mini-cat { font-size: 11px !important; font-weight: 600 !important; font-family: 'Inter', sans-serif !important; } html body .sm-article-mini-date { font-size: 12px !important; font-family: 'Inter', sans-serif !important; } /* Wiki artistes */ html body .sm-index-name { font-size: 15px !important; font-weight: 600 !important; font-family: 'Inter', sans-serif !important; color: var(--sml-accent) !important; } html body .sm-index-bio { font-size: 13px !important; font-weight: 400 !important; font-family: 'Inter', sans-serif !important; color: var(--sml-text-secondary) !important; } html body .sm-index-tab { font-size: 13px !important; font-weight: 600 !important; font-family: 'Inter', sans-serif !important; } /* Recherche */ .sml-search-input-wrapper { position: relative; display: flex; align-items: center; } .sml-search-finesse { padding-right: 40px !important; font-weight: 300 !important; } .sml-search-submit { position: absolute; right: 5px; background: none; border: none; cursor: pointer; display: flex; align-items: center; padding: 8px; } .sml-search-submit svg { width: 18px; height: 18px; fill: var(--sml-text-muted); transition: fill var(--sml-transition); } .sml-search-submit:hover svg { fill: var(--sml-accent-science); } .sml-search-suggestions { margin-top: 8px; display: flex; flex-wrap: wrap; gap: 6px; align-items: center; } .sml-tag-mini { font-family: var(--sml-font-body); font-size: 11px; font-weight: 600; color: var(--sml-text-secondary); background: var(--sml-bg-elevated); padding: 2px 8px; border-radius: var(--sml-radius-sm); text-decoration: none; transition: all var(--sml-transition); border: 1px solid var(--sml-border); } .sml-tag-mini:hover { color: #fff; background: var(--sml-accent-science); border-color: var(--sml-accent-science); } /* ============================================================ 7. FOOTER SM — #sm-footer ============================================================ */ #sm-footer { background: var(--sml-bg-surface); border-top: 1px solid var(--sml-border); margin-top: 40px; font-family: var(--sml-font-body); } .sm-footer-inner { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: 40px; max-width: 1600px; margin: 0 auto; padding: 48px 24px 32px; } /* ── Brand / Logo ── */ .sm-footer-logo { display: flex; flex-direction: column; font-family: var(--sml-font-display); margin-bottom: 14px; line-height: 1.05; } .sm-footer-logo-science { font-size: 1.4rem; font-weight: 400; color: var(--sml-accent-science); letter-spacing: 3px; } .sm-footer-logo-music { font-size: 1.4rem; font-weight: 400; color: var(--sml-accent); letter-spacing: 3px; } .sm-footer-desc { font-size: 0.82rem; font-weight: 400; color: var(--sml-text-secondary); line-height: 1.6; margin: 0; } /* ── Colonnes liens ── */ .sm-footer-col { display: flex; flex-direction: column; gap: 8px; } .sm-footer-col-title { font-family: var(--sml-font-display); font-size: 0.9rem; font-weight: 400; color: var(--sml-accent); text-transform: lowercase; margin: 0 0 8px 0; padding-bottom: 8px; border-bottom: 1px solid var(--sml-border); letter-spacing: 2px; } .sm-footer-link { font-size: 0.82rem; font-weight: 400; color: var(--sml-text-secondary); text-decoration: none; transition: color 0.2s; } .sm-footer-link:hover { color: var(--sml-text-primary); } /* ── Réseaux sociaux (liste verticale) ── */ .sm-footer-socials { display: flex; flex-direction: column; gap: 10px; } .sm-footer-soc-row { display: flex; align-items: center; gap: 10px; text-decoration: none; color: var(--sml-text-secondary); font-size: 0.82rem; font-weight: 400; transition: color 0.2s; } .sm-footer-soc-row:hover { color: var(--sml-accent); } .sm-soc-icon { width: 28px; height: 28px; flex-shrink: 0; background: rgba(255,255,255,0.05); border: 1px solid var(--sml-border); border-radius: 6px; display: flex; align-items: center; justify-content: center; transition: background 0.2s, border-color 0.2s; } .sm-soc-icon svg { width: 14px; height: 14px; } .sm-footer-soc-row:hover .sm-soc-icon { background: rgba(255, 112, 67, 0.12); border-color: rgba(255, 112, 67, 0.4); } .sm-soc-label { line-height: 1; } /* ── Barre copyright ── */ .sm-footer-bar { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 8px; padding: 16px 24px; border-top: 1px solid var(--sml-border); font-size: 0.75rem; font-weight: 400; color: var(--sml-text-muted); } .sm-footer-bar strong { color: var(--sml-text-secondary); font-weight: 600; } .sm-footer-bar-sep { color: var(--sml-border); } /* Mobile extras — Newsletter + Wiki (masqués sur desktop) */ .sm-footer-mobile-extras { display: none; } .sm-fme-title { font-family: var(--sml-font-display); font-size: 1rem; font-weight: 400; color: var(--sml-accent); letter-spacing: 2px; margin-bottom: 12px; } .sm-fme-section { margin-bottom: 24px; } .sm-fme-section:last-child { margin-bottom: 0; } .sm-fme-desc { font-size: 0.85rem; font-weight: 300; color: var(--sml-text-secondary); font-family: var(--sml-font-body); margin-bottom: 10px; } /* ── Responsive footer ── */ @media (max-width: 1100px) { .sm-footer-inner { grid-template-columns: 1fr 1fr; gap: 28px; } } @media (max-width: 768px) { .sm-footer-inner { grid-template-columns: 1fr 1fr; gap: 24px 16px; padding: 32px 16px 24px; } .sm-footer-brand { grid-column: 1 / -1; } .sm-footer-mobile-extras { display: block; grid-column: 1 / -1; border-top: 1px solid var(--sml-border); padding-top: 24px; } } @media (max-width: 600px) { .sm-footer-inner { grid-template-columns: 1fr; gap: 24px; padding: 32px 18px 24px; } }