/*
 * Desktop compatibility fallback for Safari versions that do not understand
 * the range-query syntax emitted by Tailwind v4. This file is served verbatim.
 * Modern browsers receive the same rules from the generated application CSS.
 */
@media (min-width: 48rem) {
  .page-shell {
    max-width: 43rem;
  }

  .page-shell-wide {
    max-width: 72rem;
    padding-inline: 2rem;
  }

  .wide\:block {
    display: block;
  }

  .wide\:flex {
    display: flex;
  }

  .wide\:grid {
    display: grid;
  }

  .wide\:hidden {
    display: none;
  }

  .wide\:flex-none {
    flex: none;
  }

  .wide\:grid-cols-\[minmax\(0\,1fr\)_minmax\(0\,1\.05fr\)\] {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr);
  }

  .wide\:items-center {
    align-items: center;
  }

  .wide\:self-center {
    align-self: center;
  }

  .wide\:self-start {
    align-self: flex-start;
  }

  .wide\:gap-4 {
    gap: 1rem;
  }

  .wide\:gap-10 {
    gap: 2.5rem;
  }

  .wide\:mt-0 {
    margin-top: 0;
  }

  .wide\:mt-2 {
    margin-top: 0.5rem;
  }

  .wide\:mt-6 {
    margin-top: 1.5rem;
  }

  .wide\:mt-10 {
    margin-top: 2.5rem;
  }

  .wide\:mt-12 {
    margin-top: 3rem;
  }

  .wide\:h-3\.5 {
    height: 0.875rem;
  }

  .wide\:rounded-none {
    border-radius: 0;
  }

  .wide\:rounded-2xl {
    border-radius: var(--radius-2xl);
  }

  .wide\:border {
    border-width: 1px;
  }

  .wide\:border-y-0 {
    border-top-width: 0;
    border-bottom-width: 0;
  }

  .wide\:border-l-\[3px\] {
    border-left-width: 3px;
  }

  .wide\:border-route {
    border-color: var(--route);
  }

  .wide\:border-navy-muted\/25 {
    border-color: color-mix(in oklab, var(--navy-muted) 25%, transparent);
  }

  .wide\:bg-transparent {
    background-color: transparent;
  }

  .wide\:bg-navy {
    background-color: var(--navy);
  }

  .wide\:bg-navy\/60 {
    background-color: color-mix(in oklab, var(--navy) 60%, transparent);
  }

  .wide\:bg-navy-muted\/30 {
    background-color: color-mix(in oklab, var(--navy-muted) 30%, transparent);
  }

  .wide\:px-6 {
    padding-inline: 1.5rem;
  }

  .wide\:px-8 {
    padding-inline: 2rem;
  }

  .wide\:py-2 {
    padding-block: 0.5rem;
  }

  .wide\:py-4 {
    padding-block: 1rem;
  }

  .wide\:py-7 {
    padding-block: 1.75rem;
  }

  .wide\:pb-16 {
    padding-bottom: 4rem;
  }

  .wide\:pl-8 {
    padding-left: 2rem;
  }

  .wide\:pr-0 {
    padding-right: 0;
  }

  .wide\:pt-0 {
    padding-top: 0;
  }

  .wide\:pt-10 {
    padding-top: 2.5rem;
  }

  .wide\:text-base {
    font-size: 1rem;
    line-height: 1.5rem;
  }

  .wide\:text-lg {
    font-size: 1.125rem;
    line-height: 1.75rem;
  }

  .wide\:text-xl {
    font-size: 1.25rem;
    line-height: 1.75rem;
  }

  .wide\:text-2xl {
    font-size: 1.5rem;
    line-height: 2rem;
  }

  .wide\:text-\[1\.0625rem\] {
    font-size: 1.0625rem;
  }

  .wide\:text-\[2\.6rem\] {
    font-size: 2.6rem;
  }

  .wide\:leading-\[1\.08\] {
    line-height: 1.08;
  }

  .wide\:leading-relaxed {
    line-height: 1.625;
  }

  .wide\:text-navy-foreground {
    color: var(--navy-foreground);
  }

  .wide\:text-navy-muted {
    color: var(--navy-muted);
  }

  .wide\:text-route {
    color: var(--route);
  }

  /* Homepage CTA button: orange on the navy desktop background. */
  .wide\:bg-route {
    background-color: var(--route);
  }

  .wide\:text-route-foreground {
    color: var(--route-foreground);
  }

  .wide\:hover\:bg-route\/90:hover {
    background-color: var(--route);
  }

  /* Additional desktop rules used across the site. */
  .wide\:flex-1 {
    flex: 1 1 0%;
  }

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

  .wide\:h-full {
    height: 100%;
  }

  .wide\:min-h-full {
    min-height: 100%;
  }

  .wide\:items-stretch {
    align-items: stretch;
  }

  .wide\:mt-5 {
    margin-block-start: 1.25rem;
  }

  .wide\:mt-8 {
    margin-block-start: 2rem;
  }

  .wide\:px-0 {
    padding-inline: 0;
  }

  .wide\:shrink-0 {
    flex-shrink: 0;
  }

  .wide\:text-sm {
    font-size: 0.875rem;
    line-height: 1.4285714;
  }

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

  .wide\:h-\[240px\] {
    height: 240px;
  }
}