/*

    Theme Name: Columbia River Gorge Commission
    Theme URI: https://www.gorgecommission.org/
    Description: Version 1.0 of Columbia River Gorge Commission
    Version: 1.0

*/
@import url("https://fonts.googleapis.com/css2?family=Noto+Serif:ital,wght@0,100..900;1,100..900&family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Lexend:wght@100..900&display=swap");
@font-face {
  font-family: National Park;
  src: url("fonts/NationalPark-VariableVF.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
}

:root {
  --gray-0: #fff;
  --gray-50: #fafafa;
  --gray-100: #efefef;
  --gray-200: #dcdcdc;
  --gray-300: #bdbdbd;
  --gray-400: #989898;
  --gray-500: #7c7c7c;
  --gray-600: #656565;
  --gray-700: #525252;
  --gray-800: #464646;
  --gray-900: #3d3d3d;
  --gray-950: #292929;
  --gray-1000: #000;
  --green-50: #f4f5f0;
  --green-100: #e7e8df;
  --green-200: #d3d4c2;
  --green-300: #b6b89e;
  --green-400: #9a9e7d;
  --green-500: #7e8260;
  --green-600: #61664a;
  --green-700: #565a43;
  --green-800: #3f4133;
  --green-900: #37392e;
  --green-950: #1c1d16;
  --blue-50: #f4f8fb;
  --blue-100: #e7f0f7;
  --blue-200: #cadfed;
  --blue-300: #9cc4dd;
  --blue-400: #67a6c9;
  --blue-500: #438bb4;
  --blue-600: #326f97;
  --blue-700: #285676;
  --blue-800: #264c66;
  --blue-900: #244156;
  --blue-950: #182a39;
  --orange-50: #fbf8ef;
  --orange-100: #f7f0e0;
  --orange-200: #e7d2a0;
  --orange-300: #dab66f;
  --orange-400: #d19f4e;
  --orange-500: #c88338;
  --orange-600: #b0672f;
  --orange-700: #934c2a;
  --orange-800: #783e28;
  --orange-900: #643423;
  --orange-950: #381a10;
  --spacing-050: .125rem;
  --spacing-100: .25rem;
  --spacing-200: .5rem;
  --spacing-300: .75rem;
  --spacing-400: 1rem;
  --spacing-500: 1.5rem;
  --spacing-600: 2rem;
  --spacing-700: 3rem;
  --spacing-800: 4rem;
  --spacing-900: 6rem;
  --type-size-050: clamp(.5119rem, .6469rem + -.1125vw, .6244rem);
  --type-size-100: clamp(.64rem, .715rem + -.0625vw, .7025rem);
  --type-size-200: clamp(.79rem, .788rem + .01vw, .8rem);
  --type-size-300: clamp(.8888rem, .8665rem + .1113vw, 1rem);
  --type-size-400: clamp(1rem, .95rem + .25vw, 1.25rem);
  --type-size-500: clamp(1.125rem, 1.0375rem + .4375vw, 1.5625rem);
  --type-size-600: clamp(1.2656rem, 1.1281rem + .6875vw, 1.9531rem);
  --type-size-700: clamp(1.4238rem, 1.2203rem + 1.0175vw, 2.4413rem);
  --type-size-800: clamp(1.6019rem, 1.3119rem + 1.45vw, 3.0519rem);
  --type-size-900: clamp(1.8019rem, 1.3993rem + 2.0131vw, 3.815rem);
  --type-size-1000: clamp(2.0275rem, 1.4794rem + 2.7406vw, 4.7681rem);
  --border-radius-050: .125rem;
  --border-radius-100: .25rem;
  --border-radius-200: .5rem;
  --font-national-park: "National Park", sans-serif;
  --font-lexend: "Lexend", sans-serif;
  --font-inter: "Inter", sans-serif;
  --font-noto-serif: "Noto Serif", serif;
}

*, :before, :after {
  box-sizing: border-box;
}

html {
  text-size-adjust: none;
}

body, h1, h2, h3, h4, p, figure, blockquote, dl, dd {
  margin: 0;
}

ul, ol {
  margin-block: 0;
}

ul[role="nav"], ol[role="nav"] {
  list-style: none;
}

body {
  min-height: 100vh;
  line-height: 1.5;
}

h1, h2, h3, h4, button, input, label {
  line-height: 1.1;
}

img, picture {
  max-width: 100%;
  height: auto;
  display: block;
}

input, button, textarea, select {
  font: inherit;
}

textarea:not([rows]) {
  min-height: 10em;
}

:target {
  scroll-margin-block: 5ex;
}

time {
  display: block;
}

body {
  background: #fdfdf9;
}

.site {
  grid-template-rows: auto 1fr auto;
  gap: 0;
  min-height: 100vh;
  display: grid;
}

.site-content {
  min-height: 50vh;
  padding: var(--spacing-700) 0;
}

body, button, input, select, optgroup, textarea {
  font-family: var(--font-national-park);
}

a {
  color: var(--gray-900);
  text-decoration: none;
}

::-moz-selection {
  background: var(--blue-500);
  text-shadow: none;
}

::selection {
  background: var(--blue-500);
  color: #fff;
  text-shadow: none;
}

.page-title {
  font-size: var(--type-size-900);
  color: var(--green-700);
  font-weight: 400;
  font-family: var(--font-lexend);
}

.page-title.small {
  font-size: var(--type-size-700);
}

.grid {
  display: grid;
}

.flex {
  display: flex;
}

.justify-start {
  justify-content: flex-start;
}

.justify-center {
  justify-content: center;
}

.justify-between {
  justify-content: space-between;
}

.justify-end {
  justify-content: flex-end;
}

.items-start {
  align-items: flex-start;
}

.items-center {
  align-items: center;
}

.items-end {
  align-items: flex-end;
}

.items-stretch {
  align-items: stretch;
}

.place-center {
  place-content: center;
}

.content-grid {
  gap: 0 var(--spacing-600);
  grid-template-columns: [full-width-start] minmax(0, auto)[content-start] repeat(4, minmax(auto, 1fr))[content-end] minmax(0, auto)[full-width-end];
  display: grid;
}

@media only screen and (width >= 30rem) {
  .content-grid {
    grid-template-columns: [full-width-start] minmax(0, auto)[content-start] repeat(8, minmax(auto, 1fr))[content-end] minmax(0, auto)[full-width-end];
  }
}

@media only screen and (width >= 62rem) {
  .content-grid {
    grid-template-columns: [full-width-start] minmax(0, auto)[content-start] repeat(3, minmax(0, 4.5rem))[narrow-start] repeat(6, minmax(0, 4.5rem))[narrow-end] repeat(3, minmax(0, 4.5rem))[content-end] minmax(0, auto)[full-width-end];
  }
}

.content-grid > * {
  grid-column: content;
}

.flow > * + * {
  margin-block-start: var(--flow-spacer, 1rem);
}

.flow > .wp-block-separator {
  border-color: #0000001a;
  margin-block: 2rem !important;
}

.copy-1 {
  font-size: var(--type-size-500);
  line-height: 1.5;
}

.copy-2 {
  font-size: var(--type-size-400);
  line-height: 1.5;
}

.copy-3 {
  font-size: 17px;
  line-height: 1.5;
}

.copy a {
  color: var(--green-700);
  text-decoration: underline;
}

.copy h1, .copy h2, .copy h3, .copy h4, .copy h5, .copy h6 {
  margin: 0;
  margin-block: 2.5rem 0;
  font-weight: 550;
}

.copy h1 {
  font-size: var(--type-size-700);
}

.copy h2 {
  font-size: var(--type-size-600);
}

.copy h3 {
  font-size: var(--type-size-500);
}

.copy h4 {
  font-size: var(--type-size-400);
}

.copy h5 {
  font-size: var(--type-size-300);
}

.copy h6 {
  font-size: var(--type-size-200);
}

.copy .wp-block-quote {
  border-left: 4px solid var(--green-700);
  padding-left: var(--spacing-400);
}

.copy .wp-block-quote * {
  font-size: .875em;
}

.copy .wp-element-caption {
  font-size: var(--type-size-300);
  color: var(--gray-700);
  text-align: left;
  margin-top: 4px;
  font-style: normal;
}

.copy .aligncenter .wp-element-caption {
  text-align: center;
}

.copy img {
  border: 1px solid var(--gray-200);
}

.container {
  container-type: inline-size;
}

.pile {
  place-items: center;
  display: grid;
  position: relative;
}

.pile > * {
  grid-area: 1 / 1;
}

.section-header {
  text-align: center;
  padding: var(--spacing-300);
  margin-bottom: var(--spacing-400);
}

.section-header__green {
  background-color: var(--green-200);
  border: 1px solid var(--green-400);
}

.section-header__blue {
  background-color: var(--blue-200);
  border: 1px solid var(--blue-400);
}

.section-header__orange {
  background-color: var(--orange-200);
  border: 1px solid var(--orange-400);
}

.section-title {
  text-transform: uppercase;
  letter-spacing: .1em;
  font-size: var(--type-size-400);
  justify-content: center;
  align-items: center;
  gap: var(--spacing-200);
  font-weight: 600;
  display: flex;
}

.notices {
  margin-bottom: var(--spacing-400);
  gap: var(--spacing-400);
  display: grid;
}

.notice {
  width: 100%;
}

.notice__basic {
  border-radius: var(--border-radius-100);
  padding: var(--spacing-300) var(--spacing-400);
  text-align: center;
  background-color: #ffdb51;
  border: 1px solid #d1b859;
}

@media only screen and (width >= 48rem) {
  .notice__basic {
    gap: var(--spacing-200);
    justify-content: center;
    align-items: center;
    display: flex;
  }
}

.notice__date {
  background: var(--green-900);
  color: var(--gray-0);
  padding: var(--spacing-100) var(--spacing-200);
  border-radius: var(--border-radius-100);
  letter-spacing: .05em;
  font-size: .75rem;
  display: inline-block;
}

.notice__copy strong, .notice__copy b {
  font-weight: 600;
}

.sidebar {
  display: none;
}

@media only screen and (width >= 62rem) {
  .sidebar {
    background: var(--orange-50);
    padding: var(--spacing-500);
    border: 1px solid var(--green-500);
    margin-bottom: var(--spacing-400);
    align-self: start;
    display: block;
    position: sticky;
    top: 224px;
  }
}

@media only screen and (width >= 105rem) {
  .sidebar {
    top: 150px;
  }
}

.sidebar__title {
  font-size: var(--type-size-400);
  font-weight: 400;
  font-family: var(--font-lexend);
  color: var(--green-700);
  padding-bottom: var(--spacing-300);
}

.sidebar__menu {
  gap: var(--spacing-300);
  margin: 0;
  padding: 0;
  line-height: 1em;
  display: grid;
}

.sidebar__link {
  color: var(--orange-950);
  font-size: 1rem;
  font-weight: 550;
  display: block;
}

.sidebar__link:hover, .sidebar__link.active {
  text-decoration: underline;
}

.sidebar__header {
  text-transform: uppercase;
  color: #381a1080;
  letter-spacing: .05em;
  font-size: .675rem;
  font-weight: 600;
}

.sidebar__divider {
  padding: var(--spacing-200) 0;
}

.sidebar__divider:before {
  content: "";
  background: var(--green-100);
  width: 100%;
  height: 1px;
  display: block;
}

.page-header {
  padding-bottom: var(--spacing-600);
}

.page__featured-image {
  aspect-ratio: 960 / 400;
  margin-bottom: var(--spacing-500);
}

.page__featured-image img {
  object-fit: cover;
  border: 1px solid var(--gray-200);
  width: 100%;
  height: 100%;
}

.page__featured-image-caption {
  margin-top: var(--spacing-200);
  font-size: var(--type-size-200);
  color: var(--gray-600);
  font-style: normal;
  line-height: 1.4;
}

.page__featured-image.empty {
  background: var(--gray-50);
  border: 3px dashed var(--gray-200);
  border-radius: var(--border-radius-200);
  place-items: center;
  display: grid;
}

.page__featured-image.empty p {
  font-size: var(--type-size-300);
  color: var(--gray-300);
  font-style: normal;
  font-weight: 550;
}

.default-content {
  font-family: var(--font-inter);
  --flow-spacer: 1.5rem;
}

.application {
  border: 1px solid var(--green-200);
  border-radius: var(--border-radius-100);
  background-color: var(--green-50);
  font-family: var(--font-inter);
}

.application__header {
  padding: var(--spacing-400);
  color: var(--green-700);
}

.application__header-wrapper {
  border-bottom: 1px solid var(--green-200);
  padding-bottom: var(--spacing-200);
  justify-content: space-between;
  align-items: center;
  display: flex;
}

.application__body {
  padding: var(--spacing-400);
  font-size: var(--type-size-300);
  gap: var(--spacing-100);
  align-items: start;
  padding-top: 0;
  display: grid;
}

.application__body strong {
  font-weight: 600;
}

.application__footer {
  padding: var(--spacing-400);
  padding-top: 0;
}

.application__number {
  font-size: var(--type-size-400);
}

.application__status {
  font-size: var(--type-size-200);
  font-weight: 550;
}

.application__decision {
  background: var(--green-100);
  border: 1px solid var(--green-300);
  padding: var(--spacing-300);
  margin-top: var(--spacing-300);
  color: var(--green-900);
  gap: var(--spacing-100);
  font-size: var(--type-size-300);
  display: grid;
}

.application__files {
  border-top: 1px solid var(--green-200);
  padding-top: var(--spacing-300);
  gap: var(--spacing-200) var(--spacing-600);
  flex-wrap: wrap;
  display: flex;
}

.application__file {
  font-size: var(--type-size-200);
  color: var(--green-900);
  align-items: center;
  gap: var(--spacing-100);
  font-weight: 550;
  display: inline-flex;
}

.application__file svg {
  width: 12px;
}

.application__file:hover {
  text-decoration: underline;
}

.site-header .site-logo {
  position: relative;
}

.site-header .site-logo__link {
  top: var(--spacing-300);
  left: var(--spacing-600);
  z-index: 2222;
  display: block;
  position: absolute;
}

.site-logo img {
  width: 6rem;
}

@media only screen and (width >= 62rem) {
  .site-logo img {
    width: unset;
  }
}

.header-nav__list-item {
  position: relative;
}

.header-nav__list-item:hover > .header-nav__dropdown-menu, .header-nav__list-item:focus-within > .header-nav__dropdown-menu {
  display: grid;
}

.header-nav__dropdown-menu {
  z-index: 4444;
  width: 17.5rem;
  padding: var(--spacing-500);
  background: var(--orange-50);
  border: 1px solid var(--green-300);
  border-radius: var(--spacing-100);
  gap: var(--spacing-300);
  list-style: none;
  display: none;
  position: absolute;
  top: 80%;
  right: 0;
  box-shadow: -17px 221px 62px #0000, -11px 141px 57px #00000003, -6px 80px 48px #0000000d, -3px 35px 35px #00000017, -1px 9px 19px #0000001a;
}

.header-nav__menu-item {
  margin: 0;
  padding: 0;
  line-height: 1em;
}

.header-nav__menu-header {
  text-transform: uppercase;
  color: #381a1080;
  letter-spacing: .05em;
  font-size: .675rem;
  font-weight: 600;
}

.header-nav__menu-divider {
  padding: var(--spacing-200) 0;
}

.header-nav__menu-divider:before {
  content: "";
  background: var(--green-100);
  width: 100%;
  height: 1px;
  display: block;
}

.header-nav__menu-link a {
  color: var(--orange-950);
  font-size: 1rem;
  font-weight: 550;
  display: block;
}

.header-nav__menu-link a:hover {
  text-decoration: underline;
}

.main-nav {
  background: var(--orange-50);
  padding: 0 var(--spacing-600);
  border-bottom: 1px solid var(--green-500);
}

.main-nav__list {
  justify-content: flex-end;
  align-items: center;
  gap: var(--spacing-800);
  left: unset;
  margin: 0;
  padding: 0;
  display: flex;
  right: 0;
}

.main-nav__list-item > a {
  padding: var(--spacing-400) 0;
  color: var(--orange-950);
  text-transform: uppercase;
  letter-spacing: .1em;
  align-items: center;
  gap: 6px;
  font-size: .875rem;
  font-weight: 500;
  display: flex;
}

@media only screen and (width >= 80rem) {
  .main-nav__list-item > a {
    font-size: 1rem;
  }
}

.desktop-nav {
  display: none;
}

@media only screen and (width >= 62rem) {
  .desktop-nav {
    display: block;
  }
}

.admin-nav {
  background: var(--green-700);
  padding: 0 var(--spacing-600);
  border-bottom: 1px solid var(--orange-100);
}

.admin-nav__list {
  justify-content: flex-end;
  align-items: center;
  gap: var(--spacing-600);
  left: unset;
  margin: 0;
  padding: 0;
  display: flex;
  right: 0;
}

@media only screen and (width >= 62rem) {
  .admin-nav__list {
    gap: var(--spacing-700);
  }
}

.admin-nav__list-item > a {
  padding: var(--spacing-300) 0;
  color: var(--orange-50);
  align-items: center;
  gap: 6px;
  font-size: .75rem;
  font-weight: 500;
  display: flex;
}

@media only screen and (width >= 62rem) {
  .admin-nav__list-item > a {
    font-size: .875rem;
  }
}

.admin-nav__list-item.search-container, .admin-nav__list-item.translate {
  display: none;
}

@media only screen and (width >= 62rem) {
  .admin-nav__list-item.search-container, .admin-nav__list-item.translate {
    display: block;
  }
}

.site-header__mobile {
  gap: var(--spacing-600);
  padding: var(--spacing-600);
  z-index: 1000;
  grid-template-columns: minmax(14rem, 16rem) 1fr;
  align-items: center;
  display: grid;
  position: relative;
}

@media only screen and (width >= 48rem) {
  .site-header__mobile {
    display: none;
  }
}

.site-logo a:hover {
  text-decoration: none;
}

#mobile-nav {
  z-index: 8888;
  background-color: var(--green-800);
  border-right: 1px solid var(--green-300);
  width: 75%;
  height: 100vh;
  transition: all .3s ease-in-out;
  position: fixed;
  top: 0;
  left: -100%;
  overflow-y: scroll;
  transform: translateX(-100%);
  box-shadow: 2px 0 5px #0003;
}

