/* Import Montserrat font */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;700;900&display=swap');

/* Overall site font */
body,
button,
input,
select,
textarea {
  font-family: 'Montserrat', sans-serif !important;
}

/* Remove site title since the hero image already has the branding */
.site-branding,
.site-title,
.site-title a,
.site-description {
  display: none !important;
}

/* Header area */
.site-header {
  display: block !important;
  text-align: center !important;
  padding: 35px 30px 20px 30px !important;
  overflow: visible !important;
  position: relative !important;
  z-index: 9999 !important;
}

/* Center navigation without cutting it off */
.main-navigation {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  position: relative !important;
  left: auto !important;
  right: auto !important;
  transform: none !important;
  margin: 0 auto 45px auto !important;
  padding: 0 !important;
  text-align: center !important;
  clear: both !important;
  float: none !important;
  overflow: visible !important;
  z-index: 99999 !important;
}

/* Center top-level nav buttons */
.main-navigation ul,
.main-navigation .menu,
.main-navigation .nav-menu,
.primary-menu {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 22px !important;
  margin: 0 auto !important;
  padding: 0 !important;
  list-style: none !important;
  text-align: center !important;
  width: 100% !important;
  max-width: 100% !important;
}

/* Top-level nav items */
.main-navigation .menu > li,
.main-navigation .nav-menu > li,
.primary-menu > li {
  position: relative !important;
  display: inline-block !important;
  margin: 0 !important;
  padding: 0 0 16px 0 !important;
  float: none !important;
}

/* Top-level nav buttons: pink */
.main-navigation .menu > li > a,
.main-navigation .nav-menu > li > a,
.primary-menu > li > a,
.main-navigation .menu > li > a:visited,
.main-navigation .nav-menu > li > a:visited,
.primary-menu > li > a:visited {
  font-family: 'Montserrat', sans-serif !important;
  font-weight: 700 !important;
  background-color: #d681ba !important;
  color: #ffffff !important;
  padding: 8px 18px !important;
  border-radius: 22px !important;
  text-decoration: none !important;
  display: inline-block !important;
  margin: 0 !important;
  line-height: 1.2 !important;
  box-shadow: none !important;
  border: none !important;
  transition: all 0.2s ease;
}

/* Top-level nav hover: blue */
.main-navigation .menu > li > a:hover,
.main-navigation .menu > li > a:focus,
.main-navigation .nav-menu > li > a:hover,
.main-navigation .nav-menu > li > a:focus,
.primary-menu > li > a:hover,
.primary-menu > li > a:focus {
  background-color: #576ca8 !important;
  color: #ffffff !important;
  text-decoration: none !important;
}

/* Current/active top-level nav page */
.main-navigation .current-menu-item > a,
.main-navigation .current_page_item > a,
.main-navigation .current-menu-ancestor > a {
  background-color: #576ca8 !important;
  color: #ffffff !important;
}

/* Dropdown container: clean pink/blue/white only */
.main-navigation ul ul,
.main-navigation .sub-menu,
.main-navigation .children {
  display: none !important;
  position: absolute !important;
  top: 100% !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  width: 245px !important;
  min-width: 245px !important;
  max-width: 245px !important;
  margin: -16px 0 0 0 !important;
  padding: 12px !important;
  background: #ffffff !important;
  border: none !important;
  border-radius: 22px !important;
  box-shadow: 0 8px 18px rgba(0, 0, 0, 0.12) !important;
  list-style: none !important;
  z-index: 999999 !important;
  text-align: center !important;
}

/* Keep dropdown open while hovering */
.main-navigation li:hover > ul,
.main-navigation li:focus-within > ul,
.main-navigation ul ul:hover,
.main-navigation .sub-menu:hover {
  display: block !important;
}

/* Dropdown list items */
.main-navigation ul ul li,
.main-navigation .sub-menu li,
.main-navigation .children li {
  display: block !important;
  width: 100% !important;
  margin: 0 0 8px 0 !important;
  padding: 0 !important;
  float: none !important;
  border: none !important;
  box-shadow: none !important;
}

/* Remove margin from last dropdown item */
.main-navigation ul ul li:last-child,
.main-navigation .sub-menu li:last-child,
.main-navigation .children li:last-child {
  margin-bottom: 0 !important;
}

