/* ============================================
   Custom CSS Overrides for Frett27 Consulting Site
   
   This file loads AFTER the theme CSS, so your
   styles will override the theme's default styles.
   ============================================ */

/* ============================================
   Main Elements Overrides
   ============================================ */

/* Body fade-in animation */
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes fadeOutUp {
  from {
    opacity: 1;
    transform: translateY(20px);
  }
  to {
    opacity: 0;
    transform: translateY(0);
  }
}

body {
  /* animation: fadeIn 0.3s ease-in-out;
  animation: fadeOutUp 0.3s ease-in-out; */
}

.cover h1


.cover {
    animation: fadeIn 0.3s ease-in-out;
}

/* Fix cover bottom glitch - ensure clean transition */
header.cover,
header[class*="cover"] {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
    border-bottom: none !important;
    box-shadow: none !important;
    position: relative;
    z-index: 1;
}

header.cover > div,
header[class*="cover"] > div {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
    border-bottom: none !important;
}

/* Ensure no gap between header and main content */
main {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

article {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* Example: Override main container */
/* main {
  max-width: 1200px;
  margin: 0 auto;
} */

/* Example: Override heading styles */
/* h1 {
  font-size: 2.5rem;
  font-weight: 700;
  color: #2C5282;
} */

/* Example: Override navigation */
/* nav {
  background-color: #ffffff;
  box-shadow: 0 2px 4px rgba(0,0,0,0.1);
} */

/* Example: Override links */
/* a {
  color: #2C5282;
  text-decoration: none;
  transition: color 0.3s ease;
}

a:hover {
  color: #4299E1;
} */

/* Example: Override buttons */
/* button, .btn {
  background-color: #2C5282;
  color: white;
  padding: 0.75rem 1.5rem;
  border-radius: 4px;
  border: none;
  cursor: pointer;
  transition: background-color 0.3s ease;
}

button:hover, .btn:hover {
  background-color: #4299E1;
} */

/* ============================================
   Custom Utility Classes
   ============================================ */

/* Add your custom utility classes here */
/* Example:
.custom-shadow {
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}
*/

/* ============================================
   Responsive Adjustments
   ============================================ */

/* Mobile-specific overrides */
@media (max-width: 768px) {
  /* Example:
  h1 {
    font-size: 2rem;
  }
  */
}

/* Desktop-specific overrides */
@media (min-width: 769px) {
  /* Example:
  main {
    padding: 2rem;
  }
  */
}