@media only screen and (width >= 62rem) {
  #mobile-nav {
    display: none !important;
  }
}

#mobile-nav.is-open {
  left: 0;
  transform: translateX(0);
}

.mobile-nav {
  padding: var(--spacing-600);
}

.mobile-nav__group {
  margin-bottom: var(--spacing-600);
}

.mobile-nav__header {
  text-transform: uppercase;
  letter-spacing: .05em;
  color: var(--orange-50);
  margin-bottom: var(--spacing-200);
  border-bottom: 1px solid;
  font-size: .875rem;
  font-weight: 550;
  display: inline-block;
}

.mobile-nav__list {
  gap: var(--spacing-200);
  padding: 0;
  display: grid;
}

.mobile-nav .search .mobile-nav__link {
  align-items: center;
  gap: var(--spacing-200);
  display: flex;
}

.mobile-nav .search .mobile-nav__link svg {
  width: 12px;
  height: 12px;
  fill: var(--gray-0);
  display: block;
}

.mobile-nav .translate a.glink span {
  color: var(--orange-50);
  font-size: .875rem !important;
}

.mobile-nav .translate a.glink.gt-current-lang {
  display: none;
  font-weight: 400 !important;
}

.mobile-nav__link {
  color: var(--orange-50);
  font-size: .875rem;
}

