/* Palette inspirée du logo du Fablab Marseille. */
:root { color-scheme: light; }
.theme-toolbar {
  display: flex;
  justify-content: flex-end;
  padding: .5rem clamp(1rem, 4vw, 3rem) .8rem;
  background: #fff;
}
.theme-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  padding: 8px;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: #283e68;
  font: 600 .875rem/1.3 Inter, Arial, sans-serif;
  cursor: pointer;
  opacity: .6;
}
.theme-toggle:hover, .theme-toggle:focus-visible { opacity: 1; }
.theme-toggle svg { width: 20px; height: 20px; flex-shrink: 0; }
.theme-toggle[hidden] { display: none; }
html[data-theme="dark"] {
  color-scheme: dark;
  --fablab-paper: #101827;
  --fablab-ink: #e5ecf6;
  --wp--preset--color--base: #101827;
  --wp--preset--color--base-2: #192539;
  --wp--preset--color--contrast: #e5ecf6;
  --wp--preset--color--contrast-2: #bccbde;
}
html[data-theme="dark"] body { background: #101827; color: #e5ecf6; }
html[data-theme="dark"] .wp-site-blocks > header > .wp-block-group,
html[data-theme="dark"] .theme-toolbar { background: #162135; }
html[data-theme="dark"] .theme-toggle {
  color: #e5ecf6;
  background: transparent;
}
html[data-theme="dark"] header .wp-block-site-title a,
html[data-theme="dark"] header .wp-block-navigation-item__content,
html[data-theme="dark"] h1.wp-block-post-title,
html[data-theme="dark"] .entry-content h2,
html[data-theme="dark"] .entry-content h3,
html[data-theme="dark"] body > main > .card h1 { color: #c3d8ff; }
html[data-theme="dark"] .wp-block-navigation__responsive-container.is-menu-open {
  color: #e5ecf6;
  background: #162135;
}
html[data-theme="dark"] main.wp-block-group > .wp-block-group:first-child {
  background: radial-gradient(ellipse at 90% 0%, #184138, transparent 55%),
    linear-gradient(115deg, #223858, #101827);
  border-color: #34455f;
}
html[data-theme="dark"] .entry-content a:not(.wp-block-button__link),
html[data-theme="dark"] body > main > .card a { color: #9fcaff; }
html[data-theme="dark"] .entry-content a:not(.wp-block-button__link):hover { color: #ffa7af; }
html[data-theme="dark"] .entry-content > p.has-background {
  background: #3d2530 !important;
  color: #ffd6db;
}
html[data-theme="dark"] .contact-form-section,
html[data-theme="dark"] body > main > .card {
  background: #192539;
  border-color: #34455f;
  border-top-color: #4ec99f;
}
html[data-theme="dark"] .contact-form-intro,
html[data-theme="dark"] .contact-form-note { color: #bccbde; }
html[data-theme="dark"] .contact-field input,
html[data-theme="dark"] .contact-field select,
html[data-theme="dark"] .contact-field textarea {
  background: #101827;
  color: #e5ecf6;
  border-color: #7185a2;
}
html[data-theme="dark"] .wp-block-button .wp-block-button__link,
html[data-theme="dark"] .contact-formspree .contact-submit {
  background: #34578a;
  border-color: #7d9dc8;
}
html[data-theme="dark"] .wp-block-button .wp-block-button__link:hover,
html[data-theme="dark"] .contact-formspree .contact-submit:hover { background: #416aa1; }
html[data-theme="dark"] .wp-site-blocks > footer { background: #162135; }
html[data-theme="dark"] header .wp-block-site-logo img {
  background: #fff;
  border-radius: 12px;
}
:root {
  --fablab-blue: #283e68;
  --fablab-red: #eb2436;
  --fablab-green: #008c69;
  --fablab-ink: #24334b;
  --fablab-paper: #f3f6fa;
  --wp--preset--color--base: #f3f6fa;
  --wp--preset--color--contrast: #24334b;
  --wp--preset--color--contrast-2: #526078;
}
body {
  background: var(--fablab-paper);
  color: var(--fablab-ink);
}
::selection { background: #b7eedb; color: #192d4c; }
a { text-underline-offset: .22em; }
a:focus-visible, button:focus-visible, input:focus-visible,
select:focus-visible, textarea:focus-visible {
  outline: 3px solid var(--fablab-green);
  outline-offset: 4px;
}
.wp-site-blocks > header {
  border-top: 5px solid transparent;
  border-image: linear-gradient(90deg, #eb2436 0% 33%, #283e68 33% 67%, #008c69 67%) 1;
  box-shadow: 0 4px 20px #283e680a;
}
.wp-site-blocks > header > .wp-block-group { background: #fff; }
header .wp-block-site-title a { color: var(--fablab-blue); text-decoration: none; }
header .wp-block-navigation-item__content {
  border-bottom: 2px solid transparent;
  padding-block: .4rem;
  transition: color .18s, border-color .18s;
}
header .wp-block-navigation-item__content:hover,
header .wp-block-navigation-item__content[aria-current="page"] {
  color: var(--fablab-blue);
  border-bottom-color: var(--fablab-red);
  text-decoration: none;
}
.wp-block-navigation__responsive-container.is-menu-open {
  background: #f3f6fa;
  color: var(--fablab-blue);
}
main.wp-block-group { margin-top: 0; }
main.wp-block-group > .wp-block-group:first-child {
  background: radial-gradient(ellipse at 90% 0%, #cfece6 0%, transparent 55%),
    linear-gradient(115deg, #e5ecf8, #f3f6fa);
  border-bottom: 1px solid #dce4ef;
  padding-bottom: 1.5rem;
  margin-bottom: 2.5rem;
}
h1.wp-block-post-title {
  color: var(--fablab-blue);
  text-wrap: balance;
}
h1.wp-block-post-title::after {
  content: "";
  display: block;
  width: 5rem;
  height: 5px;
  margin: 1.25rem auto 0;
  border-radius: 4px;
  background: linear-gradient(90deg, var(--fablab-red) 0% 33%, var(--fablab-blue) 33% 67%, var(--fablab-green) 67%);
}
.entry-content { padding-bottom: 3rem; }
.entry-content h2, .entry-content h3 { color: var(--fablab-blue); }
.entry-content a:not(.wp-block-button__link) { color: #24558d; }
.entry-content a:not(.wp-block-button__link):hover { color: #ac1930; }
.entry-content > p.has-background {
  background: #fff0ee !important;
  color: #732735;
  border: 0;
  border-left: 4px solid var(--fablab-red);
  border-radius: 0 12px 12px 0;
  padding: 1.25rem 1.5rem;
}
.entry-content figure img {
  border-radius: 12px;
  box-shadow: 0 8px 28px #283e6812;
}
.entry-content iframe { border-radius: 12px; max-width: 100%; }
.wp-block-button .wp-block-button__link,
.contact-formspree .contact-submit {
  background: var(--fablab-blue);
  color: #fff;
  border: 1px solid var(--fablab-blue);
  border-radius: 10px;
  box-shadow: 0 5px 14px #283e6824;
  transition: background .18s, box-shadow .18s;
}
.wp-block-button .wp-block-button__link:hover,
.contact-formspree .contact-submit:hover {
  background: #1b2e51;
  color: #fff;
  box-shadow: 0 7px 18px #283e6833;
  opacity: 1;
}
.contact-form-section {
  box-sizing: border-box;
  background: #fff;
  border: 1px solid #dce4ef;
  border-top: 4px solid var(--fablab-green);
  border-radius: 16px;
  padding: clamp(1.25rem, 4vw, 2.5rem);
  box-shadow: 0 12px 36px #283e680d;
}
.contact-field input, .contact-field select, .contact-field textarea {
  background: #f8fafc;
  border: 1px solid #bac8d9;
  border-radius: 8px;
  color: var(--fablab-ink);
}
.wp-site-blocks > footer {
  background: var(--fablab-blue);
  color: #fff;
  border-top: 5px solid var(--fablab-green);
  margin-top: 0;
}
footer .wp-block-site-title a, footer h2, footer a { color: #fff; }
footer .has-contrast-2-color { color: #d5dfed !important; }
footer a:hover { color: #94e5ca; }
footer .wp-block-site-logo img {
  background: white;
  border-radius: 12px;
  padding: 6px;
}
body > main > .card {
  border-top: 5px solid var(--fablab-green);
  box-shadow: 0 16px 48px #283e6814;
}
body > main > .card h1, body > main > .card a { color: var(--fablab-blue); }
@media (max-width: 600px) {
  main.wp-block-group > .wp-block-group:first-child { margin-bottom: 1.5rem; }
  .contact-form-section { margin-inline: 0; }
  .entry-content > p.has-background { padding: 1rem; }
}
@media (prefers-reduced-motion: reduce) {
  header .wp-block-navigation-item__content,
  .wp-block-button .wp-block-button__link,
  .contact-formspree .contact-submit { transition: none; }
}