/*
 * Alternet theme. Values measured on the former Salient site (2026-10):
 * container 1500px with 90px sides; header 233px (logo 165px) that shrinks on
 * scroll; breakpoints 1300 / 1000 (header) / 690.
 * Block styles (sections, CTA, team members, ...) live in the alternet-blocks
 * plugin; this file is the page frame and the core blocks.
 */

:root {
  --alt-accent: #27348b;      /* navy: headings, links, footer */
  --alt-extra-1: #00a482;     /* teal: hover, h5 */
  --alt-extra-2: #fac100;     /* yellow */
  --alt-extra-3: #007c5f;     /* dark green */
  --alt-text: #4f5059;
  --alt-muted: #71727e;
  --alt-container: 1500px;
  --alt-gutter: 90px;
  --alt-header-h: 233px;
  --alt-logo-h: 165px;
  --alt-header-pad: 34px;
  --alt-col-gap: 40px;
}

/* ---------- base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  font-family: 'TomaSans-Regular', sans-serif;
  font-size: 16px;
  line-height: 24px;
  color: var(--alt-text);
  background: #fff;
  -webkit-font-smoothing: antialiased;
}
body.header-solid { padding-top: var(--alt-header-h); }
img, video, iframe { max-width: 100%; }
img { height: auto; vertical-align: middle; }
a { color: var(--alt-accent); font-weight: 600; text-decoration: none; transition: color .2s; }
a:hover { color: var(--alt-extra-1); }
/* Every paragraph ends with 24px, the last one too: the former text elements
   had 24px below them, and the converted text is plain paragraphs now. */
