/* === Reset === */
*, ::after, ::before { box-sizing: border-box; }
body { margin: 0; font-size: 1rem; line-height: 1.5; }
h1 { margin-top: 0; margin-bottom: .5rem; }
p { margin-top: 0; margin-bottom: 1rem; }
/* === Flex utilities === */
.d-flex { display: flex !important; }
.flex-column { flex-direction: column !important; }
.flex-wrap { flex-wrap: wrap !important; }
.flex-grow-1 { flex-grow: 1 !important; }

.align-items-center { align-items: center !important; }
.justify-content-center { justify-content: center !important; }

/* === Display utilities === */
.d-none { display: none !important; }

/* === Spacing utilities === */
.m-3 { margin: 1rem !important; }
.my-5 { margin-top: 3rem !important; margin-bottom: 3rem !important; }
.mx-auto { margin-left: auto !important; margin-right: auto !important; }
.ms-3 { margin-left: 1rem !important; }

.p-3 { padding: 1rem !important; }
.px-4 { padding-left: 1.5rem !important; padding-right: 1.5rem !important; }

.mb-3 { margin-bottom: 1rem !important; }
.mb-4 { margin-bottom: 1.5rem !important; }
.mb-5 { margin-bottom: 3rem !important; }

/* === Typography === */
.text-center { text-align: center !important; }
.display-5 { font-size: clamp(2rem, 1.425rem + 2.1vw, 3rem); font-weight: 300; line-height: 1.2; }

/* === Custom additions === */
.min-vh-100 { min-height: 100vh; min-height: 100svh; min-height: 100lvh; min-height: 100dvh; }

.gap-3 { gap: 1rem !important; }

.btn {
  display: inline-block;
  font-weight: 400;
  text-align: center;
  cursor: pointer;
  border: 1px solid transparent;
  padding: .375rem .75rem;
  font-size: 1rem;
  line-height: 1.5;
  border-radius: .25rem;
}

/* === Responsive breakpoints === */
@media (min-width: 576px) {
  .d-sm-flex { display: flex !important; }
  .flex-sm-row { flex-direction: row !important; }
  .ms-sm-0 { margin-left: 0 !important; }
  .col-sm-9 { width: 75%; }
}
@media (min-width: 768px) {
  .d-md-block { display: block !important; }
  .pt-md-5 { padding-top: 3rem !important; }
  .mb-md-5 { margin-bottom: 3rem !important; }
  .col-md-7 { width: 58.3333%; }
  .px-md-5 { padding-left: 3rem !important; padding-right: 3rem !important; }
}
@media (min-width: 992px) {
  .col-lg-6 { width: 50%; }
  .px-lg-5 { padding-left: 3rem !important; padding-right: 3rem !important; }
}