/* Shared by the React application and server-rendered SEO pages. */
.home-header {
  align-items: center;
  backdrop-filter: blur(18px);
  background: linear-gradient(90deg, rgba(238, 248, 245, .96), rgba(255, 255, 255, .98) 38%, rgba(250, 252, 251, .98));
  border-bottom: 1px solid #d5e4e0;
  box-shadow: 0 9px 30px rgba(18, 67, 60, .08);
  display: flex;
  gap: 32px;
  justify-content: space-between;
  min-height: 94px;
  padding: 13px clamp(20px, 5vw, 76px);
  position: sticky;
  top: 0;
  z-index: 50;
}

.seo-site-header {
  margin-bottom: 68px;
  margin-left: calc(50% - 50vw);
  width: 100vw;
}

.home-brand {
  align-items: center;
  color: inherit;
  display: flex;
  flex: 0 0 auto;
  gap: 13px;
  text-decoration: none;
}

.home-brand:not(.home-brand--footer) { display: grid; gap: 3px; width: 190px; }
.home-brand__image { display: block; height: 73px; overflow: hidden; position: relative; width: 190px; }
.home-brand__tagline {
  color: #53766f;
  font-size: 7.5px;
  font-weight: 850;
  letter-spacing: .11em;
  line-height: 1;
  text-align: center;
  text-transform: uppercase;
  white-space: nowrap;
}
.home-brand:hover { text-decoration: none; }
.home-brand:hover .home-brand__tagline {
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}
.home-brand__image img {
  filter: drop-shadow(0 5px 11px rgba(20, 70, 63, .12));
  height: auto;
  left: 0;
  margin: 0;
  max-width: none;
  position: absolute;
  top: -10px;
  transform: none;
  width: 190px;
}

