/* Main-site Header/Footer/Logo layout, translated from Astro/Tailwind into
   scoped native CSS. Keep content and geometry aligned with the source site.
   The company shell uses the main-site blue accent; workbench palettes remain local. */
.iris-shell {
  --iris-company-accent: #006699;
  font-family: var(--iris-font-sans);
  font-size: 16px;
  line-height: 1.5;
}
.iris-shell a { text-decoration: none; }
.iris-shell a:focus-visible,
.iris-shell summary:focus-visible {
  outline: 2px solid var(--iris-company-accent);
  outline-offset: 2px;
}
.iris-site-container {
  width: 100%;
  max-width: var(--iris-container-width);
  margin-inline: auto;
  padding-inline: 16px;
}
.iris-site-header {
  position: sticky;
  top: 0;
  z-index: 50;
  width: 100%;
  border-bottom: 1px solid rgb(45 49 58 / 10%);
  background: rgb(252 252 253 / 95%);
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
}
.iris-header-row {
  display: flex;
  height: var(--iris-header-height);
  align-items: center;
  justify-content: space-between;
}
.iris-logo-link { display: inline-flex; flex-shrink: 0; border-radius: 6px; }
.iris-logo { display: inline-flex; align-items: center; gap: 10px; }
.iris-logo img {
  display: block;
  width: 36px;
  height: 36px;
  flex-shrink: 0;
  border-radius: 50%;
  object-fit: contain;
}
.iris-logo-wordmark {
  color: var(--iris-graphite-900);
  font-size: 18px;
  line-height: 28px;
  font-weight: 600;
  letter-spacing: .16em;
}
.iris-primary-nav, .iris-contact-wrap { display: none; align-items: center; }
.iris-primary-nav { gap: 28px; }
.iris-primary-nav a {
  border-radius: 2px;
  color: var(--iris-graphite-700);
  font-size: 14px;
  line-height: 20px;
  font-weight: 500;
  transition: color .15s;
}
.iris-primary-nav a:hover { color: var(--iris-company-accent); }
.iris-contact-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid transparent;
  border-radius: 6px;
  padding: 8px 16px;
  background: var(--iris-graphite-900);
  color: #ffffff;
  font-size: 14px;
  line-height: 20px;
  font-weight: 500;
  box-shadow: 0 1px 3px rgb(0 0 0 / .1), 0 1px 2px -1px rgb(0 0 0 / .1);
  transition: background-color .15s;
}
.iris-contact-link:hover { background: var(--iris-graphite-800); }
.iris-mobile-menu { position: relative; }
.iris-mobile-menu > summary {
  display: inline-flex;
  width: 40px;
  height: 40px;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  list-style: none;
  border-radius: 6px;
  color: var(--iris-graphite-700);
  transition: color .15s;
}
.iris-mobile-menu > summary::-webkit-details-marker { display: none; }
.iris-mobile-menu > summary:hover { color: var(--iris-graphite-900); }
.iris-mobile-menu > summary svg { display: block; width: 24px; height: 24px; }
.iris-mobile-menu .iris-menu-close { display: none; }
.iris-mobile-menu[open] .iris-menu-open { display: none; }
.iris-mobile-menu[open] .iris-menu-close { display: block; }
.iris-mobile-dropdown {
  position: absolute;
  right: 0;
  top: 48px;
  width: 288px;
  max-width: calc(100vw - 32px);
  /* Keep all company links reachable on short landscape/zoomed viewports. */
  max-height: calc(100vh - 80px);
  max-height: calc(100dvh - 80px);
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  border: 1px solid oklch(92.8% .006 264.531);
  border-radius: 12px;
  background: #ffffff;
  box-shadow: 0 20px 25px -5px rgb(0 0 0 / .1), 0 8px 10px -6px rgb(0 0 0 / .1);
}
.iris-mobile-nav { display: flex; flex-direction: column; padding: 8px; }
.iris-mobile-nav a {
  border-radius: 8px;
  padding: 12px 16px;
  color: var(--iris-graphite-700);
  font-size: 14px;
  line-height: 20px;
  font-weight: 500;
  transition: color .15s, background-color .15s;
}
.iris-mobile-nav a:hover { background: oklch(98.5% .002 247.839); color: var(--iris-company-accent); }
.iris-mobile-nav a:focus-visible { outline-offset: -2px; }
.iris-mobile-nav .iris-mobile-contact {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-top: 8px;
  background: var(--iris-graphite-900);
  color: #ffffff;
}
.iris-mobile-nav .iris-mobile-contact:hover { background: var(--iris-graphite-800); color: #ffffff; }
.iris-site-footer {
  border-top: 1px solid var(--iris-graphite-800);
  background: var(--iris-graphite-900);
  color: var(--iris-offwhite);
}
.iris-site-footer > .iris-site-container { padding-block: 48px; }
.iris-footer-grid { display: grid; grid-template-columns: 1fr; gap: 40px; }
.iris-site-footer .iris-logo-wordmark { color: #ffffff; }
.iris-site-footer a:focus-visible { outline-color: #ffffff; }
.iris-site-footer .iris-positioning {
  margin: 16px 0 0;
  font-size: 12px;
  line-height: 16px;
  font-weight: 600;
  letter-spacing: .05em;
  color: oklch(87.2% .01 258.338);
}
.iris-site-footer .iris-tagline {
  max-width: 448px;
  margin: 12px 0 0;
  font-size: 14px;
  line-height: 1.625;
  color: oklch(70.7% .022 261.325);
}
.iris-shell h2 {
  margin: 0 0 16px;
  color: oklch(87.2% .01 258.338);
  font-size: 14px;
  line-height: 20px;
  font-weight: 600;
  letter-spacing: .05em;
  text-transform: uppercase;
}
.iris-footer-nav ul { list-style: none; padding: 0; margin: 0; }
.iris-footer-nav li + li { margin-top: 8px; }
.iris-footer-nav li { line-height: 24px; }
.iris-footer-nav a {
  border-radius: 2px;
  font-size: 14px;
  line-height: 20px;
  color: oklch(70.7% .022 261.325);
  transition: color .15s;
}
.iris-site-footer a:hover { color: #ffffff; }
.iris-footer-bottom {
  display: flex;
  flex-direction: column;
  gap: 20px;
  margin-top: 48px;
  border-top: 1px solid var(--iris-graphite-800);
  padding-top: 32px;
}
.iris-site-footer .iris-copyright,
.iris-site-footer .iris-contact-address {
  margin: 0;
  color: oklch(70.7% .022 261.325);
  font-size: 14px;
  line-height: 20px;
}
.iris-contact-address { display: flex; flex-direction: column; gap: 12px; font-style: normal; }
.iris-contact-address a { display: inline-flex; align-items: center; gap: 8px; border-radius: 2px; transition: color .15s; }
.iris-contact-address svg { width: 16px; height: 16px; flex-shrink: 0; }
@media (min-width: 640px) {
  .iris-site-container { padding-inline: 24px; }
  .iris-contact-address { flex-direction: row; align-items: center; gap: 20px; }
}
@media (min-width: 768px) {
  .iris-footer-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 32px; }
  .iris-footer-brand { grid-column: span 2; }
  .iris-footer-bottom { flex-direction: row; align-items: center; justify-content: space-between; }
}
/* Six company links need room beside the logo and Contact button. Keep the
   same native menu through tablet widths; footer columns still start at 768px. */
@media (min-width: 1024px) {
  .iris-site-container { padding-inline: 32px; }
  .iris-primary-nav, .iris-contact-wrap { display: flex; }
  .iris-mobile-menu { display: none; }
}