.mobile-nav__link:hover {
  text-decoration: underline;
}

.site-nav__mobile {
  padding: var(--spacing-600);
  gap: var(--spacing-600);
  align-self: start;
  display: grid;
}

.site-nav__mobile-item {
  margin: 0;
  padding: 0;
  list-style-type: none;
}

.site-nav__mobile-link {
  color: var(--gray-0);
  text-transform: uppercase;
  font-size: var(--type-size-100);
  transition: all .15s;
  display: block;
}

.site-nav__mobile-link:hover {
  color: var(--gray-0);
}

.overlay {
  opacity: 0;
  visibility: hidden;
  z-index: 998;
  background: none;
  width: 100%;
  height: 100vh;
  transition: opacity .3s ease-in-out;
  position: fixed;
  top: 0;
  left: 0;
}

.overlay.is-visible {
  opacity: 1;
  visibility: visible;
}

.hamburger {
  padding: var(--spacing-400) var(--spacing-600);
  background: var(--orange-50);
  border-bottom: 1px solid var(--green-500);
  justify-content: end;
  display: grid;
}

@media only screen and (width >= 48rem) {
  .hamburger {
    align-items: center;
    display: flex;
  }
}

@media only screen and (width >= 62rem) {
  .hamburger {
    display: none;
  }
}

