/* ============================================================
   styles.css — RMPL Website
   Combined from all Google Stitch HTML files
   ============================================================ */

/* ============================================================
   1. MATERIAL ICONS — Global setting
   Used in: ALL pages
   ============================================================ */
.material-symbols-outlined {
  font-variation-settings:
    "FILL" 0,
    "wght" 400,
    "GRAD" 0,
    "opsz" 24;
}

/* ============================================================
   2. HOME PAGE styles
   Was in: home.html <style> tag
   ============================================================ */
.active-nav-border {
  border-bottom-width: 2px;
}

.hero-gradient {
  background: linear-gradient(rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.4));
}

.card-border {
  border: 1px solid #e2e8f0;
}

.industrial-shadow {
  box-shadow: 0px 4px 0px rgba(0, 0, 0, 0.05);
}

/* ============================================================
   3. ABOUT PAGE styles
   Was in: about.html <style> tag
   ============================================================ */
.material-symbols-outlined {
  font-variation-settings:
    "FILL" 0,
    "wght" 400,
    "GRAD" 0,
    "opsz" 24;
}

.hero-overlay {
  background: linear-gradient(rgba(13, 28, 50, 0.7), rgba(13, 28, 50, 0.7));
}

/* ============================================================
   4. CONTACT PAGE styles
   Was in: contact us.html <style> tag
   ============================================================ */
.material-symbols-outlined {
  font-variation-settings:
    "FILL" 0,
    "wght" 400,
    "GRAD" 0,
    "opsz" 24;
}
.industrial-grid-bg {
  background-image: radial-gradient(#c5c6cd 0.5px, transparent 0.5px);
  background-size: 24px 24px;
}

/* ============================================================
   5. GALLERY PAGE styles
   Was in: gallery.html <style> tag
   ============================================================ */
.material-symbols-outlined {
  font-variation-settings:
    "FILL" 0,
    "wght" 400,
    "GRAD" 0,
    "opsz" 24;
}
.pressed-state:active {
  transform: translateY(1px);
}

/* ============================================================
   6. PRODUCTS PAGE styles
   Was in: products.html <style> tag
   ============================================================ */
.material-symbols-outlined {
  font-variation-settings:
    "FILL" 0,
    "wght" 400,
    "GRAD" 0,
    "opsz" 24;
}
.pressed-state:active {
  transform: translateY(1px);
}
.industrial-border {
  border: 1px solid #e2e8f0;
}
.heavy-button-shadow {
  border-bottom: 2px solid #643900;
}
/* ============================================================
   7. SERVICES PAGE styles
   Was in: services.html <style> tag
   ============================================================ */
.material-symbols-outlined {
  font-variation-settings:
    "FILL" 0,
    "wght" 400,
    "GRAD" 0,
    "opsz" 24;
}
body {
  font-family: "Inter", sans-serif;
}
h1,
h2,
h3,
.font-display {
  font-family: "Montserrat", sans-serif;
}
.label-caps {
  font-family: "IBM+Plex+Sans", sans-serif;
}
