/* ==========================================================================
   PT GARUDA MITRA EQUIPMENT - DESIGN SYSTEM (DARK ZINC & INDUSTRIAL)
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@400;500;600;700;800;900&family=Plus+Jakarta+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;1,400&display=swap');

:root {
  --color-primary: #f59e0b;
  --color-primary-dark: #d97706;
  --color-accent: #ea580c;
  --color-dark: #09090b;       /* Zinc 950 */
  --color-dark-surface: #18181b; /* Zinc 900 */
  --color-dark-border: #27272a;  /* Zinc 800 */
  --color-body-bg: #fafafa;      /* Zinc 50 */
  --font-heading: 'Outfit', sans-serif;
  --font-body: 'Plus Jakarta Sans', sans-serif;
}

html {
  scroll-behavior: smooth;
  scroll-padding-top: 5.5rem;
}

body {
  font-family: var(--font-body);
  background-color: var(--color-body-bg);
  color: #3f3f46;
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6, .font-heading {
  font-family: var(--font-heading);
}

/* Custom Scrollbar */
::-webkit-scrollbar {
  width: 9px;
}
::-webkit-scrollbar-track {
  background: #f4f4f5;
}
::-webkit-scrollbar-thumb {
  background: #d4d4d8;
  border-radius: 9999px;
  border: 2px solid #f4f4f5;
}
::-webkit-scrollbar-thumb:hover {
  background: #f59e0b;
}

/* Industrial Grid Patterns (Clean Zinc, No Glow) */
.bg-grid-pattern {
  background-size: 32px 32px;
  background-image: 
    linear-gradient(to right, rgba(24, 24, 27, 0.04) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(24, 24, 27, 0.04) 1px, transparent 1px);
}

.bg-grid-dark {
  background-size: 40px 40px;
  background-image: 
    linear-gradient(to right, rgba(255, 255, 255, 0.04) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(255, 255, 255, 0.04) 1px, transparent 1px);
}

/* Subtle Topographic contour svg background */
.bg-contour-pattern {
  background-image: url("data:image/svg+xml,%3Csvg width='100' height='100' viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M11 18c3.866 0 7-3.134 7-7s-3.134-7-7-7-7 3.134-7 7 3.134 7 7 7zm48 25c3.866 0 7-3.134 7-7s-3.134-7-7-7-7 3.134-7 7 3.134 7 7 7zm-43-7c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm63 31c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zM34 90c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zm56-76c1.657 0 3-1.343 3-3s-1.343-3-3-3-3 1.343-3 3 1.343 3 3 3zM12 86c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm28-65c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm23-11c2.76 0 5-2.24 5-5s-2.24-5-5-5-5 2.24-5 5 2.24 5 5 5zm-6 60c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm29 22c2.76 0 5-2.24 5-5s-2.24-5-5-5-5 2.24-5 5 2.24 5 5 5zM32 63c2.76 0 5-2.24 5-5s-2.24-5-5-5-5 2.24-5 5 2.24 5 5 5zm57-13c2.76 0 5-2.24 5-5s-2.24-5-5-5-5 2.24-5 5 2.24 5 5 5zm-9-21c1.105 0 2-.895 2-2s-.895-2-2-2-2 .895-2 2 .895 2 2 2zM60 91c1.105 0 2-.895 2-2s-.895-2-2-2-2 .895-2 2 .895 2 2 2zM35 41c1.105 0 2-.895 2-2s-.895-2-2-2-2 .895-2 2 .895 2 2 2zM12 60c1.105 0 2-.895 2-2s-.895-2-2-2-2 .895-2 2 .895 2 2 2z' fill='%23ea580c' fill-opacity='0.03' fill-rule='evenodd'/%3E%3C/svg%3E");
}

/* Glassmorphism Clean Classes */
.glass-nav {
  background-color: rgba(255, 255, 255, 0.92);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

.glass-nav-scrolled {
  background-color: rgba(255, 255, 255, 0.98);
  box-shadow: 0 4px 20px -2px rgba(9, 9, 11, 0.06);
}

.glass-card-dark {
  background: #18181b;
  border: 1px solid #27272a;
}

.glass-pill {
  background: rgba(255, 255, 255, 0.9);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border: 1px solid rgba(228, 228, 231, 0.8);
}

/* Hover Transitions */
.card-hover-effect {
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

.card-hover-effect:hover {
  transform: translateY(-5px);
  box-shadow: 0 16px 24px -6px rgba(9, 9, 11, 0.08);
}

/* Accordion Smooth Height */
.accordion-content {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}

.accordion-content.open {
  max-height: 500px;
}

/* Equipment Card Image Zoom */
.equipment-image-container {
  overflow: hidden;
}

.equipment-image-container img {
  transition: transform 0.5s cubic-bezier(0.16, 1, 0.3, 1);
}

.equipment-card:hover .equipment-image-container img {
  transform: scale(1.05);
}

/* Timeline Custom Connectors */
.timeline-dot {
  position: relative;
  z-index: 10;
}

/* Modal Overlay */
.modal-overlay {
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s ease, visibility 0.3s ease;
}

.modal-overlay.active {
  opacity: 1;
  visibility: visible;
}

.modal-content {
  transform: scale(0.95) translateY(20px);
  transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

.modal-overlay.active .modal-content {
  transform: scale(1) translateY(0);
}

/* Form focus effects */
.form-input-focus:focus {
  border-color: #f59e0b;
  box-shadow: 0 0 0 2px rgba(245, 158, 11, 0.2);
}

/* Print Cleanliness */
@media print {
  .no-print {
    display: none !important;
  }
}

/* White filter utility */
.img-white {
  filter: brightness(0) invert(1) !important;
}