/* Dropdown links: pink */
.main-navigation ul ul a,
.main-navigation .sub-menu a,
.main-navigation .children a,
.main-navigation ul ul a:visited,
.main-navigation .sub-menu a:visited,
.main-navigation .children a:visited {
  font-family: 'Montserrat', sans-serif !important;
  font-weight: 700 !important;
  background-color: #d681ba !important;
  color: #ffffff !important;
  padding: 10px 14px !important;
  border-radius: 20px !important;
  display: block !important;
  width: auto !important;
  text-align: center !important;
  text-decoration: none !important;
  line-height: 1.25 !important;
  white-space: normal !important;
  box-shadow: none !important;
  border: none !important;
}

/* Dropdown hover: blue */
.main-navigation ul ul a:hover,
.main-navigation ul ul a:focus,
.main-navigation .sub-menu a:hover,
.main-navigation .sub-menu a:focus,
.main-navigation .children a:hover,
.main-navigation .children a:focus {
  background-color: #576ca8 !important;
  color: #ffffff !important;
  text-decoration: none !important;
}

/* Remove old dropdown lines from theme */
.main-navigation ul ul,
.main-navigation ul ul *,
.main-navigation .sub-menu,
.main-navigation .sub-menu * {
  border-top: none !important;
  border-bottom: none !important;
  outline: none !important;
}

/* H1: Montserrat Black, pink */
h1,
.entry-title,
.page-title {
  font-family: 'Montserrat', sans-serif !important;
  font-weight: 900 !important;
  color: #d681ba !important;
}

/* H2: Montserrat Bold, blue */
h2 {
  font-family: 'Montserrat', sans-serif !important;
  font-weight: 700 !important;
  color: #576ca8 !important;
}

/* Paragraph/body text: Montserrat Regular, black */
body,
p,
.entry-content,
.entry-content p {
  font-family: 'Montserrat', sans-serif !important;
  font-weight: 400 !important;
  color: #000000 !important;
}

/* Yellow accent divider lines: match header width and center underneath */
h1,
h2,
.entry-title,
.page-title {
  display: table !important;
}

/* Yellow accent divider lines under H1 and H2 */
h1::after,
h2::after,
.entry-title::after,
.page-title::after {
  content: "";
  display: block;
  width: 100%;
  height: 4px;
  background-color: #fed766;
  margin: 8px auto 0 auto;
  border-radius: 4px;
}

/* Hero/header image area: no outer box */
.custom-header,
.header-image,
.site-header .wp-block-image,
.home .entry-content > .wp-block-image:first-of-type,
.home .entry-content > figure.wp-block-image:first-of-type {
  background: transparent !important;
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 auto !important;
  max-width: none !important;
}

/* Hero/header image itself: rounded corners */
.custom-header img,
.header-image img,
.site-header .wp-block-image img,
.home .entry-content > .wp-block-image:first-of-type img,
.home .entry-content > figure.wp-block-image:first-of-type img {
  border-radius: 22px !important;
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
  display: block !important;
  width: 100% !important;
}

/* Regular buttons: pink with blue shadow */
button,
input[type="button"],
input[type="submit"],
.wp-block-button__link,
.more-link {
  font-family: 'Montserrat', sans-serif !important;
  font-weight: 700 !important;
  background-color: #d681ba !important;
  color: #ffffff !important;
  border-color: #d681ba !important;
  box-shadow: 4px 4px 0 #576ca8 !important;
  transition: all 0.2s ease;
}

/* Regular button hover: blue with yellow shadow */
button:hover,
input[type="button"]:hover,
input[type="submit"]:hover,
.wp-block-button__link:hover,
.more-link:hover {
  background-color: #576ca8 !important;
  border-color: #576ca8 !important;
  color: #ffffff !important;
  box-shadow: 4px 4px 0 #fed766 !important;
}

/* Mobile/tablet adjustment */
@media screen and (max-width: 768px) {
  .site-header {
    padding: 24px 15px 18px 15px !important;
  }

  .main-navigation {
    margin-bottom: 28px !important;
  }

  .main-navigation ul,
  .main-navigation .menu,
  .main-navigation .nav-menu,
  .primary-menu {
    gap: 10px !important;
  }

  .main-navigation .menu > li,
  .main-navigation .nav-menu > li,
  .primary-menu > li {
    padding-bottom: 8px !important;
  }

  .main-navigation ul ul,
  .main-navigation .sub-menu,
  .main-navigation .children {
    position: static !important;
    transform: none !important;
    width: 100% !important;
    min-width: 100% !important;
    max-width: 100% !important;
    margin: 8px auto 0 auto !important;
  }
}

