/* WOAW — couche de cohérence visuelle commune à toutes les pages. */
:root {
  --font-display: "Bebas Neue", Impact, sans-serif;
  --font-title: "Bebas Neue", Impact, sans-serif;
  --font-body: "DM Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-mono: "Space Mono", ui-monospace, SFMono-Regular, Consolas, monospace;
  --brand-ink: #080808;
  --brand-paper: #f5f4f0;
  --brand-lime: #c7ff24;
  --brand-orange: #ff9129;
  --brand-purple: #9b6dff;
  --brand-blue: #c8efff;
  --radius-control: 999px;
  --radius-card: 24px;
}

html {
  font-size: 100%;
  text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
}

body {
  font-family: var(--font-body) !important;
  font-size: 1rem;
  line-height: 1.6;
  font-optical-sizing: auto;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

.sec-h,
.hero-hl,
.word,
.wd-title,
.wd-section-head h2,
.local-hero h1,
.guide-hero h1,
.project-hero h1 {
  font-family: var(--font-display) !important;
  font-weight: 400;
  font-optical-sizing: auto;
  text-wrap: balance;
}

.hero-hl,
.wd-title {
  line-height: 0.9;
  letter-spacing: -0.018em;
}

.sec-h,
.wd-section-head h2 {
  line-height: 0.94;
  letter-spacing: -0.012em;
}

p,
li,
dd,
input,
select,
textarea,
button {
  font-family: var(--font-body);
}

p,
li,
dd {
  text-wrap: pretty;
}

.sec-tag,
.hero-eyebrow,
.wd-index,
.wd-kicker,
.wd-proof-feature span,
.wd-proof-list span,
.wd-socials,
.project-kicker,
.guide-kicker,
.local-eyebrow,
.breadcrumb,
.breadcrumbs {
  font-family: var(--font-mono) !important;
  font-size: max(0.75rem, 12px) !important;
  line-height: 1.45;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.btn-lime,
.btn-dark,
.btn-ghost,
.btn-ivory,
.nav-contact-link,
.wd-btn,
button:not(.mobile-btn):not(.carousel-arrow) {
  min-height: 46px;
  border-radius: var(--radius-control);
  font-family: var(--font-body);
  font-size: 0.875rem;
  font-weight: 700;
  letter-spacing: 0;
  text-transform: none;
  transition: transform 160ms ease, background-color 160ms ease, color 160ms ease,
    border-color 160ms ease, box-shadow 160ms ease;
}

.btn-lime:active,
.btn-dark:active,
.btn-ghost:active,
.btn-ivory:active,
.nav-contact-link:active,
.wd-btn:active,
button:active {
  transform: scale(0.975);
}

header.nav.nav-unified .nav-contact-link {
  min-width: 172px !important;
  padding-inline: 30px !important;
  font-size: 0 !important;
}

header.nav.nav-unified .nav-contact-link::before {
  content: "Contact";
  font-family: var(--font-body);
  font-size: 1.125rem;
  font-weight: 800;
}

header.nav.nav-unified .nav-contact-link > span {
  font-size: 1.125rem;
}

body > .breadcrumb-nav {
  margin-top: 114px;
}

a,
button,
input,
select,
textarea,
[tabindex] {
  -webkit-tap-highlight-color: transparent;
}

:focus-visible {
  outline: 3px solid var(--brand-lime);
  outline-offset: 4px;
}

::selection {
  background: #24241f;
  color: #f6f2e8;
}

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

  .container {
    width: min(100% - 32px, var(--container, 1180px));
  }

  .pad {
    padding-block: 72px;
  }

  body > .breadcrumb-nav {
    margin-top: 88px;
  }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
  }
}

@media (prefers-reduced-transparency: reduce) {
  .nav,
  .nav-unified,
  .mobile-panel {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }
}

@media (prefers-contrast: more) {
  :focus-visible {
    outline-width: 4px;
  }

  .nav,
  .nav-unified,
  .mobile-panel {
    background: #080808 !important;
    border-color: rgba(255, 255, 255, 0.5) !important;
  }
}