@import url('https://api.fontshare.com/v2/css?f[]=satoshi@300,400,500,600,700,800,900&display=swap');

.text-gradient {
  background: linear-gradient(to right, #FD756E, #ff9a94);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.section-title,
.section-title h2 {
  font-family: 'Satoshi', sans-serif;
  font-size: clamp(2rem, 3.5vw, 2.8rem);
  font-weight: 700;
  line-height: 1.15;
  letter-spacing: -0.02em;
  color: #263469;
  text-align: center !important;
  margin: 0 auto 0.25rem;
  text-wrap: balance;
}

.section-subtitle,
.section-subtitle p {
  font-family: 'Satoshi', sans-serif;
  font-size: 0.95rem;
  font-weight: 400;
  line-height: 1.75;
  color: rgba(38, 52, 105, 0.55);
  text-align: center !important;
  margin: 0 auto 1.25rem;
  max-width: 36rem;
}

/* Customer dashboard text color override - matches storefront copy color */

.py-5-nav,
.py-5-nav .card,
.py-5-nav h1,
.py-5-nav h2,
.py-5-nav h3,
.py-5-nav h4,
.py-5-nav h5,
.py-5-nav h6,
.py-5-nav p,
.py-5-nav span,
.py-5-nav a,
.py-5-nav small,
.py-5-nav label,
.py-5-nav li {
  color: #4a3530;
}

.py-5-nav .text-muted {
  color: rgba(74, 53, 48, 0.55) !important;
}

.py-5-nav .text-primary {
  color: #F4416C !important;
}

.py-5-nav a {
  color: #4a3530;
}

.py-5-nav a:hover {
  color: #F4416C;
}

/* Tables */
.py-5-nav .table,
.py-5-nav .table th,
.py-5-nav .table td,
.py-5-nav .table thead th,
.py-5-nav .table tbody td {
  color: #4a3530;
}

.py-5-nav .table .text-muted {
  color: rgba(74, 53, 48, 0.55) !important;
}

.py-5-nav .text-accent-500 {
  color: #F4416C !important;
}

.py-5-nav .btn-link {
  color: #F4416C;
}

.py-5-nav .btn-link:hover {
  color: #e03060;
}