/*
Theme Name: Zwolak Professional
Theme URI: https://mike.zwolak.org/
Description: A restrained professional child theme for Michael Zwolak's personal scientific website.
Author: Michael Zwolak
Template: inspiro
Version: 1.6.0
Text Domain: zwolak-professional
*/

:root {
  --mz-ink: #152638;
  --mz-ink-soft: #45596b;
  --mz-navy: #0b1930;
  --mz-blue: #285985;
  --mz-teal: #187f7a;
  --mz-teal-bright: #35a69d;
  --mz-gold: #c98532;
  --mz-cloud: #f4f7f9;
  --mz-rule: #d9e2e8;
  --mz-white: #ffffff;
  --mz-shadow: 0 15px 38px rgba(9, 31, 52, .11);
  --mz-radius: 18px;
  --mz-content: 1180px;
}

html { scroll-behavior: smooth; }
body {
  color: var(--mz-ink);
  background: var(--mz-white);
  font-size: 18px;
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
}
body, button, input, select, textarea { color: var(--mz-ink); }
a { color: var(--mz-teal); text-underline-offset: .14em; }
a:hover, a:focus { color: var(--mz-blue); }

/* Header and navigation */
.navbar {
  background: rgba(7, 20, 38, .95);
  box-shadow: 0 1px 0 rgba(255,255,255,.08);
  backdrop-filter: blur(10px);
}
.header-inner { max-width: 1320px; }
.custom-logo-text { font-weight: 700; letter-spacing: .01em; }
.navbar-nav > li > a {
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
}
.navbar-nav > li.current-menu-item > a,
.navbar-nav > li.current_page_item > a { color: #6ee0d5; }

/* Keep the fixed navigation compact and prevent the text logo from wrapping. */
.navbar .header-logo-wrapper { min-width: 0; }
.navbar a.custom-logo-text {
  display: block;
  max-width: 100%;
  line-height: 1.1;
  white-space: nowrap;
  overflow-wrap: normal;
  word-break: normal;
  hyphens: none;
}

/* Hero: keep the imaginative image, but make the message authoritative. */
.custom-header { min-height: 620px; max-height: 760px; }
.custom-header-media:before {
  background: linear-gradient(105deg, rgba(5, 15, 30, .88) 0%, rgba(5, 17, 33, .68) 52%, rgba(5, 17, 33, .56) 100%) !important;
  opacity: 1 !important;
}
.custom-header-media img { filter: saturate(.82) contrast(1.02); }
.site-branding .inner-wrap { max-width: 1200px; text-align: left; }
.site-branding-text { display: block !important; width: 100%; max-width: 1000px; }
.site-title {
  margin: 0 0 12px;
  color: #fff;
  font-size: clamp(52px, 7.2vw, 94px);
  font-weight: 700;
  line-height: .98;
  letter-spacing: -.035em;
  text-shadow: 0 3px 20px rgba(0,0,0,.28);
}
.site-title a, .site-title a:hover { color: inherit; text-decoration: none; }
.site-description {
  max-width: 1000px;
  margin: 0;
  color: rgba(255,255,255,.94);
  font-size: clamp(18px, 1.8vw, 23px);
  font-weight: 500;
  line-height: 1.35;
  letter-spacing: .015em;
}
.custom-header-button-wrapper { text-align: left; margin-top: 28px; }
.custom-header-button.button,
.mz-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: 12px 22px;
  border: 2px solid var(--mz-teal-bright);
  border-radius: 999px;
  background: var(--mz-teal-bright);
  color: #061827 !important;
  font-size: 14px;
  font-weight: 800;
  letter-spacing: .045em;
  line-height: 1.2;
  text-decoration: none !important;
  text-transform: uppercase;
  transition: transform .15s ease, box-shadow .15s ease, background .15s ease;
}
.custom-header-button.button:hover,
.mz-button:hover,
.mz-button:focus {
  background: #6ee0d5;
  border-color: #6ee0d5;
  box-shadow: 0 8px 24px rgba(53, 166, 157, .28);
  color: #061827 !important;
  transform: translateY(-1px);
}
.mz-button--secondary {
  background: transparent;
  border-color: var(--mz-blue);
  color: var(--mz-blue) !important;
}
.mz-button--secondary:hover, .mz-button--secondary:focus {
  background: var(--mz-blue);
  border-color: var(--mz-blue);
  color: #fff !important;
}

/* Full-width page system */
.site-content { padding-top: 0; }
.builder-wrap.full-width { padding: 0; max-width: none; }
.entry-content { color: var(--mz-ink); }
.mz-page { overflow: hidden; }
/* Inspiro sets word-wrap: break-word on #page. That is useful for raw URLs but
   can split ordinary scientific words in narrow grid cells. Preserve words in
   the redesigned pages and opt in to aggressive wrapping only where needed. */
