/* Big Rig Wraps - Premium Modern Site Styles
   Custom enhancements beyond Tailwind CDN
*/

:root {
  --brand-navy: #0F172A;
  --brand-charcoal: #1E2937;
  --brand-orange: #EA580C;
  --brand-amber: #F59E0B;
  --brand-light: #F8FAFC;
}

/* Smooth everything */
html {
  scroll-behavior: smooth;
}

/* Premium typography tweaks */
h1, h2, h3 {
  font-feature-settings: "tnum" "kern" "liga";
  text-wrap: balance;
}

/* Hero text shadow for readability on photos */
.hero-text-shadow {
  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
}

/* Card hover lift - consistent premium feel */
.card {
  transition: transform 0.2s cubic-bezier(0.4, 0, 0.2, 1), 
              box-shadow 0.2s cubic-bezier(0.4, 0.0, 0.2, 1),
              border-color 0.2s;
}
.card:hover {
  transform: translateY(-4px);
  box-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.05), 0 8px 10px -6px rgb(0 0 0 / 0.05);
}

/* Orange accent underline for section titles */
.section-title::after {
  content: '';
  display: block;
  width: 48px;
  height: 3px;
  background: linear-gradient(to right, #EA580C, #F59E0B);
  margin-top: 12px;
  border-radius: 3px;
}

/* Portfolio filter buttons */
.filter-btn {
  transition: all 0.15s ease;
}
.filter-btn.active {
  background-color: #0F172A;
  color: white;
  border-color: #0F172A;
}

/* Lightbox */
.lightbox {
  animation: fadeIn 0.2s ease forwards;
}
@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

/* Form improvements */
input, textarea, select {
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
input:focus, textarea:focus, select:focus {
  border-color: #EA580C;
  box-shadow: 0 0 0 3px rgba(234, 88, 12, 0.1);
  outline: none;
}

/* Stats number animation ready */
.stat-number {
  font-variant-numeric: tabular-nums;
}

/* Mobile nav */
.mobile-nav {
  transition: transform 0.3s cubic-bezier(0.32, 0.72, 0, 1), opacity 0.2s;
}
.mobile-nav.hidden {
  transform: translateX(100%);
  opacity: 0;
}

/* Trust logos */
.trust-logo {
  filter: grayscale(100%) contrast(0.9);
  transition: filter 0.2s ease;
  opacity: 0.7;
}
.trust-logo:hover {
  filter: grayscale(0%) contrast(1);
  opacity: 1;
}

/* Quote form success state */
.form-success {
  animation: popIn 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}
@keyframes popIn {
  from { transform: scale(0.95); opacity: 0; }
  to { transform: scale(1); opacity: 1; }
}

/* Accessibility - focus visible */
a:focus-visible, button:focus-visible {
  outline: 2px solid #EA580C;
  outline-offset: 2px;
}

/* Print friendly (for quotes etc) */
@media print {
  .no-print { display: none !important; }
}