:root {
  --surface-top: #232323; --surface-bottom: #171717; --brand-deep: #7F1C0F; --brand-end: #8A2011; --on-dark-accent: #FF9078;
  --cream-rgb: 246 243 236;
  --paper-rgb: 255 253 248;
  --ink-rgb: 20 20 20;
  --ink2-rgb: 66 61 55;
  --rule-rgb: 217 208 193;
  --brand-rgb: 150 37 19;
  --brand-text-rgb: 147 39 15;
  color-scheme: light;
  background: rgb(var(--cream-rgb));
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --cream-rgb: 20 20 20;
    --paper-rgb: 34 32 30;
    --ink-rgb: 246 243 236;
    --ink2-rgb: 196 190 180;
    --rule-rgb: 70 66 60;
    --brand-text-rgb: 255 144 120;
    color-scheme: dark;
    background: linear-gradient(180deg, var(--surface-top) 0%, var(--surface-bottom) 100%) fixed;
  }
  :root:not([data-theme="light"]) body { background: transparent !important; }
  :root:not([data-theme="light"]) header.sticky { background-color: var(--surface-top) !important; }
  :root:not([data-theme="light"]) .cta { background: rgb(var(--brand-rgb)) !important; color: rgb(246 243 236) !important; }
}

:root[data-theme="dark"] {
  --cream-rgb: 20 20 20;
  --paper-rgb: 34 32 30;
  --ink-rgb: 246 243 236;
  --ink2-rgb: 196 190 180;
  --rule-rgb: 70 66 60;
  --brand-text-rgb: 255 144 120;
  color-scheme: dark;
  background: linear-gradient(180deg, var(--surface-top) 0%, var(--surface-bottom) 100%) fixed;
}
:root[data-theme="dark"] body { background: transparent !important; }
:root[data-theme="dark"] header.sticky { background-color: var(--surface-top) !important; }
:root[data-theme="dark"] .cta { background: rgb(var(--brand-rgb)) !important; color: rgb(246 243 236) !important; }

body { background-color: rgb(var(--cream-rgb)) !important; color: rgb(var(--ink-rgb)) !important; }
header.sticky { background-color: rgb(var(--cream-rgb) / 0.96) !important; border-color: rgb(var(--rule-rgb)) !important; }
.glass { background: rgb(var(--paper-rgb)) !important; border-color: rgb(var(--rule-rgb)) !important; color: rgb(var(--ink-rgb)); box-shadow: 0 1px 2px rgb(20 20 20 / 0.06), 0 14px 28px -20px rgb(20 20 20 / 0.3); }
.text-ink { color: rgb(var(--ink-rgb)) !important; }
.text-ink2 { color: rgb(var(--ink2-rgb)) !important; }
.text-brand, .hover\:text-brand:hover { color: rgb(var(--brand-text-rgb)) !important; }
.border-rule, .divide-rule { border-color: rgb(var(--rule-rgb)) !important; }
.border-ink { border-color: rgb(var(--ink-rgb)) !important; }
footer { border-color: rgb(var(--rule-rgb)); }
html { scroll-padding-top: 96px; }
main#contenu p:not(.text-center) { max-width: 75ch; }
@media (prefers-reduced-motion: reduce) { .cta, .cta:hover, .cta:active { transform: none !important; transition: none !important; } }
footer a, .site-nav a, a[href^="index.html#"] { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; }
.legal-header-brand { display: inline-flex; align-items: center; min-height: 44px; }

.legal-header-row { column-gap: 0.5rem !important; }
.legal-header-row { padding-left: 12px; padding-right: 12px; }
@media (min-width: 640px) { .legal-header-row { padding-left: 24px; padding-right: 24px; } }
@media (min-width: 1024px) { .legal-header-row { padding-left: 32px; padding-right: 32px; } }
.legal-header-brand { font-size: clamp(0.9375rem, 4vw, 1.5rem); }
.legal-header-cta { padding-left: 0.5rem !important; padding-right: 0.5rem !important; font-size: 0.6875rem !important; }
.legal-theme-toggle {
  display: inline-flex;
  flex: 0 0 44px;
  width: 44px;
  height: 44px;
  align-items: center;
  justify-content: center;
  padding: 0;
  border: 1px solid rgb(var(--rule-rgb));
  border-radius: 9999px;
  background: rgb(var(--paper-rgb));
  color: rgb(var(--ink-rgb));
  cursor: pointer;
}
.legal-theme-toggle svg { width: 20px; height: 20px; }
.legal-theme-toggle[aria-pressed="true"] .i-moon,
.legal-theme-toggle[aria-pressed="false"] .i-sun { display: none; }
.legal-theme-toggle:hover { border-color: rgb(var(--brand-text-rgb)); }
.legal-theme-toggle:focus-visible { outline: 3px solid rgb(var(--brand-text-rgb)); outline-offset: 3px; }

@media (min-width: 640px) {
  .legal-header-row { column-gap: 1.5rem !important; }
  .legal-header-brand { font-size: 1.5rem; }
  .legal-header-cta { padding-left: 1.25rem !important; padding-right: 1.25rem !important; font-size: 0.875rem !important; }
}
@media (max-width: 359px) {
  .legal-header-row { column-gap: 0.375rem !important; }
  .legal-header-cta { padding-left: 0.35rem !important; padding-right: 0.35rem !important; font-size: 0.6875rem !important; }
}

@media (max-width: 639px) {
  main#contenu > h1 {
    font-size: clamp(2.25rem, 10vw, 2.75rem) !important;
    line-height: 1.05 !important;
    overflow-wrap: anywhere;
  }
}