.home-nav, .home-actions { align-items: center; display: flex; }
.home-nav {
  background: rgba(232, 243, 240, .72);
  border: 1px solid #d9e8e4;
  border-radius: 13px;
  gap: 3px;
  padding: 4px;
}
.home-nav a {
  border-radius: 9px;
  color: #40505b;
  font-size: 14px;
  font-weight: 700;
  padding: 9px clamp(10px, 1.2vw, 17px);
  text-decoration: none;
  transition: background 150ms ease, color 150ms ease, box-shadow 150ms ease;
}
.home-nav a:hover { background: #fff; box-shadow: 0 4px 13px rgba(20, 72, 64, .08); color: #0d7366; }
.home-nav a.is-active {
  background: #fff;
  box-shadow: 0 4px 14px rgba(20, 72, 64, .1), inset 0 -2px 0 #0c796c;
  color: #087d70;
}

.home-actions { gap: 12px; }
.site-menu { position: relative; }
.site-menu summary {
  align-items: center;
  background: #fff;
  border: 1px solid #d7e1e0;
  border-radius: 11px;
  color: #334155;
  cursor: pointer;
  display: flex;
  font-size: 13px;
  font-weight: 800;
  gap: 6px;
  list-style: none;
  min-height: 44px;
  padding: 9px 13px;
  white-space: nowrap;
}
.site-menu summary::-webkit-details-marker { display: none; }
.site-menu summary:hover, .site-menu[open] summary { border-color: #8cbdb4; color: #087d70; }
.site-menu.is-active summary { background: #e8f5f2; border-color: #75b8aa; box-shadow: inset 0 -2px 0 #0c796c; color: #087d70; }
.site-menu summary .material-symbols-rounded { font-size: 18px; }
.site-menu--nav summary:hover, .site-menu--nav[open] summary {
  box-shadow: 0 4px 13px rgba(20, 72, 64, .08);
}
.site-menu--nav .site-menu__panel { left: 0; right: auto; }
.site-menu--mobile { display: none; }

.site-menu__panel {
  background: #fff;
  border: 1px solid #d8e4e1;
  border-radius: 16px;
  box-shadow: 0 18px 48px rgba(19, 52, 48, .18);
  display: grid;
  min-width: 270px;
  padding: 10px;
  position: absolute;
  right: 0;
  top: calc(100% + 10px);
  z-index: 1200;
}
.site-menu__panel a {
  align-items: center;
  border-radius: 10px;
  color: #344b50;
  display: flex;
  font-size: 13px;
  font-weight: 750;
  gap: 10px;
  padding: 11px 12px;
  text-decoration: none;
}
.site-menu__panel a:hover { background: #edf7f4; color: #087d70; }
.site-menu__panel a.is-active { background: #e1f2ee; box-shadow: inset 3px 0 0 #0c796c; color: #087d70; }
.site-menu__panel .material-symbols-rounded { color: #58847c; font-size: 19px; }
.site-menu__divider { border-top: 1px solid #e5ecea; margin: 5px 7px; }
.site-menu__compact-only { display: none !important; }
.site-language-menu__panel { min-width: 170px; }
.site-language-menu__panel a { padding-block: 9px; }
.site-theme-menu__panel { min-width: 180px; }
.site-menu__panel button[data-theme-option] {
  align-items: center;
  background: transparent;
  border: 0;
  border-radius: 10px;
  color: #344b50;
  cursor: pointer;
  display: flex;
  font: inherit;
  font-size: 13px;
  font-weight: 750;
  gap: 10px;
  padding: 11px 12px;
  text-align: left;
  width: 100%;
}
.site-menu__panel button[data-theme-option]:hover { background: #edf7f4; color: #087d70; }
.site-menu__panel button[data-theme-option].is-active { background: #e1f2ee; box-shadow: inset 3px 0 0 #0c796c; color: #087d70; }

.site-app-buttons, .site-menu__app-buttons { display: flex; gap: 7px; }
.site-app-buttons button, .site-menu__app-buttons button {
  align-items: center;
  background: #eef1f2;
  border: 1px solid #d4dadc;
  border-radius: 10px;
  color: #7b858a;
  cursor: not-allowed;
  display: flex;
  font: inherit;
  gap: 7px;
  min-height: 44px;
  opacity: .78;
  padding: 6px 9px;
  text-align: left;
}
.site-app-buttons button > .material-symbols-rounded, .site-menu__app-buttons button > .material-symbols-rounded { color: #8d969a; font-size: 21px; }
.site-app-buttons button > span:last-child, .site-menu__app-buttons button > span:last-child { display: grid; line-height: 1.05; }
.site-app-buttons strong, .site-menu__app-buttons strong { font-size: 10px; font-weight: 850; white-space: nowrap; }
.site-app-buttons small, .site-menu__app-buttons small { font-size: 8px; font-weight: 750; margin-top: 3px; text-transform: uppercase; white-space: nowrap; }
.site-menu__app-buttons { padding: 3px 5px; }
.site-menu__app-buttons button { flex: 1; }

.button {
  align-items: center;
  border: 1px solid transparent;
  border-radius: 10px;
  display: inline-flex;
  font-size: 14px;
  font-weight: 800;
  gap: 9px;
  justify-content: center;
  min-height: 46px;
  padding: 0 19px;
  text-decoration: none;
  transition: transform 150ms ease, box-shadow 150ms ease, background 150ms ease;
}
.button:hover { transform: translateY(-1px); }
.button--small { min-height: 44px; padding-inline: 17px; }
.button--dark { background: linear-gradient(135deg, #173b37, #102d2a); box-shadow: 0 7px 18px rgba(16, 45, 42, .18); color: #fff; }
.button--dark.is-active { box-shadow: 0 0 0 3px rgba(12, 121, 108, .2), 0 7px 18px rgba(16, 45, 42, .18); }

:root[data-theme="dark"] .home-header { background: linear-gradient(90deg, rgba(12,33,32,.98), rgba(10,24,25,.98) 45%, rgba(13,29,29,.98)); border-bottom-color: #294340; box-shadow: 0 9px 30px rgba(0,0,0,.28); }
:root[data-theme="dark"] .home-brand__tagline { color: #9bc2ba; }
:root[data-theme="dark"] .home-brand__image img { filter: brightness(1.65) saturate(.85) drop-shadow(0 4px 10px rgba(0,0,0,.35)); }
:root[data-theme="dark"] .home-nav { background: rgba(25,55,52,.78); border-color: #31524e; }
:root[data-theme="dark"] .home-nav a, :root[data-theme="dark"] .site-menu--nav summary { color: #c4d7d3; }
:root[data-theme="dark"] .home-nav a:hover, :root[data-theme="dark"] .home-nav a.is-active, :root[data-theme="dark"] .site-menu--nav summary:hover, :root[data-theme="dark"] .site-menu--nav[open] summary, :root[data-theme="dark"] .site-menu--nav.is-active summary { background: #1b3533; color: #73d1bf; }
:root[data-theme="dark"] .site-menu summary { background: #142827; border-color: #35504d; color: #d4e2df; }
:root[data-theme="dark"] .site-menu summary:hover, :root[data-theme="dark"] .site-menu[open] summary { border-color: #5c9288; color: #72d0be; }
:root[data-theme="dark"] .site-menu__panel { background: #122524; border-color: #35504d; box-shadow: 0 18px 48px rgba(0,0,0,.42); }
:root[data-theme="dark"] .site-menu__panel a, :root[data-theme="dark"] .site-menu__panel button[data-theme-option] { color: #d0dfdc; }
:root[data-theme="dark"] .site-menu__panel a:hover, :root[data-theme="dark"] .site-menu__panel button[data-theme-option]:hover { background: #1d3936; color: #75d2c0; }
:root[data-theme="dark"] .site-menu__panel a.is-active, :root[data-theme="dark"] .site-menu__panel button[data-theme-option].is-active { background: #21413d; color: #80dbc9; }
:root[data-theme="dark"] .site-menu__divider { border-color: #304744; }
:root[data-theme="dark"] .site-app-buttons button, :root[data-theme="dark"] .site-menu__app-buttons button { background: #1b2928; border-color: #3b4a48; color: #899794; }

@media (max-width: 1500px) {
  .home-nav { display: none; }
  .site-menu--mobile { display: block; }
  .site-menu__compact-only { display: flex !important; }
}

@media (max-width: 950px) { .site-app-buttons { display: none; } }

@media (max-width: 720px) {
  .home-header { gap: 8px; min-height: 70px; padding: 7px 10px; }
  .seo-site-header { margin-bottom: 44px; }
  .home-brand { gap: 8px; }
  .home-brand:not(.home-brand--footer) { gap: 2px; width: 138px; }
  .home-brand__image { height: 54px; width: 138px; }
  .home-brand__image img { margin: 0; top: -7px; transform: none; width: 138px; }
  .home-brand__tagline { font-size: 6px; letter-spacing: .08em; }
  .home-actions { gap: 6px; }
  .home-actions .button, .site-app-buttons { display: none; }
  .site-menu summary { font-size: 0; gap: 0; min-height: 42px; padding-inline: 10px; }
  .site-theme-menu__label { display: none; }
  .site-menu summary .material-symbols-rounded { font-size: 20px; }
  .site-menu__panel { box-sizing: border-box; max-height: calc(100dvh - 84px); max-width: calc(100vw - 20px); overflow-y: auto; overscroll-behavior: contain; right: 0; }
  .site-menu--mobile .site-menu__panel { border-radius: 14px; left: 10px; max-width: none; min-width: 0; position: fixed; right: 10px; top: 77px; width: auto; }
  .site-menu--mobile .site-menu__panel a { min-height: 24px; }
  .site-menu__app-buttons { padding: 2px; }
  .button { animation: none; transition: none; }
}