p { margin: 0; padding-bottom: 24px; }
li > p, .footer-col p:last-child, .alt-team-member p:last-child, .wp-block-column > p:only-child:empty { padding-bottom: 0; }
b, strong { font-family: 'TomaSans-Bold', sans-serif; font-weight: 700; }
em, i { font-family: 'TomaSans-RegularItalic', 'TomaSans-Regular', sans-serif; }
.fa { font-family: FontAwesome !important; font-style: normal; }
ul, ol { margin: 0 0 24px; padding-left: 30px; }
li > ul, li > ol { margin-bottom: 0; }
li { margin-bottom: 0; }
blockquote { margin: 0 0 24px; padding-left: 20px; border-left: 3px solid var(--alt-extra-1); font-size: 22px; line-height: 34px; }
hr { border: 0; border-top: 1px solid #ddd; margin: 24px 0; }

h1, h2, h3, h4, h5, h6 { margin: 0; color: var(--alt-accent); font-weight: 400; }
h1 { font-family: 'TomaSans-SemiBold', sans-serif; font-size: 60px; line-height: 70px; font-weight: 700; margin-bottom: 7px; }
h2 { font-family: 'TomaSans-Light', sans-serif; font-size: 60px; line-height: 60px; margin-bottom: 7px; }
h3 { font-family: 'TomaSans-Light', sans-serif; font-size: 30px; line-height: 38px; margin-bottom: 7px; }
h4 { font-family: 'TomaSans-SemiBold', sans-serif; font-size: 80px; line-height: 88px; font-weight: 700; margin-bottom: 7px; }
h5 { font-family: 'TomaSans-Bold', sans-serif; font-size: 20px; line-height: 28px; font-weight: 700; color: var(--alt-extra-1); margin-bottom: 7px; }
h6 { font-family: 'TomaSans-SemiBold', sans-serif; font-size: 14px; line-height: 14px; font-weight: 700; letter-spacing: 1px; color: var(--alt-muted); margin-bottom: 7px; }
.is-light h1, .is-light h2, .is-light h3, .is-light h4, .is-light h5, .is-light h6,
.is-light, .is-light p { color: #fff; }

.container {
  max-width: var(--alt-container);
  margin: 0 auto;
  padding: 0 var(--alt-gutter);
  position: relative;
}
.container-narrow { max-width: 1050px; margin: 0 auto; padding: 0 var(--alt-gutter); box-sizing: content-box; }
.screen-reader-text, .skip-link {
  position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(1px, 1px, 1px, 1px); white-space: nowrap;
}
.skip-link:focus { clip: auto; width: auto; height: auto; z-index: 1000; background: #fff; padding: 10px 16px; left: 10px; top: 10px; }

/* ---------- header ---------- */
.site-header {
  position: fixed; top: 0; left: 0; right: 0; z-index: 100;
  background: #fff;
  box-shadow: 0 0 35px rgba(0, 0, 0, .06);
  transition: background-color .3s, box-shadow .3s;
}
.admin-bar .site-header { top: 32px; }
.header-inner {
  display: flex; align-items: center; gap: 0;
  padding-top: var(--alt-header-pad); padding-bottom: var(--alt-header-pad);
  transition: padding .3s;
}
.brand { display: block; flex: 0 0 auto; margin-right: auto; line-height: 0; position: relative; }
.brand .logo { height: var(--alt-logo-h); width: auto; transition: height .3s; }
.brand .logo-light { position: absolute; left: 0; top: 0; opacity: 0; }
.site-name { font-family: 'TomaSans-SemiBold'; font-size: 28px; line-height: 1; color: var(--alt-accent); }

.main-nav .menu { list-style: none; margin: 0; padding: 0; display: flex; align-items: center; }
.main-nav .menu > li { position: relative; padding: 0 10px; margin: 0 10px; }
.main-nav .menu > li > a {
  display: inline-block; position: relative;
  font-family: 'TomaSans-Regular', sans-serif; font-size: 15px; line-height: 15px; font-weight: 600; letter-spacing: 1px;
  color: var(--alt-text); padding: 8px 0;
}
.main-nav .menu > li > a::before { /* animated underline */
  content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 2px; background: currentColor;
  transform: scaleX(0); transform-origin: left; transition: transform .35s cubic-bezier(.52,.01,.16,1);
}
.main-nav .menu > li:hover > a::before, .main-nav .menu > li.current-menu-ancestor > a::before,
.main-nav .menu > li.current-menu-item > a::before { transform: scaleX(1); }
.main-nav .menu > li > a:hover { color: var(--alt-extra-1); }
.main-nav .menu > li.menu-item-has-children > a::after { /* the small arrow under parents */
  content: '\f107'; font-family: FontAwesome; position: absolute; left: 50%; bottom: -12px; transform: translateX(-50%);
  font-size: 12px; line-height: 12px; font-weight: 400; letter-spacing: 0;
}
.main-nav .submenu-toggle { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(1px,1px,1px,1px); border: 0; padding: 0; background: none; }
.main-nav .submenu-toggle:focus { clip: auto; width: auto; height: auto; left: 100%; top: 4px; }
.main-nav .sub-menu {
  list-style: none; margin: 0; padding: 20px; position: absolute; left: 0; top: calc(100% + 20px);
  width: 240px; background: #fff; box-shadow: 0 19px 35px rgba(0, 0, 0, .11);
  opacity: 0; visibility: hidden; transform: translateY(10px); transition: opacity .25s, transform .25s, visibility .25s;
}
.main-nav .menu > li:hover > .sub-menu, .main-nav .menu > li.is-open > .sub-menu, .main-nav .menu > li:focus-within > .sub-menu {
  opacity: 1; visibility: visible; transform: none;
}
.main-nav .sub-menu a { display: block; padding: 6px 0; font-size: 15px; line-height: 20px; font-weight: 600; color: var(--alt-text); letter-spacing: 0; }
.main-nav .sub-menu a:hover { color: var(--alt-extra-1); }

.social { list-style: none; margin: 0; padding: 0; display: flex; gap: 0; }
.social a { display: block; padding: 0 8px; font-size: 15px; line-height: 22px; color: inherit; }
.header-social { margin-left: 20px; color: var(--alt-text); }
.header-social a:hover { color: var(--alt-extra-1); }

/* transparent over the page hero, solid once scrolled */
.header-transparent .site-header:not(.is-scrolled) { background: transparent; box-shadow: none; }
.header-transparent .site-header:not(.is-scrolled) .main-nav .menu > li > a,
.header-transparent .site-header:not(.is-scrolled) .header-social { color: #fff; }
.header-transparent .site-header:not(.is-scrolled) .main-nav .menu > li > a:hover { color: #fff; }
.header-transparent .site-header:not(.is-scrolled) .logo-dark { opacity: 0; }
.header-transparent .site-header:not(.is-scrolled) .logo-light { opacity: 1; }
.site-header.is-scrolled { --alt-logo-h: 95px; --alt-header-pad: 19px; }
.site-header.is-scrolled .sub-menu { top: calc(100% + 19px); }

.menu-toggle { display: none; background: none; border: 0; padding: 10px; margin-left: 4px; cursor: pointer; }
.menu-toggle span { display: block; width: 24px; height: 2px; background: var(--alt-text); margin: 6px 0; }
.header-search { display: none; color: var(--alt-text); font-size: 20px; padding: 10px; }
.header-transparent .site-header:not(.is-scrolled) .header-search { color: #fff; }
.header-transparent .site-header:not(.is-scrolled) .menu-toggle span { background: #fff; }

.offcanvas {
  position: fixed; inset: 0 0 0 auto; width: min(420px, 100%); z-index: 200; overflow-y: auto;
  background: var(--alt-accent); color: #fff; padding: 80px 40px 40px;
  transform: translateX(100%); transition: transform .4s cubic-bezier(.2,.8,.2,1);
}
.offcanvas[hidden] { display: block; visibility: hidden; }
.offcanvas.is-open { transform: none; visibility: visible; }
.offcanvas-close { position: absolute; right: 24px; top: 24px; background: none; border: 0; color: #fff; font-size: 22px; cursor: pointer; }
.offcanvas-menu { list-style: none; margin: 0 0 30px; padding: 0; }
.offcanvas-menu a { color: #fff; font-size: 22px; line-height: 34px; font-weight: 400; display: block; padding: 4px 0; }
.offcanvas-menu .sub-menu { list-style: none; padding: 0 0 10px 16px; margin: 0; }
.offcanvas-menu .sub-menu a { font-size: 16px; line-height: 26px; opacity: .85; }
.offcanvas-menu .submenu-toggle { display: none; }
.offcanvas-social a { color: #fff; font-size: 18px; }
body.offcanvas-open { overflow: hidden; }
body.offcanvas-open::after { content: ''; position: fixed; inset: 0; background: rgba(0,0,0,.5); z-index: 150; }

/* ---------- content frame ---------- */
.site-main { display: block; }
.entry-content::after { content: ''; display: table; clear: both; }
/* Pages are stacks of full-width sections; anything else is held to the container. */
.page-article .entry-content > :not(.alt-section):not(.alignfull) {
  max-width: calc(var(--alt-container) - 2 * var(--alt-gutter)); margin-left: auto; margin-right: auto;
  padding-left: 0; padding-right: 0;
}
@media (max-width: 1500px) {
  .page-article .entry-content > :not(.alt-section):not(.alignfull) { margin-left: var(--alt-gutter); margin-right: var(--alt-gutter); }
}
.page-title { padding-top: 60px; padding-bottom: 40px; }

/* single posts */
.single-header { text-align: center; padding-top: 90px; padding-bottom: 70px; }
.post-categories { list-style: none; padding: 0; margin: 0 0 12px; display: flex; justify-content: center; gap: 8px; }
.post-categories a {
  display: inline-block; border: 2px solid var(--alt-text); border-radius: 200px; padding: 2px 8px;
  font-size: 12px; line-height: 16px; letter-spacing: 1px; font-weight: 600; color: var(--alt-text);
}
.post-categories a:hover { border-color: var(--alt-extra-1); color: var(--alt-extra-1); }
.single-header .entry-title { max-width: 1000px; margin: 0 auto; }
.single-thumb { margin-top: 0; margin-bottom: 50px; }
.single-thumb img { width: 100%; }
.single-content > :not(.alt-section):not(.alignfull):not(.alignwide) { max-width: 1050px; margin-left: auto; margin-right: auto; }
@media (max-width: 1230px) { .single-content > :not(.alt-section):not(.alignfull):not(.alignwide) { margin-left: var(--alt-gutter); margin-right: var(--alt-gutter); } }
.single-content { padding-bottom: 90px; }
.comments-area, #respond { padding-bottom: 90px; }
#respond .comment-reply-title { font-family: 'TomaSans-SemiBold'; font-size: 60px; line-height: 70px; font-weight: 700; color: var(--alt-accent); }

/* archives */
.archive-wrap { padding-top: 60px; padding-bottom: 60px; }
.archive-header { margin-bottom: 50px; }
.archive-kind { display: block; font-size: 30px; line-height: 38px; font-family: 'TomaSans-Light'; color: var(--alt-accent); }
.archive-header h1 { font-family: 'TomaSans-Light'; font-weight: 400; }
.list-entry { padding: 0 0 60px; margin-bottom: 60px; border-bottom: 1px solid #eee; }
.list-entry.is-left.has-thumb { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--alt-col-gap); align-items: start; }
.list-entry.is-stacked .list-thumb { display: block; margin: 10px 0 24px; }
.list-entry.is-stacked .list-thumb img { aspect-ratio: auto; max-height: 640px; }
.list-meta { font-size: 14px; line-height: 20px; color: var(--alt-muted); margin-bottom: 8px; }
.list-meta a { color: inherit; font-weight: 400; }
.list-title { font-family: 'TomaSans-Light'; font-size: 60px; line-height: 60px; margin-bottom: 20px; }
.list-entry.is-left .list-title { font-size: 48px; line-height: 52px; }
.list-title a { color: var(--alt-accent); font-weight: 400; }
.list-thumb img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; }
.read-more { font-size: 14px; letter-spacing: 1px; color: var(--alt-text); }
.pagination .nav-links { display: flex; justify-content: center; gap: 8px; }
.pagination .page-numbers { display: inline-block; min-width: 34px; height: 34px; line-height: 34px; text-align: center; border-radius: 50%; color: var(--alt-text); }
.pagination .page-numbers.current { background: var(--alt-accent); color: #fff; }
.error-404 { text-align: center; padding: 120px var(--alt-gutter); }
.error-404 h1 { font-size: 160px; line-height: 1; }

/* ---------- core blocks ---------- */
.wp-block-image { margin: 0 0 24px; }
.wp-block-image figcaption, .wp-caption-text { font-size: 14px; line-height: 20px; color: var(--alt-muted); margin-top: 8px; }
.alignleft { float: left; margin: 0 24px 16px 0; }
.alignright { float: right; margin: 0 0 16px 24px; }
.aligncenter { display: block; margin-left: auto; margin-right: auto; text-align: center; }
.wp-block-embed { margin: 0 0 24px; }
.wp-block-separator { border: 0; border-top: 1px solid rgba(0,0,0,.1); margin: 24px 0; }
/* Gutters as in the former theme: no gap, 20px on each side of a column and a
   row 20px wider than the content, so column backgrounds sit 40px apart. */
.wp-block-columns { display: flex; flex-wrap: nowrap; gap: 0; margin: 0 calc(var(--alt-col-gap) / -2); align-items: stretch; }
.wp-block-columns > .wp-block-column { margin: 0 calc(var(--alt-col-gap) / 2); flex-shrink: 1; }
/* Each column gives up exactly its gutter, as in the former grid (flex shrink
   would take it in proportion to the width); !important beats the inline
   flex-basis. Other widths (set later in the editor) fall back to shrinking. */
.wp-block-columns > .wp-block-column[style*="flex-basis:100%"] { flex: 0 0 calc(100% - var(--alt-col-gap)) !important; }
.wp-block-columns > .wp-block-column[style*="flex-basis:91.67%"] { flex: 0 0 calc(91.67% - var(--alt-col-gap)) !important; }
.wp-block-columns > .wp-block-column[style*="flex-basis:83.33%"] { flex: 0 0 calc(83.33% - var(--alt-col-gap)) !important; }
.wp-block-columns > .wp-block-column[style*="flex-basis:75%"] { flex: 0 0 calc(75% - var(--alt-col-gap)) !important; }
.wp-block-columns > .wp-block-column[style*="flex-basis:66.67%"] { flex: 0 0 calc(66.67% - var(--alt-col-gap)) !important; }
.wp-block-columns > .wp-block-column[style*="flex-basis:58.33%"] { flex: 0 0 calc(58.33% - var(--alt-col-gap)) !important; }
.wp-block-columns > .wp-block-column[style*="flex-basis:50%"] { flex: 0 0 calc(50% - var(--alt-col-gap)) !important; }
.wp-block-columns > .wp-block-column[style*="flex-basis:41.67%"] { flex: 0 0 calc(41.67% - var(--alt-col-gap)) !important; }
.wp-block-columns > .wp-block-column[style*="flex-basis:33.33%"] { flex: 0 0 calc(33.33% - var(--alt-col-gap)) !important; }
.wp-block-columns > .wp-block-column[style*="flex-basis:25%"] { flex: 0 0 calc(25% - var(--alt-col-gap)) !important; }
.wp-block-columns > .wp-block-column[style*="flex-basis:20%"] { flex: 0 0 calc(20% - var(--alt-col-gap)) !important; }
.wp-block-columns > .wp-block-column[style*="flex-basis:16.67%"] { flex: 0 0 calc(16.67% - var(--alt-col-gap)) !important; }
.wp-block-columns > .wp-block-column[style*="flex-basis:8.33%"] { flex: 0 0 calc(8.33% - var(--alt-col-gap)) !important; }
.wp-block-columns.are-vertically-aligned-center { align-items: center; }
.wp-block-columns.are-vertically-aligned-bottom { align-items: flex-end; }
.wp-block-column { flex: 1 1 0; min-width: 0; }
.wp-block-column[style*="flex-basis"] { flex-grow: 0; }
.wp-block-buttons { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 24px; }
.wp-block-button__link, .alt-btn {
  display: inline-block; background: var(--alt-accent); color: #fff; border-radius: 200px;
  padding: 15px 22px; font-size: 14px; line-height: 14px; font-weight: 600; letter-spacing: 1px;
  box-shadow: 0 9px 20px -5px rgba(0,0,0,.25); transition: transform .2s, box-shadow .2s, opacity .2s;
}
.wp-block-button__link:hover, .alt-btn:hover { color: #fff; transform: translateY(-2px); box-shadow: 0 14px 25px -6px rgba(0,0,0,.3); }
.wp-block-button.is-style-small .wp-block-button__link { padding: 10px 18px; font-size: 12px; line-height: 12px; }
.wp-block-button.is-style-large .wp-block-button__link { padding: 20px 30px; font-size: 16px; line-height: 16px; }
.wp-block-button.is-style-jumbo .wp-block-button__link { padding: 30px 45px; font-size: 24px; line-height: 24px; }
.wp-block-button__link .fa { margin-right: 8px; }
.has-alt-extra-1-background-color { background-color: var(--alt-extra-1) !important; }
.has-alt-accent-background-color { background-color: var(--alt-accent) !important; }
table { border-collapse: collapse; width: 100%; margin-bottom: 24px; }
td, th { border: 1px solid #e0e0e0; padding: 8px 10px; text-align: left; vertical-align: top; }
.wp-block-gallery { margin-bottom: 24px; }

/* ---------- footer ---------- */
.site-footer { background: var(--alt-accent); color: #fff; }
.site-footer a { color: #fff; }
.site-footer a:hover { color: #8eedd1; text-decoration: underline; }
.footer-widgets {
  display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1.2fr) minmax(0, 1.2fr) minmax(0, 1.2fr); gap: var(--alt-col-gap);
  padding-top: 70px; padding-bottom: 40px;
}
.footer-col .widget { margin-bottom: 30px; }
.footer-col p { padding-bottom: 0; }
.footer-col img { display: block; margin: 0 0 10px; }
.copyright { padding: 45px 0; text-align: center; }
.copyright p { font-size: 14px; line-height: 22px; margin: 3px 0 20px; padding: 0; }
.footer-social { justify-content: center; }
.footer-social a { font-size: 16px; padding: 0 12px; }

/* ---------- responsive ---------- */
@media (max-width: 1300px) {
  h1 { font-size: 45px; line-height: 52.5px; }
  h2 { font-size: 51px; line-height: 51px; }
  h3 { font-size: 25.5px; line-height: 32.3px; }
  h4 { font-size: 80px; line-height: 88px; }
  .main-nav .menu > li { margin: 0 4px; }
}
@media (max-width: 1000px) {
  :root { --alt-header-h: 104px; --alt-logo-h: 80px; --alt-header-pad: 12px; }
  .site-header.is-scrolled { --alt-logo-h: 80px; --alt-header-pad: 12px; }
  .main-nav, .header-social { display: none; }
  .menu-toggle, .header-search { display: block; }
  h1 { font-size: 42px; line-height: 49px; }
  h2 { font-size: 45px; line-height: 45px; }
  h3 { font-size: 22.5px; line-height: 28.5px; }
  h4 { font-size: 72px; line-height: 79px; }
  .footer-widgets { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 691px) and (max-width: 1000px) {
  .container { max-width: 600px; padding: 0; }
  .container-narrow { max-width: 600px; padding: 0; }
  .page-article .entry-content > :not(.alt-section):not(.alignfull),
  .single-content > :not(.alt-section):not(.alignfull):not(.alignwide) { max-width: 600px; margin-left: auto; margin-right: auto; }
}
@media (max-width: 782px) {
  .admin-bar .site-header { top: 46px; }
  .wp-block-columns:not(.is-not-stacked-on-mobile) { flex-wrap: wrap; }
  .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column { flex: 0 0 calc(100% - var(--alt-col-gap)) !important; }
}
@media (max-width: 690px) {
  :root { --alt-gutter: 35px; }
  h1 { font-size: 39px; line-height: 45.5px; }
  h2 { font-size: 36px; line-height: 36px; }
  h3 { font-size: 21px; line-height: 26.6px; }
  h4 { font-size: 64px; line-height: 70px; }
  .footer-widgets { grid-template-columns: minmax(0, 1fr); }
  .list-entry.is-left.has-thumb { grid-template-columns: minmax(0, 1fr); }
  .list-title { font-size: 32px; line-height: 36px; }
  .single-header { padding-top: 50px; padding-bottom: 40px; }
  .alignleft, .alignright { float: none; margin: 0 auto 16px; }
}