/* Site page ground: dark navy behind every page, like the Elementor kit body background on lumick.com (#050516). Shows around rounded section corners and behind blocks without their own fill. */
body {
  background-color: var(--fabrement-surface, #050516);
}

/* Font smoothing like lumick.com (its theme sets antialiased on body): without it macOS renders text with subpixel smoothing and it looks bolder. */
body {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Design-system buttons: hover shrinks to 90% like lumick.com (Elementor --e-transform-scale: 0.9, 0.4s). The builder's own "shrink" effect is 95%. */
.fabrement-btn--primary,
.fabrement-btn--hero {
  transition: background-color .3s ease, border-color .3s ease, color .3s ease, transform .4s ease;
}
.fabrement-btn--primary:hover,
.fabrement-btn--primary:focus-visible,
.fabrement-btn--hero:hover,
.fabrement-btn--hero:focus-visible {
  transform: scale(0.9);
}
@media (prefers-reduced-motion: reduce) {
  .fabrement-btn--primary,
  .fabrement-btn--hero { transition: none; }
  .fabrement-btn--primary:hover,
  .fabrement-btn--primary:focus-visible,
  .fabrement-btn--hero:hover,
  .fabrement-btn--hero:focus-visible { transform: none; }
}

/* Side gutter on narrow desktops (1025–1329px). Lumick sections use a 1290px content column with no side padding from 1025px up, so between 1025px and 1330px their content touched the screen edges (the same flaw as on lumick.com). Here every Lumick section gets the 20px tablet gutter until the 1290px column fits with room to spare; from 1330px up the layout is unchanged. */
@media (min-width: 1025px) and (max-width: 1329px) {
  section[class*="block-lumick-"] {
    --fabrement-pad-inline: 20px !important;
  }
}