/* Formidable Forms: make labels/text visible */
.frm_forms,
.frm_forms label,
.frm_forms .frm_primary_label,
.frm_forms .frm_description,
.frm_forms .frm_required,
.frm_forms .frm_form_field,
.frm_forms .frm_field_description,
.frm_forms .frm_form_field div,
.frm_forms .frm_form_field span {
  font-family: 'Montserrat', sans-serif !important;
  color: #000000 !important;
  background: transparent !important;
}

/* Required asterisks */
.frm_forms .frm_required,
.frm_forms .frm_required_field {
  color: #d681ba !important;
}

/* Formidable Forms: input and textarea styling */
.frm_forms input[type="text"],
.frm_forms input[type="email"],
.frm_forms input[type="url"],
.frm_forms input[type="tel"],
.frm_forms input[type="number"],
.frm_forms textarea,
.frm_forms select {
  font-family: 'Montserrat', sans-serif !important;
  color: #000000 !important;
  background-color: #ffffff !important;
  border: 1px solid #cfd6df !important;
  border-radius: 10px !important;
  box-shadow: none !important;
}

/* Text typed inside fields */
.frm_forms input,
.frm_forms textarea {
  color: #000000 !important;
}

/* Placeholder text */
.frm_forms input::placeholder,
.frm_forms textarea::placeholder {
  color: #666666 !important;
  opacity: 1 !important;
}

/* Formidable Forms submit button: pink with blue shadow */
.frm_forms .frm_submit button,
.frm_forms .frm_button_submit,
.frm_forms input[type="submit"],
.frm_forms button[type="submit"] {
  font-family: 'Montserrat', sans-serif !important;
  font-weight: 700 !important;
  background-color: #d681ba !important;
  color: #ffffff !important;
  border: none !important;
  border-radius: 12px !important;
  padding: 10px 18px !important;
  box-shadow: 4px 4px 0 #576ca8 !important;
  text-decoration: none !important;
  cursor: pointer !important;
  transition: all 0.2s ease !important;
}

/* Formidable Forms submit hover: blue with yellow shadow */
.frm_forms .frm_submit button:hover,
.frm_forms .frm_button_submit:hover,
.frm_forms input[type="submit"]:hover,
.frm_forms button[type="submit"]:hover {
  background-color: #576ca8 !important;
  color: #ffffff !important;
  box-shadow: 4px 4px 0 #fed766 !important;
}

/* Force Formidable submit button to match site buttons */
.with_frm_style .frm_submit button,
.with_frm_style .frm_submit input[type="submit"],
.with_frm_style button.frm_button_submit,
.with_frm_style .frm_button_submit,
.frm_forms .frm_submit button,
.frm_forms .frm_submit input[type="submit"],
.frm_forms button.frm_button_submit,
.frm_forms .frm_button_submit {
  font-family: 'Montserrat', sans-serif !important;
  font-weight: 700 !important;
  background: #d681ba !important;
  background-color: #d681ba !important;
  background-image: none !important;
  color: #ffffff !important;
  border: none !important;
  border-radius: 12px !important;
  padding: 10px 18px !important;
  box-shadow: 4px 4px 0 #576ca8 !important;
  text-decoration: none !important;
  cursor: pointer !important;
  transition: all 0.2s ease !important;
}

/* Formidable submit button hover */
.with_frm_style .frm_submit button:hover,
.with_frm_style .frm_submit input[type="submit"]:hover,
.with_frm_style button.frm_button_submit:hover,
.with_frm_style .frm_button_submit:hover,
.frm_forms .frm_submit button:hover,
.frm_forms .frm_submit input[type="submit"]:hover,
.frm_forms button.frm_button_submit:hover,
.frm_forms .frm_button_submit:hover {
  background: #576ca8 !important;
  background-color: #576ca8 !important;
  background-image: none !important;
  color: #ffffff !important;
  border: none !important;
  box-shadow: 4px 4px 0 #fed766 !important;
}

/* Make individual portfolio posts wider */
.single-post .site-content {
  max-width: 1400px;
  width: 90%;
  margin: 0 auto;
}

/* Remove the date/author/edit column on the left */
.single-post .entry-meta {
  display: none;
}

/* Let the post content use more space */
.single-post .content-area,
.single-post .site-main,
.single-post article,
.single-post .entry-content {
  width: 100%;
  max-width: none;
}

