/* Font Imports */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500&family=Merriweather:wght@400;700&display=swap');



/* Global Typography */

body {

  font-family: 'Inter', sans-serif;

  font-size: 16px;

  line-height: 1.6;

  color: #333;

  background-color: #fff;

  margin: 0;

  padding: 0;

}



h1, h2, h3, h4, h5, h6 {

  font-family: 'Merriweather', serif;

  font-weight: 700;

  color: #111;

  line-height: 1.3;

  margin-bottom: 0.75em;

}



p, li {

  font-family: 'Inter', sans-serif;

  font-weight: 300;

  color: #333;

}



/* --- CTA Button Styling (for pages and blocks) --- */

.cta, .cta-button, .wp-block-button__link {

  background-color: #f4d35e !important;

  color: #000 !important;

  padding: 0.75em 1.5em;

  border-radius: 999px;

  text-decoration: none;

  font-weight: 600;

  display: inline-block;

  transition: background-color 0.3s ease, color 0.3s ease;

  border: none !important;

}



.cta:hover, .cta-button:hover, .wp-block-button__link:hover {

  background-color: #ee6c4d !important;

  color: #fff !important;

}



/* Fix for "button within a button" issue on reusable patterns */

.wp-block-button,

.wp-block-button:hover {

  background-color: transparent !important;

  border: none !important;

}



/* --- Featured Image Styling (Responsive Aspect Ratio) --- */

.featured-image-container {

  position: relative;

  overflow: hidden;

  padding-bottom: 33.333%; /* 3:1 aspect ratio for large screens */

}



.featured-image-container img {

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  object-fit: cover;

  object-position: top;

}



/* --- Other Global Styling --- */

img {

  max-width: 100%;

  height: auto;

  display: block;

  margin: 1em 0;

}



.wp-caption {

  margin-bottom: 1.5em;

  position: relative;

}



.wp-caption img {

  display: block;

  margin: 0;

}



.wp-caption-text {

  font-size: 0.75rem;

  font-style: italic;

  color: #666;

  text-align: right;

  margin-top: 0.25em;

  margin-bottom: 0;

  padding-right: 4px;

  position: relative;

  bottom: 0;

}



/* --- Menu Button Styling --- */

/* This rule is highly specific and will not conflict with the plugin */

#menu-item-1978 a {

    background-color: #f4d35e !important;

    color: #000 !important;

    padding: 0.75em 1.5em !important;

    border-radius: 999px !important;

    text-decoration: none !important;

    font-weight: 600 !important;

    display: inline-block !important;

}



/* Hover state for the buttons */

#menu-item-1978 a:hover {

    background-color: #ee6c4d !important;

    color: #fff !important;

}



/* --- Responsive Layout Tweaks --- */

/* Adjust aspect ratio for different screen sizes */

@media (max-width: 768px) {

  body {

    font-size: 15px;

    line-height: 1.5;

  }



  .wp-block-button__link,

  .cta,

  .nav-button > a {

    padding: 0.6em 1em;

    font-size: 0.95rem;

  }



  h1 {

    font-size: 1.75rem;

  }



  h2 {

    font-size: 1.5rem;

  }



  h3 {

    font-size: 1.25rem;

  }



  .wp-caption-text {

    font-size: 0.7rem;

    padding-right: 2px;

  }



  .featured-image-container {

    padding-bottom: 50%;

  }

}



@media (max-width: 480px) {

  .featured-image-container {

    padding-bottom: 66.666%;

  }

}
/* Kadence-Specific Fix: Right-justify navigation when wrapping */

/* 1. Target the main navigation container (ul) */
.main-navigation ul {
    text-align: right; 
    /* This aligns the list items (li) to the right when they wrap */
}

/* 2. Ensure the list itself doesn't unnecessarily stretch */
.main-navigation {
    width: 100%;
}