.hamburger__link {
  align-items: center;
  display: flex;
}

.hamburger__buns {
  align-items: center;
  width: 2rem;
  height: 22px;
  margin-right: auto;
  display: flex;
}

.hamburger__patty {
  background: var(--green-700);
  border-radius: var(--spacing-050);
  width: 2rem;
  height: 2px;
  transition: all .2s;
  position: relative;
}

.hamburger__patty:after, .hamburger__patty:before {
  content: "";
  background: var(--green-700);
  z-index: 1;
  border-radius: var(--spacing-050);
  width: 2rem;
  height: 2px;
  transition: all .2s;
  display: block;
  position: absolute;
}

.hamburger__patty:before {
  top: -6px;
}

.hamburger__patty:after {
  top: 6px;
}

.hamburger.nav-open .hamburger__patty {
  background: none;
}

.hamburger.nav-open .hamburger__patty:before {
  top: 0;
  rotate: 45deg;
}

.hamburger.nav-open .hamburger__patty:after {
  top: 0;
  rotate: -45deg;
}

@media (width <= 991px) {
  .mobile-nav-open {
    overflow: hidden;
  }
}

@media (width <= 430px) {
  #administration-dropdown-menu {
    right: -62%;
  }
}

.search-toggle svg {
  width: 12px;
  height: 12px;
  fill: var(--gray-0);
  display: block;
}

.search-modal {
  background: var(--orange-50);
  border: 1px solid var(--green-500);
  padding: var(--spacing-400);
  pointer-events: none;
  z-index: -1;
  opacity: 0;
  border-radius: 4px;
  width: 80vw;
  transition: all .4s 50ms;
  position: absolute;
  top: 2.5rem;
  right: -.5rem;
  transform: translateY(-1rem);
  box-shadow: 0 40px 60px -12px #32325d66, 0 18px 36px -18px #00000040;
}

@media only screen and (width >= 48rem) {
  .search-modal {
    width: 30rem;
  }
}

.search-close {
  background: var(--gray-0);
  border: 1px solid var(--green-700);
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  width: 1.25rem;
  height: 1.25rem;
  display: flex;
  position: absolute;
  top: -.6125rem;
  right: -.6125rem;
}

.search-close:hover {
  cursor: pointer;
}

.search-close svg {
  object-fit: contain;
  width: .5rem;
  height: .5rem;
}

.search-close svg rect {
  fill: var(--green-700);
}

.search-form {
  align-items: flex-end;
  gap: var(--spacing-200);
  width: 100%;
  display: flex;
}

.search-input {
  font-size: var(--type-size-300);
  color: var(--green-700);
  background: none;
  border: none;
  border-bottom: 1px solid #00000080;
  flex: 1;
  padding-bottom: .5rem;
  font-weight: 500;
  line-height: 1em;
  transition: all .2s;
}

.search-input::-webkit-input-placeholder {
  color: var(--green-500);
}

.search-input::placeholder {
  color: var(--green-500);
}

.search-input:-moz-placeholder-shown {
  color: var(--green-500);
}

.search-input:placeholder-shown {
  color: var(--green-500);
}

.search-input:focus, .search-input:active {
  border-bottom-color: #000000bf;
  outline: none;
}

.search-submit {
  background: var(--green-700);
  text-transform: uppercase;
  letter-spacing: .05em;
  color: var(--gray-0);
  font-size: var(--type-size-200);
  border: none;
  border-radius: 4px;
  padding: .375rem .75rem;
  transition: all .2s;
}

.search-submit:hover {
  cursor: pointer;
}

.search-submit:focus, .search-submit:active {
  outline: none;
}

.search-container.show .search-modal {
  opacity: 1;
  z-index: 50;
  pointer-events: unset;
  transform: translateY(0);
}

@media only screen and (width >= 62rem) {
  .site-header {
    z-index: 100;
    position: sticky;
    top: 0;
  }
}

.site-footer {
  padding: var(--spacing-600);
  background: var(--green-700);
  color: var(--orange-50);
}

@media only screen and (width >= 62rem) {
  .site-footer {
    padding: var(--spacing-800) var(--spacing-600);
  }
}

.site-footer__wrapper {
  gap: var(--spacing-600);
  max-width: 1200px;
  margin: 0 auto;
  display: grid;
}

