@import './config/layers.css';
@import './components/button.css';
@import './components/navbar.css';
@import './components/blocks.css';
@import './components/card.css';
@import './components/hero.css';
@import './components/list.css';
@import './components/marquee.css';

h1,
h2,
h3,
h4,
h5,
h6 {
  font-weight: 500;

  &:first-child:not(h1) {
    margin-top: 0;
  }
}

section {
  padding-inline: var(--size-m);
  padding-block: var(--size-6xl);

  &:not(.breakout) {
    border: 1px solid #eaeaea;
  }
}

.tcs-contrast {
  background: var(--color-gray-95);
  background-color: var(--color-fill-muted);
}

hr.breakout {
  border-width: 1px;
  margin-block: -1px;
  border-color: #eaeaea;
  position: relative;
  z-index: 1;
}

.logo:hover {
  /* reset link color on logo hover */
  color: inherit;
}