/**
 * Same Boat — Tailwind source.
 * Build: npm run dev  |  npm run build
 * Output: assets/css/tailwind.css
 */

:root {
  --sb-title: 11 34 81;
  /* #0B2251 */
}

/* base/preflight off — see corePlugins.preflight in tailwind.config.js */

.container {
  width: 100%
}

@media (min-width: 640px) {
  .container {
    max-width: 640px
  }
}

@media (min-width: 768px) {
  .container {
    max-width: 768px
  }
}

@media (min-width: 1024px) {
  .container {
    max-width: 1024px
  }
}

@media (min-width: 1280px) {
  .container {
    max-width: 1280px
  }
}

@media (min-width: 1336px) {
  .container {
    max-width: 1336px
  }
}

.static {
  position: static
}

.relative {
  position: relative
}

.m-0 {
  margin: 0px
}

.mx-auto {
  margin-left: auto;
  margin-right: auto
}

.my-4 {
  margin-top: 1rem;
  margin-bottom: 1rem
}

.mb-3 {
  margin-bottom: 0.75rem
}

.mb-5 {
  margin-bottom: 1.25rem
}

.mt-10 {
  margin-top: 2.5rem
}

.box-border {
  box-sizing: border-box
}

.block {
  display: block
}

.inline-block {
  display: inline-block
}

.flex {
  display: flex
}

.table {
  display: table
}

.grid {
  display: grid
}

.hidden {
  display: none
}

.aspect-square {
  aspect-ratio: 1 / 1
}

.w-16 {
  width: 4rem
}

.w-full {
  width: 100%
}

.min-w-0 {
  min-width: 0px
}

.max-w-3xl {
  max-width: 48rem
}

.flex-1 {
  flex: 1 1 0%
}

.flex-none {
  flex: none
}

.shrink-0 {
  flex-shrink: 0
}

.border-collapse {
  border-collapse: collapse
}

.grid-cols-1 {
  grid-template-columns: repeat(1, minmax(0, 1fr))
}

.flex-wrap {
  flex-wrap: wrap
}

.items-start {
  align-items: flex-start
}

.items-center {
  align-items: center
}

.justify-between {
  justify-content: space-between
}

.gap-2 {
  gap: 0.5rem
}

.gap-8 {
  gap: 2rem
}

.self-start {
  align-self: flex-start
}

.rounded {
  border-radius: 0.25rem
}

.rounded-lg {
  border-radius: 0.5rem
}

.rounded-none {
  border-radius: 0px
}

.rounded-xl {
  border-radius: 0.75rem
}

.border-2 {
  border-width: 2px
}

.border-title\/10 {
  border-color: rgb(var(--sb-title) / 0.1)
}

.bg-gray-100 {
  --tw-bg-opacity: 1;
  background-color: rgb(243 244 246 / var(--tw-bg-opacity, 1))
}

.bg-white {
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1))
}

.bg-zinc-50 {
  --tw-bg-opacity: 1;
  background-color: rgb(250 250 250 / var(--tw-bg-opacity, 1))
}

.object-cover {
  -o-object-fit: cover;
     object-fit: cover
}

.p-0 {
  padding: 0px
}

.p-5 {
  padding: 1.25rem
}

.p-6 {
  padding: 1.5rem
}

.px-5 {
  padding-left: 1.25rem;
  padding-right: 1.25rem
}

.py-8 {
  padding-top: 2rem;
  padding-bottom: 2rem
}

.text-left {
  text-align: left
}

.text-center {
  text-align: center
}

.font-sans {
  font-family: Inter, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"
}

.text-3xl {
  font-size: 1.875rem;
  line-height: 2.25rem
}

.text-\[1\.375rem\] {
  font-size: 1.375rem
}

.text-sm {
  font-size: 0.875rem;
  line-height: 1.25rem
}

.font-bold {
  font-weight: 700
}

.font-semibold {
  font-weight: 600
}

.leading-snug {
  line-height: 1.375
}

.text-\[\#21364d\] {
  --tw-text-opacity: 1;
  color: rgb(33 54 77 / var(--tw-text-opacity, 1))
}

.text-gray-300 {
  --tw-text-opacity: 1;
  color: rgb(209 213 219 / var(--tw-text-opacity, 1))
}

.text-navy {
  --tw-text-opacity: 1;
  color: rgb(11 34 81 / var(--tw-text-opacity, 1))
}

.shadow-\[0_4px_20px_rgba\(33\2c 54\2c 77\2c 0\.1\)\] {
  --tw-shadow: 0 4px 20px rgba(33,54,77,0.1);
  --tw-shadow-colored: 0 4px 20px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)
}

.filter {
  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)
}

@media (min-width: 640px) {
  .sm\:w-20 {
    width: 5rem
  }

  .sm\:gap-10 {
    gap: 2.5rem
  }

  .sm\:p-8 {
    padding: 2rem
  }
}

@media (min-width: 768px) {
  .md\:my-0 {
    margin-top: 0px;
    margin-bottom: 0px
  }
}

@media (min-width: 1024px) {
  .lg\:col-span-2 {
    grid-column: span 2 / span 2
  }

  .lg\:col-span-3 {
    grid-column: span 3 / span 3
  }

  .lg\:w-2\/5 {
    width: 40%
  }

  .lg\:w-3\/5 {
    width: 60%
  }

  .lg\:max-w-md {
    max-width: 28rem
  }

  .lg\:grid-cols-5 {
    grid-template-columns: repeat(5, minmax(0, 1fr))
  }

  .lg\:gap-16 {
    gap: 4rem
  }

  .lg\:p-10 {
    padding: 2.5rem
  }

  .lg\:text-4xl {
    font-size: 2.25rem;
    line-height: 2.5rem
  }
}