@media only screen and (width >= 48rem) {
  .site-footer__wrapper {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@media only screen and (width >= 62rem) {
  .site-footer__wrapper {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
}

.site-footer__contact p {
  font-size: .875rem;
}

.site-footer__contact p + p {
  margin-top: 1.5rem;
}

.site-footer__contact a {
  color: var(--orange-50);
}

.site-footer__contact a.email, .site-footer__contact a:hover {
  text-decoration: underline;
}

.site-footer .copyright {
  margin-top: var(--spacing-600);
  padding-top: var(--spacing-300);
  border-top: 1px solid #fbf8ef80;
  grid-column: 1 / -1;
}

@media only screen and (width >= 48rem) {
  .site-footer .copyright {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    display: grid;
  }
}

.site-footer .copyright p {
  font-size: .875rem;
}

.site-footer .copyright p span {
  font-family: Arial, Helvetica, sans-serif;
}

.site-footer .copyright .links {
  gap: var(--spacing-400);
  display: flex;
}

@media only screen and (width >= 48rem) {
  .site-footer .copyright .links {
    justify-content: flex-end;
  }
}

.site-footer .copyright .links a {
  color: var(--orange-50);
  font-size: .875rem;
}

.site-footer .copyright .links a:hover {
  text-decoration: underline;
}

@media only screen and (width >= 30rem) {
  .footer-nav {
    columns: 2;
    column-gap: var(--spacing-600);
  }
}

@media only screen and (width >= 48rem) {
  .footer-nav {
    columns: 3;
    grid-column: span 3;
  }
}

.footer-nav__group {
  margin-bottom: var(--spacing-600);
  break-inside: avoid-column;
}

.footer-nav__header {
  text-transform: uppercase;
  letter-spacing: .05em;
  color: var(--orange-50);
  margin-bottom: var(--spacing-200);
  border-bottom: 1px solid;
  font-size: .875rem;
  font-weight: 550;
  display: inline-block;
}

.footer-nav__list {
  gap: var(--spacing-200);
  padding: 0;
  display: grid;
}

.footer-nav__link {
  color: var(--orange-50);
  font-size: .875rem;
}

.footer-nav__link:hover {
  text-decoration: underline;
}

.swiper {
  width: 100%;
  min-width: 0;
  max-width: 100vw;
  height: 100%;
  min-height: 0;
  max-height: 100vw;
  overflow: hidden;
}

.swiper-wrapper {
  height: 100%;
  max-height: 100%;
  display: flex;
}

.swiper-slide {
  flex-shrink: 0;
  width: auto;
  height: 100%;
  max-height: 100%;
  display: block;
}

.swiper-pagination {
  --swiper-pagination-bottom: 4.5rem !important;
}

@media only screen and (width >= 48rem) {
  .swiper-pagination {
    --swiper-pagination-bottom: 8.5rem !important;
  }
}

.swiper-pagination-bullet {
  --swiper-pagination-bullet-width: 32px;
  --swiper-pagination-bullet-height: 32px;
  --swiper-pagination-bullet-inactive-opacity: 1;
}

@media only screen and (width >= 48rem) {
  .swiper-pagination-bullet {
    --swiper-pagination-bullet-width: 48px;
    --swiper-pagination-bullet-height: 48px;
  }
}

.swiper-pagination-bullet .swiper-pagination-thumb__wrapper {
  position: relative;
}

.swiper-pagination-bullet .swiper-pagination-thumb__wrapper:after {
  content: "";
  border-radius: var(--spacing-050);
  background: #00000080;
  border: 1px solid #0000;
  width: 100%;
  height: 100%;
  transition: background .3s, border-color .3s;
  display: block;
  position: absolute;
  inset: 0;
}

.swiper-pagination-bullet-active .swiper-pagination-thumb__wrapper:after {
  background: unset;
  border-color: var(--gray-0);
}

.swiper-pagination-bullet img {
  border-radius: var(--spacing-050);
}

.hero-swiper {
  padding: 0 0 var(--spacing-800) 0;
}

.hero__image {
  aspect-ratio: 4 / 3;
}

@media only screen and (width >= 48rem) {
  .hero__image {
    aspect-ratio: 1600 / 718;
  }
}

.hero__image img {
  object-fit: cover;
  width: 100%;
  height: 100%;
}

.hero__copy {
  z-index: 10;
  margin-bottom: -2rem;
  position: relative;
  transform: translateY(-4rem);
}

@media only screen and (width >= 48rem) {
  .hero__copy {
    margin-bottom: -6rem;
    transform: translateY(-8rem);
  }
}

.hero__copy-wrapper {
  background: var(--orange-50);
  border: 1px solid var(--orange-500);
  padding: var(--spacing-600);
  text-align: center;
  width: calc(100% - var(--spacing-600));
  max-width: 64rem;
  margin: 0 auto;
  box-shadow: 0 4px 6px #0000001a;
}

.hero__copy p {
  text-wrap: pretty;
}

.land-use-applications {
  padding-top: var(--spacing-700);
  padding-bottom: var(--spacing-800);
}

.land-use-applications__headline {
  text-align: center;
  font-size: var(--type-size-900);
  font-weight: 400;
  font-family: var(--font-lexend);
  color: var(--green-700);
  padding-bottom: 2rem;
}

.land-use-applications__links {
  gap: var(--spacing-400);
  grid-template-columns: repeat(auto-fit, minmax(24rem, 1fr));
  grid-auto-rows: 1fr;
  display: grid;
}

.land-use-applications__link {
  place-content: center;
  gap: var(--spacing-300);
  background-color: var(--green-50);
  border: 1px solid var(--green-200);
  padding: var(--spacing-600);
  text-align: center;
  color: var(--green-950);
  transition: background-color .3s ease-in-out;
  display: grid;
}

@container (width <= 50rem) {
  .land-use-applications__link {
    padding: var(--spacing-200) var(--spacing-600);
  }
}

.land-use-applications__link:hover {
  background-color: var(--green-100);
}

.land-use-applications__link.is-klickitat {
  background-color: var(--green-600);
  border-color: var(--green-500);
  color: var(--gray-0);
}

.land-use-applications__link.is-klickitat:hover {
  background-color: var(--green-700);
}

.land-use-applications__link.is-klickitat .county {
  color: var(--gray-0);
}

.land-use-applications__link.is-klickitat .external-link {
  background-color: var(--gray-0);
  color: var(--green-700);
  font-size: var(--type-size-100);
  text-transform: uppercase;
  letter-spacing: .1em;
  padding: var(--spacing-050) var(--spacing-200);
  border-radius: var(--border-radius-050);
  width: fit-content;
  margin: 0 auto;
  text-decoration: none;
  display: inline-block;
}

.land-use-applications__link .county {
  font-size: var(--type-size-400);
  color: var(--green-700);
  font-weight: 600;
}

.land-use-applications__link .external-link {
  font-size: var(--type-size-300);
  justify-content: center;
  align-items: center;
  gap: var(--spacing-200);
  text-decoration: underline;
  display: flex;
}

.land-use-applications__additional-links {
  padding: var(--spacing-400) 0;
}

.land-use-applications__additional-links p {
  gap: 0 var(--spacing-400);
  font-size: var(--type-size-300);
  flex-wrap: wrap;
  display: flex;
}

.land-use-applications__additional-links strong {
  margin-right: -8px;
  font-weight: 600;
  display: inline-block;
}

.land-use-applications__additional-links a {
  color: var(--gray-700);
  text-decoration: underline;
}

.land-use-applications__map img {
  mix-blend-mode: multiply;
  width: 100%;
}

.current-work {
  padding-bottom: var(--spacing-800);
}

.current-work__wrapper {
  gap: var(--spacing-400);
  grid-template-columns: repeat(auto-fit, minmax(20rem, 1fr));
  display: grid;
}

@media only screen and (width >= 62rem) {
  .current-work__wrapper {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

.current-work__image {
  aspect-ratio: 288 / 244;
}

@container (width <= 60rem) {
  .current-work__image {
    aspect-ratio: 16 / 9;
  }
}

.current-work__image:before {
  content: "";
  z-index: 1;
  background-color: #438bb480;
  width: 100%;
  height: 100%;
  display: block;
  position: absolute;
  inset: 0;
}

.current-work__image img {
  object-fit: cover;
  filter: saturate(70%) grayscale(80%);
  width: 100%;
  height: 100%;
}

.current-work__title {
  z-index: 2;
  font-size: var(--type-size-500);
  color: var(--gray-0);
  text-shadow: 0 2px 2px #0000001a;
  padding: var(--spacing-600);
  text-align: center;
  text-wrap: balance;
  font-weight: 500;
  line-height: 1.1;
  display: block;
}

.connect {
  padding-bottom: var(--spacing-600);
}

.connect__wrapper {
  gap: var(--spacing-400);
  grid-template-areas: "news"
                       "meetings"
                       "mailing-list";
  display: grid;
}

@media only screen and (width >= 62rem) {
  .connect__wrapper {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-areas: "news meetings"
                         "mailing-list mailing-list";
  }
}

.connect__title {
  margin-bottom: var(--spacing-400);
  font-weight: 400;
  font-size: var(--type-size-500);
  border-bottom: 2px solid var(--orange-950);
  padding-bottom: var(--spacing-200);
}

.connect__title.no-underline {
  border-bottom: none;
  padding-bottom: 0;
}

.connect__title.has-icon {
  align-items: center;
  gap: var(--spacing-200);
  display: flex;
}

.connect__group {
  background-color: var(--orange-50);
  border: 1px solid var(--orange-200);
  padding: var(--spacing-600);
  gap: var(--spacing-400);
  grid-template-rows: auto 1fr auto;
  display: grid;
}

.connect__news {
  grid-area: news;
}

.connect__news-posts {
  gap: var(--spacing-400);
  align-content: start;
  display: grid;
}

.connect__news-posts > :not(:last-child) {
  border-bottom: 1px solid var(--gray-100);
  padding-bottom: var(--spacing-400);
}

.connect__news-link {
  gap: var(--spacing-200);
  grid-template-columns: 6.5rem minmax(0, 1fr);
  display: grid;
}

.connect__news-date {
  align-items: flex-start;
  gap: var(--spacing-100);
  text-transform: uppercase;
  font-size: var(--type-size-200);
  letter-spacing: .05em;
  flex-direction: column;
  font-weight: 600;
  display: flex;
}

.connect__news .new {
  font-size: var(--type-size-100);
  text-transform: uppercase;
  letter-spacing: .1em;
  color: var(--gray-1000);
  border-radius: var(--border-radius-100);
  background-color: #f0c41d;
  padding: .125rem .375rem;
  font-weight: 600;
  display: inline-block;
}

.connect__news-title {
  font-size: var(--type-size-300);
  font-weight: 500;
  line-height: 1.25em;
  text-decoration: underline;
}

.connect__meetings {
  grid-area: meetings;
}

.connect__meetings-posts {
  gap: var(--spacing-600);
  align-content: start;
  display: grid;
}

.connect__meetings-posts > :not(:last-child) {
  border-bottom: 1px solid var(--gray-100);
  padding-bottom: var(--spacing-600);
}

.connect__meetings-post {
  gap: var(--spacing-400);
  grid-template-columns: 3rem minmax(0, 1fr);
  align-items: start;
  display: grid;
}

.connect__meetings-date {
  border: 1px solid var(--orange-950);
}

.connect__meetings-month {
  font-size: var(--type-size-200);
  letter-spacing: .05em;
  color: var(--gray-0);
  text-align: center;
  text-transform: uppercase;
  letter-spacing: .1em;
  padding: var(--spacing-050);
  background: #b02f2f;
  font-size: .6125rem;
  font-weight: 400;
}

.connect__meetings-day {
  font-size: var(--type-size-500);
  letter-spacing: .05em;
  background: var(--gray-0);
  padding: var(--spacing-200) var(--spacing-100);
  place-content: center;
  font-weight: 400;
  line-height: 1em;
  display: grid;
}

.connect__meetings-title {
  padding-top: var(--spacing-100);
  font-size: var(--type-size-300);
  font-weight: 550;
}

.connect__meetings-link:hover {
  text-decoration: underline;
}

.connect__meetings-time {
  font-size: var(--type-size-200);
  color: var(--green-700);
  padding-top: var(--spacing-100);
  font-weight: 500;
}

.connect__meetings-agenda {
  padding-top: var(--spacing-100);
}

.connect__meetings-agenda-file {
  font-size: var(--type-size-200);
  color: var(--green-900);
  align-items: center;
  gap: var(--spacing-200);
  font-weight: 550;
  display: inline-flex;
}

.connect__meetings-agenda-file svg {
  width: 12px;
}

.connect__meetings-agenda-file svg path {
  fill: var(--green-700);
}

.connect__meetings-agenda-file:hover {
  text-decoration: underline;
}

.connect__meetings .no-agenda {
  font-size: var(--type-size-200);
  color: var(--gray-500);
  font-style: italic;
}

.connect__mailing-list {
  grid-area: mailing-list;
}

.connect__mailing-list-form {
  gap: var(--spacing-200);
  grid-template-columns: 1fr auto;
  width: 100%;
  display: grid;
}

.connect__mailing-list-email {
  border: 1px solid var(--orange-200);
  padding: var(--spacing-300);
}

.connect__mailing-list-submit {
  border: 1px solid var(--orange-700);
  background-color: var(--orange-500);
  color: var(--gray-0);
  padding: 0 var(--spacing-400);
  transition: all .15s ease-in-out;
}

.connect__mailing-list-submit:hover {
  background-color: var(--orange-700);
  cursor: pointer;
}

.connect__footer {
  border-top: 1px solid var(--gray-400);
  padding-top: var(--spacing-300);
  margin-top: var(--spacing-400);
  align-items: center;
  gap: var(--spacing-400);
  flex-wrap: wrap;
  display: flex;
}

.connect__footer a {
  font-size: var(--type-size-300);
  text-decoration: underline;
}

.connect__footer a.has-icon {
  align-items: center;
  gap: var(--spacing-200);
  display: flex;
}

body.home .site-content {
  padding: 0;
}

@media only screen and (width >= 62rem) {
  .sidebar {
    margin-top: var(--spacing-800);
    grid-column: 2 / span 3;
  }
}

.page-content {
  min-height: 80vh;
}

@media only screen and (width >= 62rem) {
  .page-content {
    grid-column: 5 / span 9;
  }
}

.single-meeting .page__featured-image {
  display: none;
}

.meetings__list {
  padding-top: var(--spacing-600);
}

.meetings__list-header {
  color: var(--orange-950);
  font-size: var(--type-size-500);
  border-bottom: 1px solid var(--orange-950);
  padding-bottom: var(--spacing-200);
  margin-bottom: var(--spacing-600);
  font-weight: 550;
}

.meetings .no-agenda {
  font-size: var(--type-size-200);
  color: var(--gray-500);
  font-style: italic;
}

.meetings .connect__meetings-agenda-file svg path {
  fill: var(--orange-500);
}

.commissioners, .staff {
  padding-top: var(--spacing-800);
}

.person__grid {
  gap: var(--spacing-600);
  grid-template-columns: repeat(auto-fill, minmax(10rem, 1fr));
  display: grid;
}

.person__header {
  grid-column: 1 / -1;
  justify-content: flex-start;
}

.person__photo {
  max-width: 10rem;
  margin: 0 auto;
}

.person__photo a {
  display: block;
}

.person__photo img {
  object-fit: cover;
  aspect-ratio: 1;
  border: 1px solid var(--green-700);
  width: 100%;
  height: 100%;
}

.person__meta {
  padding-top: var(--spacing-300);
  text-align: center;
  gap: var(--spacing-200);
  display: grid;
}

.person__name {
  color: var(--green-700);
  font-weight: 550;
  font-size: var(--type-size-400);
}

.person__name a:hover {
  text-underline-offset: 2px;
  text-decoration: underline 1px;
}

.person__appointment, .person__term, .person__title {
  font-size: var(--type-size-200);
  color: var(--orange-950);
  line-height: 1.1;
  font-family: var(--font-noto-serif);
  font-weight: 500;
}

.person__position {
  font-size: var(--type-size-200);
  text-transform: uppercase;
  letter-spacing: .05em;
  color: var(--green-700);
  margin-bottom: -.25rem;
  font-weight: 600;
}

.page-title__type {
  font-weight: 500;
  font-size: var(--type-size-400);
  color: var(--orange-500);
  display: block;
}

.person-subtitle {
  padding-top: var(--spacing-200);
  font-weight: 550;
  font-size: var(--type-size-400);
  color: var(--orange-950);
  font-family: var(--font-noto-serif);
}

.person-subtitle strong {
  font-weight: 6 0;
}

.person-committees {
  padding-top: var(--spacing-200);
}

.person-committees__label {
  font-size: var(--type-size-200);
  text-transform: uppercase;
  color: var(--green-700);
  margin-right: var(--spacing-100);
  letter-spacing: .05em;
  font-weight: bold;
}

.person-committees__item {
  font-size: var(--type-size-200);
  padding: var(--spacing-050) var(--spacing-100);
  background-color: var(--orange-50);
  border-radius: var(--border-radius-050);
  border: 1px solid var(--orange-200);
  color: var(--orange-800);
  margin-right: var(--spacing-100);
  display: inline-block;
}

.person-email {
  margin-top: var(--spacing-200);
}

.person-email__link {
  color: var(--orange-500);
  text-underline-offset: 2px;
  text-decoration: underline;
}

.person-phone {
  margin-top: var(--spacing-100);
}

.person-phone__link {
  color: var(--green-700);
}

.person-photo {
  max-width: 12rem;
  margin-bottom: var(--spacing-400);
}

.person-photo img {
  border: 1px solid var(--green-700);
  aspect-ratio: 1;
  object-fit: cover;
  width: 100%;
  height: 100%;
}

.person-photo__caption {
  margin-top: var(--spacing-100);
  font-size: var(--type-size-100);
  color: var(--gray-600);
  font-style: italic;
  line-height: 1.4;
}

.back-link {
  margin-top: var(--spacing-400);
  border-top: 1px solid var(--gray-200);
  padding-top: var(--spacing-400);
  margin-bottom: var(--spacing-400);
  text-transform: uppercase;
  font-size: var(--type-size-200);
  letter-spacing: .05em;
  color: var(--green-700);
  font-weight: 550;
  display: block;
}

.back-link:hover {
  text-underline-offset: 2px;
  text-decoration: underline;
}

.applications__list {
  gap: var(--spacing-400);
  align-items: start;
  display: grid;
}

.appeals__info {
  margin-bottom: var(--spacing-700);
}

.appeals__list {
  gap: var(--spacing-400);
  padding: var(--spacing-600);
  background: var(--green-50);
  border: 1px solid var(--green-200);
  display: grid;
}

.appeals__list-title {
  color: var(--green-900);
  display: block;
}

.appeals__list-title:after {
  background: var(--green-900);
  content: "";
  height: 3px;
  width: var(--spacing-600);
  margin-top: var(--spacing-400);
  display: block;
}

.appeal a {
  font-size: var(--type-size-300);
  color: var(--green-900);
  font-weight: 550;
  display: inline-block;
}

.appeal a:hover {
  text-decoration: underline;
}

.single-meeting .page-title {
  font-size: var(--type-size-800);
}

.meeting__meta {
  gap: var(--spacing-600);
  font-size: var(--type-size-300);
  color: var(--green-900);
  padding-bottom: var(--spacing-600);
  flex-wrap: wrap;
  font-weight: 550;
  display: flex;
}

.meeting__meta p {
  align-items: center;
  gap: var(--spacing-100);
  display: flex;
}

.meeting__meta svg {
  width: 1rem;
  height: 1rem;
}

.meeting__meta svg path {
  fill: var(--orange-500);
}

.meeting__files {
  padding-top: var(--spacing-300);
  gap: var(--spacing-400);
  display: grid;
}

.meeting__files-header {
  font-size: var(--type-size-300);
  letter-spacing: .05em;
  color: var(--green-900);
  text-underline-offset: 4px;
  text-transform: uppercase;
  font-weight: 550;
  text-decoration: underline 2px;
}

.meeting__file {
  font-size: var(--type-size-300);
  color: var(--green-900);
  align-items: center;
  gap: var(--spacing-200);
  font-weight: 550;
  display: inline-flex;
}

.meeting__file svg {
  width: 12px;
}

.meeting__file svg path {
  fill: var(--orange-500);
}

.meeting__file:hover {
  text-decoration: underline;
}

.meeting__agenda {
  padding-bottom: var(--spacing-600);
}

.meeting__agenda-header {
  font-size: var(--type-size-300);
  letter-spacing: .05em;
  color: var(--green-900);
  text-underline-offset: 4px;
  text-transform: uppercase;
  margin-bottom: var(--spacing-200);
  font-weight: 550;
  text-decoration: underline 2px;
}

.meeting__agenda .no-agenda {
  font-size: var(--type-size-300);
  color: var(--gray-500);
  font-style: italic;
}

.meeting__agenda-file {
  font-size: var(--type-size-300);
  color: var(--green-900);
  align-items: center;
  gap: var(--spacing-200);
  font-weight: 550;
  display: inline-flex;
}

.meeting__agenda-file svg {
  width: 12px;
}

.meeting__agenda-file svg path {
  fill: var(--orange-500);
}

.meeting__agenda-file:hover {
  text-decoration: underline;
}

.news__post + .news__post {
  margin-top: var(--spacing-600);
  border-top: 1px solid var(--gray-200);
  padding-top: var(--spacing-600);
}

.news__date {
  gap: var(--spacing-200);
  text-transform: uppercase;
  color: var(--orange-500);
  font-weight: 700;
  font-size: var(--type-size-200);
  letter-spacing: .05em;
  display: flex;
}

.news__title .new {
  font-size: var(--type-size-100);
  text-transform: uppercase;
  letter-spacing: .1em;
  color: var(--gray-1000);
  border-radius: var(--border-radius-100);
  vertical-align: middle;
  background-color: #f0c41d;
  padding: .125rem .375rem;
  font-weight: 600;
  display: inline-block;
}

.news__title {
  font-size: var(--type-size-500);
  padding-bottom: var(--spacing-200);
  font-weight: 550;
}

.news__link:hover {
  text-decoration: underline;
}

.pagination {
  margin-top: var(--spacing-600);
  border-top: 2px solid var(--green-700);
  padding-top: var(--spacing-600);
  padding-bottom: var(--spacing-600);
  justify-content: flex-start;
  gap: var(--spacing-400);
  display: flex;
}

.pagination .page-numbers {
  font-size: var(--type-size-400);
  display: inline-block;
}

.pagination .page-numbers:not(.prev, .next) {
  border: 1px solid var(--green-700);
  aspect-ratio: 1;
  width: var(--spacing-600);
  height: var(--spacing-600);
  text-align: center;
  transition: all .2s;
  display: block;
}

.pagination .page-numbers:not(.prev, .next):hover, .pagination .page-numbers.current {
  background-color: var(--green-700);
  color: var(--gray-0);
}

.pagination .page-numbers.prev:hover, .pagination .page-numbers.next:hover {
  text-decoration: underline;
}

.single-post .page-header .news__date {
  font-size: var(--type-size-300);
}

.single-post .page-title {
  font-size: var(--type-size-800);
}

body.search .page-header {
  padding-bottom: var(--spacing-600);
}

body.search .page-title {
  text-align: center;
  padding-bottom: var(--spacing-600);
}

body.search .search-results-count {
  font-size: var(--type-size-200);
  text-transform: uppercase;
  letter-spacing: .05em;
  color: var(--green-700);
  margin-bottom: var(--spacing-600);
  font-weight: 550;
}

@media only screen and (width >= 62rem) {
  body.search .site-content {
    min-height: 80vh;
  }
}

@media only screen and (width >= 48rem) {
  body.search .site-content .content-grid > * {
    grid-column: 3 / span 6;
  }
}

@media only screen and (width >= 62rem) {
  body.search .site-content .content-grid > * {
    grid-column: 4 / span 8;
  }
}

.search-result {
  gap: var(--spacing-400);
  grid-template-columns: 4rem minmax(0, 1fr);
  display: grid;
}

@media only screen and (width >= 62rem) {
  .search-result {
    gap: var(--spacing-600);
    grid-template-columns: 8rem minmax(0, 1fr);
  }
}

.search-result + .search-result {
  margin-top: var(--spacing-600);
  padding-top: var(--spacing-600);
  border-top: 1px solid var(--gray-200);
}

.search-result__image {
  aspect-ratio: 4 / 3;
}

.search-result__image img {
  border-radius: var(--spacing-050);
  object-fit: cover;
  width: 100%;
  height: 100%;
}

.search-result__image-placeholder {
  background: radial-gradient(circle at 100% 100%, var(--green-400), var(--green-600));
  border-radius: var(--spacing-050);
  width: 100%;
  height: 100%;
}

.search-result__sub-header {
  font-size: var(--type-size-200);
  color: var(--orange-500);
  text-transform: uppercase;
  letter-spacing: .05em;
  margin-bottom: var(--spacing-200);
  font-weight: 550;
}

.search-result__title {
  font-size: var(--type-size-500);
  margin-bottom: var(--spacing-200);
  font-weight: 400;
}

.search-result__title a {
  color: var(--green-700);
  text-underline-offset: 4px;
  text-decoration: underline 2px;
}

.search-result__link {
  margin-top: var(--spacing-200);
  font-size: var(--type-size-200);
}

.search-result__link a {
  color: var(--green-500);
  background-color: var(--green-50);
  border-radius: var(--spacing-050);
  border: 1px solid var(--green-100);
  padding: var(--spacing-100) var(--spacing-100);
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 100%;
  line-height: 1;
  display: inline-block;
  overflow: hidden;
}

.search-result__link a:hover {
  text-underline-offset: 2px;
  text-decoration: underline 1px;
}

.search-result .copy strong {
  font-weight: 550;
}

.search-result__staff .search-result__image {
  aspect-ratio: 1;
}

.search-result__meeting .search-result__image-placeholder {
  background: radial-gradient(circle at 100% 100%, var(--orange-400), var(--orange-600));
}

.search-result__meeting .meeting__meta {
  padding-bottom: var(--spacing-400);
}

.search-result__meeting .meeting__agenda {
  padding-bottom: 0;
}

.contact {
  gap: var(--spacing-600);
  display: grid;
}

@media only screen and (width >= 48rem) {
  .contact {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  }
}

.contact__map {
  aspect-ratio: 4 / 3;
}

.contact__map iframe {
  object-fit: cover;
  width: 100%;
  height: 100%;
}

.contact .copy .contact__header {
  padding-bottom: var(--spacing-100);
  color: var(--green-700);
  margin-top: 0;
}

.contact__item + .contact__item {
  margin-top: var(--spacing-600);
}

.contact .copy .contact__link {
  color: var(--orange-500);
}

.connect__mailing-list-message {
  border-radius: 4px;
  margin-bottom: 1rem;
  padding: .75rem;
}

.connect__mailing-list-message--success {
  color: #155724;
  background-color: #d4edda;
  border: 1px solid #c3e6cb;
}

.connect__mailing-list-message--error {
  color: #721c24;
  background-color: #f8d7da;
  border: 1px solid #f5c6cb;
}
