/* Tatamy Auto Service - Global Styles */
@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@300;400;500;600;700&family=Manrope:wght@300;400;500;600;700;800&display=swap');

:root {
  --primary: #003138;
  --on-primary: #ffffff;
  --primary-container: #004953;
  --on-primary-container: #7fb7c3;
  --secondary: #00696d;
  --on-secondary: #ffffff;
  --secondary-container: #a0f0f4;
  --on-secondary-container: #0f6f73;
  --tertiary: #10321c;
  --on-tertiary: #ffffff;
  --tertiary-container: #284931;
  --on-tertiary-container: #92b798;
  --surface: #f3fbfb;
  --on-surface: #151d1d;
  --surface-container-low: #edf5f5;
  --surface-container-lowest: #ffffff;
  --outline-variant: #bfc8ca;
  --mist: #f3fbfb;
  --lichen: #8FB495;
}

/* Glassmorphism Navigation */
.glass-nav {
  background: rgba(243, 251, 251, 0.8);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

/* No-Line Rule: Structure boundaries through color shifts */
section {
  border: none !important;
}

/* Typography */
.font-headline {
  font-family: 'Space Grotesk', sans-serif;
}
.font-body {
  font-family: 'Manrope', sans-serif;
}

/* Custom Utilities */
.editorial-shadow {
  box-shadow: 0 16px 24px -12px rgba(21, 29, 29, 0.06);
}

.hover-lift {
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.hover-lift:hover {
  transform: translateY(-4px);
  box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
}

.material-icons-outlined {
  font-family: 'Material Symbols Outlined';
  font-weight: normal;
  font-style: normal;
  font-size: 24px;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: 'liga';
  -webkit-font-smoothing: antialiased;
}