/* Pull the post content back to the left */
.single-post .entry-header,
.single-post .entry-content {
  margin-left: 0;
}
/* Hide sidebar on individual posts */
.single-post .widget-area,
.single-post #secondary {
  display: none;
}

/* Make the main post area full width after hiding sidebar */
.single-post .content-area,
.single-post #primary {
  width: 100%;
  float: none;
  margin: 0 auto;
}
.single-post .entry-meta,
.single-post .posted-on,
.single-post .byline,
.single-post .edit-link {
  display: none !important;
}

/* Make single portfolio posts feel like full case study pages */
.single-post #primary,
.single-post .content-area,
.single-post .site-main,
.single-post article,
.single-post .entry-content {
  width: 100% !important;
  max-width: none !important;
  margin-left: auto !important;
  margin-right: auto !important;
  float: none !important;
}

/* Center the post title area */
.single-post .entry-header {
  max-width: 1100px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Center and enlarge image blocks */
.single-post .entry-content .wp-block-image,
.single-post .entry-content figure {
  max-width: 1100px !important;
  width: 90% !important;
  margin: 2rem auto !important;
  float: none !important;
  text-align: center !important;
}

/* Make the actual images fill the image block */
.single-post .entry-content .wp-block-image img,
.single-post .entry-content figure img {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Override right/left aligned images */
.single-post .entry-content .alignright,
.single-post .entry-content .alignleft,
.single-post .entry-content .aligncenter {
  float: none !important;
  display: block !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
/* Keep small GIFs from stretching full width */
.single-post .entry-content .wp-block-image.small-gif {
  width: 120px !important;
  max-width: 120px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

.single-post .entry-content .wp-block-image.small-gif img {
  width: 120px !important;
  max-width: 120px !important;
  height: auto !important;
}

/* Fix galleries inside posts so they display in rows instead of full-screen */
.single-post .entry-content .wp-block-gallery,
.single-post .entry-content figure.wp-block-gallery {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 24px !important;
  width: 90% !important;
  max-width: 1100px !important;
  margin: 2rem auto !important;
}

/* Make gallery images 3 across */
.single-post .entry-content .wp-block-gallery.has-nested-images figure.wp-block-image,
.single-post .entry-content .wp-block-gallery figure.wp-block-image {
  width: calc((100% - 48px) / 3) !important;
  max-width: calc((100% - 48px) / 3) !important;
  margin: 0 !important;
  flex: 0 0 calc((100% - 48px) / 3) !important;
}

/* Keep the image inside each gallery item contained */
.single-post .entry-content .wp-block-gallery figure.wp-block-image img {
  width: 100% !important;
  height: auto !important;
  display: block !important;
}

/* Tablet: 2 across */
@media (max-width: 900px) {
  .single-post .entry-content .wp-block-gallery.has-nested-images figure.wp-block-image,
  .single-post .entry-content .wp-block-gallery figure.wp-block-image {
    width: calc((100% - 24px) / 2) !important;
    max-width: calc((100% - 24px) / 2) !important;
    flex-basis: calc((100% - 24px) / 2) !important;
  }
}

/* Phone: 1 across */
@media (max-width: 600px) {
  .single-post .entry-content .wp-block-gallery.has-nested-images figure.wp-block-image,
  .single-post .entry-content .wp-block-gallery figure.wp-block-image {
    width: 100% !important;
    max-width: 100% !important;
    flex-basis: 100% !important;
  }
}

/* Left-align project post headings and yellow divider */
.single-post .entry-title,
.single-post .entry-content h1,
.single-post .entry-content h2,
.single-post .entry-content .wp-block-heading {
  display: table !important;
  text-align: left !important;
  margin-left: 0 !important;
  margin-right: auto !important;
}

/* Keep yellow line under the heading text */
.single-post .entry-title::after,
.single-post .entry-content h1::after,
.single-post .entry-content h2::after,
.single-post .entry-content .wp-block-heading::after {
  margin-left: 0 !important;
  margin-right: auto !important;
}

/* Smaller videos inside portfolio posts */
.single-post .entry-content .wp-block-video.small-project-video {
  max-width: 500px !important;
  width: 100% !important;
  margin: 2rem auto !important;
}

.single-post .entry-content .wp-block-video.small-project-video video {
  width: 100% !important;
  height: auto !important;
  display: block !important;
}