.mz-page,
.mz-page p,
.mz-page li,
.mz-page h1,
.mz-page h2,
.mz-page h3,
.mz-page h4,
.mz-page a,
.mz-page strong,
.mz-page span {
  overflow-wrap: normal;
  word-break: normal;
  hyphens: none;
}
.mz-publications a,
.mz-breakable { overflow-wrap: anywhere; word-break: normal; }

.mz-section { padding: 78px 28px; }
.mz-section--compact { padding-top: 52px; padding-bottom: 52px; }
.mz-section--tint { background: var(--mz-cloud); }
.mz-section--dark { background: var(--mz-navy); color: rgba(255,255,255,.9); }
.mz-section--dark h1, .mz-section--dark h2, .mz-section--dark h3, .mz-section--dark strong { color: #fff; }
.mz-container { width: 100%; max-width: var(--mz-content); margin: 0 auto; }
.mz-container--narrow { max-width: 880px; }
.mz-kicker {
  margin: 0 0 13px;
  color: var(--mz-teal);
  font-size: 13px;
  font-weight: 800;
  letter-spacing: .13em;
  text-transform: uppercase;
}
.mz-section--dark .mz-kicker { color: #6ee0d5; }
.mz-display {
  margin: 0 0 24px;
  color: var(--mz-ink);
  font-size: clamp(42px, 6vw, 72px);
  line-height: 1.04;
  letter-spacing: -.035em;
  text-wrap: balance;
}
/* Interior page titles are deliberately quieter than the homepage display. */
h1.mz-display {
  max-width: 1080px;
  font-size: clamp(34px, 4.1vw, 52px);
  line-height: 1.08;
  letter-spacing: -.03em;
}
.mz-heading {
  margin: 0 0 20px;
  color: var(--mz-ink);
  font-size: clamp(29px, 3.45vw, 44px);
  line-height: 1.12;
  letter-spacing: -.025em;
  text-wrap: balance;
}
.mz-subheading {
  margin: 0 0 14px;
  color: var(--mz-ink);
  font-size: 25px;
  line-height: 1.22;
  text-wrap: balance;
}
.mz-lede { max-width: 900px; margin: 0; color: var(--mz-ink-soft); font-size: 22px; line-height: 1.55; }
.mz-section--dark .mz-lede { color: rgba(255,255,255,.78); }
.mz-actions { display: flex; flex-wrap: wrap; gap: 13px; margin-top: 30px; }
.mz-actions--center { justify-content: center; }
.mz-note { color: var(--mz-ink-soft); font-size: 15px; }
.mz-nowrap { white-space: nowrap; }

.mz-grid { display: grid; gap: 26px; }
.mz-grid--2 { grid-template-columns: repeat(2, minmax(0,1fr)); }
.mz-grid--3 { grid-template-columns: repeat(3, minmax(0,1fr)); }
.mz-grid--4 { grid-template-columns: repeat(4, minmax(0,1fr)); }
/* Keep the three primary research pillars in one row on tablets and modest
   desktop windows; stack only on genuinely narrow screens. */
body.mz-modern-page .mz-page--home .mz-pillar-grid,
body.mz-modern-page .mz-pillar-grid,
.mz-page--home .mz-pillar-grid,
.mz-pillar-grid {
  display: flex !important;
  flex-flow: row nowrap !important;
  gap: 20px;
  align-items: stretch;
}
body.mz-modern-page .mz-pillar-grid > .mz-card-link,
.mz-pillar-grid > .mz-card-link {
  flex: 1 1 0 !important;
  min-width: 0 !important;
  grid-column: auto !important;
  grid-row: auto !important;
  margin: 0 !important;
  transform: none !important;
}
.mz-pillar-grid .mz-card { padding: 27px 25px; }
.mz-pillar-grid h3 { font-size: clamp(20px, 1.9vw, 24px); line-height: 1.2; }
.mz-pillar-grid p { font-size: 16px; line-height: 1.58; }
.mz-card {
  height: 100%;
  padding: 30px;
  border: 1px solid var(--mz-rule);
  border-radius: var(--mz-radius);
  background: #fff;
  box-shadow: 0 8px 25px rgba(15, 42, 65, .06);
}
.mz-card h3, .mz-card h4 { margin-top: 0; text-wrap: balance; }
.mz-card p:last-child { margin-bottom: 0; }
.mz-card--accent { border-top: 5px solid var(--mz-teal); }
.mz-card--dark { background: #10243e; border-color: rgba(255,255,255,.1); color: rgba(255,255,255,.8); }
.mz-card--dark h3 { color: #fff; }
.mz-card-link,
.entry-content a.mz-card-link { color: inherit; text-decoration: none !important; }
.mz-card-link:hover .mz-card { transform: translateY(-2px); box-shadow: var(--mz-shadow); }
.mz-card-link .mz-card { transition: transform .18s ease, box-shadow .18s ease; }
.mz-opportunity-grid h3 { font-size: 21px; line-height: 1.2; }
.mz-opportunity-code {
  display: inline-block;
  margin-bottom: 10px;
  color: var(--mz-teal);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .09em;
  text-transform: uppercase;
}

.mz-split { display: grid; grid-template-columns: minmax(0,1.05fr) minmax(320px,.95fr); gap: 58px; align-items: center; }
.mz-split--reverse { grid-template-columns: minmax(320px,.95fr) minmax(0,1.05fr); }
.mz-split--about { grid-template-columns: minmax(0,1.55fr) minmax(230px,.45fr); gap: 66px; }
.mz-split--about .mz-display { max-width: 880px; }
.mz-split--about h1.mz-display { font-size: clamp(34px, 3.85vw, 50px); }
.mz-split--about .mz-lede { max-width: 820px; }
.mz-split--about .mz-portrait { max-width: 270px; }
.mz-visual {
  overflow: hidden;
  border-radius: var(--mz-radius);
  background: var(--mz-navy);
  box-shadow: var(--mz-shadow);
}
.mz-visual img { display: block; width: 100%; height: auto; margin: 0; }
.mz-visual--light { padding: 24px; background: #fff; border: 1px solid var(--mz-rule); }
.mz-portrait { max-width: 310px; margin: 0 auto; }
.mz-portrait img { display: block; width: 100%; border-radius: 18px; box-shadow: var(--mz-shadow); }

.mz-stat-row { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 18px; margin-top: 34px; }
.mz-stat { padding: 22px; border-radius: 14px; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.12); }
.mz-stat strong {
  display: block;
  font-size: clamp(20px, 2.2vw, 32px);
  line-height: 1.08;
  overflow-wrap: normal;
  word-break: normal;
  hyphens: none;
}
.mz-stat span { display: block; margin-top: 7px; color: rgba(255,255,255,.72); font-size: 14px; }

.mz-process { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 0; margin-top: 34px; }
.mz-split .mz-process { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 34px 0; }
.mz-process-step { position: relative; min-width: 0; padding: 22px 24px 22px 58px; border-top: 2px solid var(--mz-rule); }
.mz-process-step:before {
  position: absolute; left: 0; top: -21px; display: grid; place-items: center;
  width: 40px; height: 40px; border-radius: 50%; background: var(--mz-teal); color: #fff;
  content: attr(data-step); font-size: 14px; font-weight: 800;
}
.mz-process-step h3 { margin: 0 0 7px; font-size: 20px; overflow-wrap: normal; word-break: keep-all; hyphens: none; }
.mz-process-step p { margin: 0; color: var(--mz-ink-soft); font-size: 15px; line-height: 1.5; }

.mz-case { display: grid; grid-template-columns: 310px minmax(0,1fr); gap: 38px; padding: 38px 0; border-top: 1px solid var(--mz-rule); align-items: start; }
.mz-case:first-child { border-top: 0; padding-top: 0; }
.mz-case__image img { width: 100%; border-radius: 14px; box-shadow: 0 8px 24px rgba(15,42,65,.1); }
.mz-case__meta { margin: 0 0 10px; color: var(--mz-teal); font-size: 13px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.mz-case h2 { margin: 0 0 14px; font-size: 29px; line-height: 1.2; text-wrap: balance; }
.mz-case p { margin: 0 0 14px; }
.mz-case__links { display: flex; flex-wrap: wrap; gap: 14px; font-size: 15px; font-weight: 700; }

.mz-callout {
  padding: 30px 34px;
  border-left: 6px solid var(--mz-teal);
  border-radius: 0 16px 16px 0;
  background: #eaf5f4;
}
.mz-callout p { margin: 0; font-size: 21px; line-height: 1.55; }
.mz-callout--gold { border-color: var(--mz-gold); background: #fff5e8; }

/* Use one native square marker. Inspiro also supplies list markers, so all
   generated pseudo-markers are explicitly disabled here. */
.mz-page ul.mz-list-clean,
.entry-content ul.mz-list-clean {
  margin: 0;
  padding-left: 1.25rem !important;
  list-style: square outside !important;
}
.mz-page ul.mz-list-clean > li,
.entry-content ul.mz-list-clean > li {
  display: list-item !important;
  position: relative;
  padding: 12px 0 12px 4px;
  border-top: 1px solid var(--mz-rule);
  list-style: square outside !important;
}
.mz-page ul.mz-list-clean > li:first-child,
.entry-content ul.mz-list-clean > li:first-child { border-top: 0; }
.mz-page ul.mz-list-clean > li::before,
.entry-content ul.mz-list-clean > li::before {
  display: none !important;
  content: none !important;
}
.mz-page ul.mz-list-clean > li::marker,
.entry-content ul.mz-list-clean > li::marker {
  color: #111820;
  font-size: .82em;
}

.mz-person-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px; }
.mz-person { padding: 22px; border: 1px solid var(--mz-rule); border-radius: 14px; background: #fff; }
.mz-person strong { display: block; color: var(--mz-ink); font-size: 20px; }
.mz-person span { display: block; margin-top: 4px; color: var(--mz-ink-soft); font-size: 15px; }

.mz-publications { counter-reset: pubs; margin: 0; padding: 0 !important; list-style: none !important; }
.mz-publications li { display: block !important; position: relative; padding: 13px 0 13px 46px; border-top: 1px solid var(--mz-rule); list-style: none !important; line-height: 1.55; }
.mz-publications li::marker { content: ""; font-size: 0; }
.mz-publications li::before { counter-increment: pubs; content: counter(pubs) !important; display: block !important; position: absolute; left: 0; top: 14px; color: var(--mz-teal); font-size: 13px; font-weight: 800; }
.mz-publications li:first-child { border-top: 0; }
.mz-publications a { color: var(--mz-ink); font-weight: 700; text-decoration-color: rgba(24,127,122,.42); }
.mz-pub-year { margin: 42px 0 5px; color: var(--mz-blue); font-size: 24px; }
.mz-pub-year:first-child { margin-top: 0; }
details.mz-details { margin-top: 28px; border: 1px solid var(--mz-rule); border-radius: 15px; background: #fff; }
details.mz-details > summary { cursor: pointer; padding: 20px 24px; color: var(--mz-ink); font-weight: 800; }
details.mz-details[open] > summary { border-bottom: 1px solid var(--mz-rule); }
details.mz-details .mz-details__body { padding: 25px 28px; }

.mz-archive-notice { padding: 18px 24px; border-left: 5px solid var(--mz-gold); background: #fff5e8; color: #5f4420; }

/* Footer */
.site-footer { background: #071322; color: rgba(255,255,255,.75); }
.site-info { padding-top: 28px; padding-bottom: 30px; }
.mz-footer { display: grid; grid-template-columns: 1fr auto; gap: 20px 40px; align-items: start; }
.mz-footer strong { color: #fff; }
.mz-footer p { margin: 4px 0; font-size: 14px; line-height: 1.55; }
.mz-footer__links { display: flex; flex-wrap: wrap; gap: 14px; justify-content: flex-end; }
.mz-footer a { color: #8ce7df; }

/* Remove old page-title/photo treatment on updated pages. */
body.mz-modern-page .page .entry-header,
body.mz-modern-page .entry-cover-image { display: none; }
body.mz-modern-page .site-main { margin: 0; padding: 0; }
body.mz-modern-page .entry-content { margin: 0; }
body.mz-modern-page .site-content-contain { background: #fff; }

/* Accessibility */
:focus-visible { outline: 3px solid #f3b66a; outline-offset: 3px; }
.screen-reader-text:focus { color: var(--mz-ink); }


/* Keep the longest leadership statistic intact at tablet widths. */
@media (min-width: 769px) and (max-width: 920px) {
  .mz-stat strong { font-size: 22px; }
  .mz-stat { padding-left: 18px; padding-right: 18px; }
}

@media (max-width: 1020px) {
  .custom-header { min-height: 560px; }
  .mz-grid--3, .mz-grid--4 { grid-template-columns: repeat(2,minmax(0,1fr)); }
  body.mz-modern-page .mz-page--home .mz-pillar-grid,
  body.mz-modern-page .mz-pillar-grid,
  .mz-page--home .mz-pillar-grid,
  .mz-pillar-grid { flex-flow: row nowrap !important; gap: 14px; }
  .mz-pillar-grid .mz-card { padding: 22px 17px; }
  .mz-pillar-grid h3 { font-size: 19px; }
  .mz-pillar-grid p { font-size: 14.5px; }
  .mz-split, .mz-split--reverse, .mz-split--about { grid-template-columns: 1fr; gap: 36px; }
  .mz-split--about .mz-display { max-width: 940px; }
  .mz-split--about .mz-portrait { max-width: 260px; }
  .mz-case { grid-template-columns: 250px minmax(0,1fr); }
  .mz-process { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 34px 0; }

  .navbar { padding: 11px 0; }
  .headroom--not-top .navbar { padding: 9px 0; }
  .navbar .header-inner { min-height: 48px; flex-wrap: nowrap; }
  .navbar .header-logo-wrapper {
    flex: 1 1 auto;
    justify-content: flex-start;
    max-width: calc(100% - 72px);
    margin-right: 12px;
  }
  .navbar .header-widgets-wrapper { flex: 0 0 auto; }
  body:not(.wp-custom-logo) .navbar a.custom-logo-text {
    font-size: clamp(17px, 3vw, 22px) !important;
    line-height: 1.1 !important;
    letter-spacing: .025em !important;
    text-transform: uppercase;
    white-space: nowrap !important;
  }
  .navbar-toggle {
    width: 44px;
    min-width: 44px;
    height: 44px;
    margin-left: 8px;
    padding: 10px 8px;
  }
  .navbar-toggle .icon-bar { width: 28px; height: 3px; }
  .navbar-toggle .icon-bar:nth-child(3) { width: 22px; }
}
@media (max-width: 768px) {
  body { font-size: 17px; }
  .custom-header { min-height: 520px; }
  .site-branding .inner-wrap { padding-left: 24px; padding-right: 24px; }
  .mz-section { padding: 58px 21px; }
  .mz-grid--2, .mz-grid--3, .mz-grid--4, .mz-person-grid, .mz-stat-row { grid-template-columns: 1fr; }
  body.mz-modern-page .mz-page--home .mz-pillar-grid,
  body.mz-modern-page .mz-pillar-grid,
  .mz-page--home .mz-pillar-grid,
  .mz-pillar-grid { flex-flow: row nowrap !important; gap: 10px; }
  .mz-pillar-grid .mz-card { padding: 18px 12px; }
  .mz-pillar-grid h3 { font-size: 17px; }
  .mz-pillar-grid p { font-size: 13.5px; line-height: 1.48; }
  .mz-case { grid-template-columns: 1fr; gap: 24px; }
  .mz-case__image { max-width: 440px; }
  .mz-footer { grid-template-columns: 1fr; }
  .mz-footer__links { justify-content: flex-start; }
}
@media (max-width: 680px) {
  h1.mz-display { font-size: 32px; line-height: 1.1; }
  .mz-case h2 { font-size: 27px; }
  body.mz-modern-page .mz-page--home .mz-pillar-grid,
  body.mz-modern-page .mz-pillar-grid,
  .mz-page--home .mz-pillar-grid,
  .mz-pillar-grid { flex-flow: column nowrap !important; gap: 18px; }
  .mz-pillar-grid .mz-card { padding: 24px; }
  .mz-pillar-grid h3 { font-size: 23px; }
  .mz-pillar-grid p { font-size: 16px; }

  /* The process sits inside .mz-split, whose desktop selector is more
     specific than .mz-process alone. Override both selectors on phones. */
  .mz-process,
  .mz-split .mz-process {
    grid-template-columns: 1fr !important;
    gap: 38px;
  }
  .mz-process-step { padding: 20px 4px 10px 58px; }
  .mz-process-step h3 { font-size: 21px; }
  .mz-process-step p { font-size: 16px; line-height: 1.55; }
}
@media (max-width: 480px) {
  h1.mz-display { font-size: 30px; }
  .mz-case h2 { font-size: 25px; }
  .site-title { font-size: 42px; }
  .site-description { font-size: 17px; }
  .custom-header-button.button, .mz-button { width: 100%; }
  .mz-actions { display: grid; }
  .mz-card { padding: 24px; }
  .mz-section { padding-left: 18px; padding-right: 18px; }
  body:not(.wp-custom-logo) .navbar a.custom-logo-text {
    font-size: 18px !important;
    line-height: 1.05 !important;
  }
  .navbar .header-inner.wpz_layout_full,
  .navbar .header-inner { padding-left: 16px; padding-right: 16px; }
}

@media (max-width: 360px) {
  h1.mz-display { font-size: 28px; }
  .mz-heading { font-size: 27px; }
  .mz-subheading { font-size: 23px; }
  .mz-card h3 { font-size: 21px; }
  .mz-case h2 { font-size: 23px; }
}

@media (max-width: 350px) {
  body:not(.wp-custom-logo) .navbar a.custom-logo-text { font-size: 16px !important; }
  .mz-section { padding-left: 15px; padding-right: 15px; }
}
