@import "tailwindcss";
@custom-variant dark (&:where(.dark, .dark *));

:root {
  --background: #ffffff;
  --foreground: #171717;
  color-scheme: light;
}

:root.light {
  --background: #ffffff;
  --foreground: #171717;
  color-scheme: light;
}

:root.dark {
  --background: #0a0a0a;
  --foreground: #ededed;
  color-scheme: dark;
}

@theme inline {
  --color-background: var(--background);
  --color-foreground: var(--foreground);
  --font-sans: var(--font-geist-sans);
  --font-mono: var(--font-geist-mono);
  --color-brand-blue: #0a3d78;
  --color-brand-blue-hover: #062d5a;
}

@media (prefers-color-scheme: dark) {
  :root {
    --background: #0a0a0a;
    --foreground: #ededed;
    color-scheme: dark;
  }
}

body {
  background: var(--background);
  color: var(--foreground);
  font-family: var(--font-geist-sans), sans-serif;
  overflow-x: hidden;
}

/* Direction visuelle Lalekou : une présence institutionnelle, sobre et précise. */
::selection { background: #800020; color: #fff; }
body { font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; letter-spacing: -.01em; }
.utility-bar { background: #062d5a; border-bottom: 1px solid rgb(255 255 255 / .12); }
.site-header { background: rgb(255 255 255 / .94); backdrop-filter: blur(16px); box-shadow: 0 1px 0 rgb(15 23 42 / .08); }
.dark .site-header { background: rgb(15 23 42 / .94); }
.brand-mark { filter: saturate(1.08) contrast(1.04); }
.eyebrow { display: inline-flex; align-items: center; gap: .65rem; color: #0a3d78; font-size: .72rem; font-weight: 800; letter-spacing: .16em; line-height: 1.2; text-transform: uppercase; }
.eyebrow::before { width: 2.25rem; height: 2px; content: ""; background: #800020; }
.hero-grid { position: relative; overflow: hidden; isolation: isolate; background: #f5f8fc; }
.hero-grid::before { position: absolute; z-index: -1; top: -20rem; right: -14rem; width: 43rem; height: 43rem; border-radius: 999px; content: ""; background: radial-gradient(circle, rgb(10 61 120 / .14), transparent 67%); }
.hero-title { letter-spacing: -.055em; }
.hero-visual { position: relative; }
.hero-visual::before { position: absolute; z-index: -1; inset: 1.5rem -1.5rem -1.5rem 1.5rem; content: ""; background: #800020; }
.hero-visual img { filter: saturate(.88) contrast(1.05); }
.button-primary { display: inline-flex; align-items: center; justify-content: center; gap: .75rem; border: 1px solid #0a3d78; background: #0a3d78; color: white; font-size: .79rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; transition: transform .2s ease, background .2s ease, box-shadow .2s ease; }
.button-primary:hover { background: #062d5a; box-shadow: 0 12px 25px rgb(6 45 90 / .2); transform: translateY(-2px); }
.section-rule { border-top: 1px solid #dbe4f0; }
.service-photo { transition: transform .65s cubic-bezier(.2,.8,.2,1), filter .4s ease; filter: saturate(.8); }
.service-photo:hover { filter: saturate(1); transform: scale(1.025); }
.project-card { border-radius: .25rem; box-shadow: 0 12px 30px rgb(15 23 42 / .05); transition: transform .25s ease, box-shadow .25s ease; }
.project-card:hover { box-shadow: 0 22px 45px rgb(15 23 42 / .12); transform: translateY(-5px); }
.site-footer { background: #051e3d; }
.site-footer h2 { letter-spacing: .12em; }
@media (max-width: 1023px) { .hero-visual::before { inset: 1rem -1rem -1rem 1rem; } }

@media (max-width: 639px) {
  body {
    font-size: 1.0625rem;
  }
}