@import url('https://fonts.googleapis.com/css2?family=Source+Sans+3:wght@300;400;500;600&display=swap');


/* == TYPOGRAPHY == */

body,
h1, h2, h3, h4, h5, h6,
.site-title, .site-title a,
.site-description,
.entry-title, .entry-title a,
.main-navigation a,
.main-navigation li,
p, a, li, span, div,
.widget, .widget-title,
#colophon, #colophon a {
  font-family: 'Source Sans 3', -apple-system, sans-serif !important;
}

body {
  font-size: 16px !important;
  line-height: 1.7 !important;
  color: #2a2a2a !important;
  font-weight: 400 !important;
}

h1, h2, h3,
.site-title, .site-title a,
.entry-title, .entry-title a {
  font-weight: 400 !important;
  letter-spacing: -0.01em !important;
  line-height: 1.2 !important;
}


/* == STICKY HEADER == */

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

#masthead {
  position: -webkit-sticky !important;
  position: sticky !important;
  top: 0 !important;
  width: 100% !important;
  z-index: 9999 !important;
  background: #ffffff !important;
  transform: translateZ(0) !important;
  -webkit-transform: translateZ(0) !important;
  border-bottom: 1px solid rgba(0,0,0,0.08) !important;
  padding-top: 50px !important;
  padding-bottom: 0px !important;
	padding-left: 10px !important;
	padding-right: 10px !important;
}

#masthead .wrapper,
#masthead .site-header-main,
#masthead > .wrapper {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

#masthead .main-navigation a {
  color: #555 !important;
  transition: color 0.2s !important;
}

#masthead .main-navigation a:hover {
  color: #111 !important;
}

#page {
  padding-top: 0 !important;
}

@media screen and (max-width: 768px) {
  #masthead {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    padding-top: 14px !important;
    padding-bottom: 14px !important;
  }

  #page,
  #content,
  .site-content {
    padding-top: 80px !important;
  }
}


/* == TWO-LINE HEADER BRANDING == */

.site-branding {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
}

.site-title,
.site-title a,
#masthead .site-title,
#masthead .site-title a {
  font-size: 24px !important;
  font-weight: 500 !important;
  letter-spacing: -0.01em !important;
  line-height: 1.1 !important;
  color: #111 !important;
  text-decoration: none !important;
  display: block !important;
}

.site-description,
#masthead .site-description {
  font-size: 12px !important;
  letter-spacing: 0.10em !important;
  text-transform: uppercase !important;
  color: #999 !important;
  margin-top: 3px !important;
  display: block !important;
  line-height: 1 !important;
}


/* == HIDE HOMEPAGE PAGE TITLE ONLY == */

.home .page-header {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

.home #content {
  padding-top: 24px !important;
}


/* == REMOVE DECORATIVE LINES == */

.hfeed,
#main .hfeed,
#primary .hfeed {
  border-top: none !important;
  border-bottom: none !important;
}

.nav-links,
.posts-navigation,
.post-navigation,
#nav-below,
#nav-above {
  border-top: none !important;
  border-bottom: none !important;
}


/* == PROJECT CARD TITLES == */

article.type-portfolio .entry-title,
.portfolio-entry .entry-title {
  display: block !important;
  font-size: 14px !important;
  padding: 10px 4px 4px !important;
  margin: 0 !important;
  font-weight: 400 !important;
}

article.type-portfolio .entry-title a,
.portfolio-entry .entry-title a {
  display: block !important;
  color: #111 !important;
  text-decoration: none !important;
}


/* == PROJECT CARD HOVER == */

.portfolio-entry,
article.type-portfolio {
  overflow: hidden !important;
  border-radius: 6px !important;
  transition: box-shadow 0.25s ease !important;
}

.portfolio-entry:hover,
article.type-portfolio:hover {
  box-shadow: 0 4px 18px rgba(0,0,0,0.10) !important;
}

.portfolio-entry img,
article.type-portfolio img {
  transition: transform 0.4s ease !important;
  display: block !important;
  width: 100% !important;
}

.portfolio-entry:hover img,
article.type-portfolio:hover img {
  transform: scale(1.04) !important;
}


/* == FOOTER == */

#colophon {
  border-top: 1px solid rgba(0,0,0,0.09) !important;
  border-bottom: none !important;
  padding: 28px 40px 24px !important;
  margin-top: 48px !important;
  background: #fff !important;
}

#colophon .widget-area,
#colophon .footer-widget-area,
#colophon .footer-sidebar {
  border: none !important;
  border-top: none !important;
  border-bottom: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

#colophon .site-info {
  display: none !important;
}

#colophon .menu,
#colophon ul {
  list-style: none !important;
  margin: 0 0 16px !important;
  padding: 0 !important;
  text-align: center !important;
}

#colophon .menu li,
#colophon ul li {
  display: inline-block !important;
  margin-right: 20px !important;
}

#colophon .menu li:last-child,
#colophon ul li:last-child {
  margin-right: 0 !important;
}

#colophon .menu li a,
#colophon ul li a {
  font-size: 13px !important;
  color: #777 !important;
  text-decoration: none !important;
}

#colophon .menu li a:hover,
#colophon ul li a:hover {
  color: #111 !important;
}

#colophon::after {
  content: "2026 Lauren Frohne  All rights reserved" !important;
  display: block !important;
  text-align: center !important;
  font-size: 11px !important;
  color: #bbb !important;
  padding-top: 14px !important;
  border-top: 1px solid rgba(0,0,0,0.06) !important;
  margin-top: 16px !important;
}


/* == FILTER PILL STYLES == */

#portfolio-filters {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  margin: 24px 0 20px !important;
  padding: 0 !important;
  list-style: none !important;
}

.filter-btn {
  font-size: 13px !important;
  padding: 6px 16px !important;
  border-radius: 20px !important;
  border: 1px solid #ccc !important;
  background: #fff !important;
  color: #666 !important;
  cursor: pointer !important;
  transition: all 0.2s ease !important;
  font-family: inherit !important;
}

.filter-btn:hover {
  border-color: #888 !important;
  color: #111 !important;
}

.filter-btn.active {
  background: #111 !important;
  border-color: #111 !important;
  color: #fff !important;
}

.portfolio-item-hidden {
  display: none !important;
}

/* == REMOVE PAGE-CONTENT BORDERS == */

.page-content,
.home .page-content {
  border-top: none !important;
  border-bottom: none !important;
  border: none !important;
  padding-top: 0 !important;
  margin-top: 0 !important;
}

/* == REMOVE PAGINATION BORDERS == */

.paging-navigation,
.paging-navigation .nav-links {
  border-top: none !important;
  border-bottom: none !important;
  border: none !important;
}

.paging-navigation {
  padding: 24px 0 !important;
  margin: 0 !important;
}

.paging-navigation .nav-previous a,
.paging-navigation .nav-next a {
  font-size: 13px !important;
  color: #777 !important;
  text-decoration: none !important;
}

.paging-navigation .nav-previous a:hover,
.paging-navigation .nav-next a:hover {
  color: #111 !important;
}