@font-face{font-family:Poppins;font-style:italic;font-weight:500;font-display:swap;src:url(/fonts/poppins-500i.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:Poppins;font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/poppins-400.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:Poppins;font-style:normal;font-weight:500;font-display:swap;src:url(/fonts/poppins-500.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:Poppins;font-style:normal;font-weight:600;font-display:swap;src:url(/fonts/poppins-600.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:Poppins;font-style:normal;font-weight:700;font-display:swap;src:url(/fonts/poppins-700.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
/* Obvify — rebuilt from the Squarespace 7.1 site. Sizes are taken from the
   live site at a 1440px viewport and scale with the viewport the same way
   Squarespace's fluid type does: size = (factor) * vw + 1rem. */

:root {
  --navy: #003049;          /* Squarespace "accent" */
  --red: #d62828;           /* Squarespace "darkAccent" */
  --light: #eaeaee;         /* Squarespace "lightAccent" */
  --white: #fff;
  --gutter: 2vw;
  --gap: 11px;
  --pad: 3.3vw;             /* section top/bottom padding */
  --dh: 6vw;                /* section divider height */
  --fs-h1: calc(3.5vw + 1rem);
  --fs-h2: calc(2.1vw + 1rem);
  --fs-h3: calc(1.4vw + 1rem);
  --fs-h4: calc(0.7vw + 1rem);
  --fs-lg: calc(0.583vw + 1rem);
  --fs-p: calc(0.233vw + 1rem);
  --fs-sm: 1rem;
  --fs-item: calc(1.05vw + 1rem);
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  font-family: Poppins, system-ui, -apple-system, "Segoe UI", sans-serif;
  font-weight: 500;
  font-size: var(--fs-p);
  line-height: 1.8;
  color: var(--navy);
  background: var(--white);
  overflow-x: hidden;
}
img { display: block; max-width: 100%; height: auto; }
a { color: inherit; }
h1, h2, h3, h4 { font-weight: 600; margin: 0 0 .5em; letter-spacing: normal; }
h1 { font-size: var(--fs-h1); line-height: 1.232; }
h2 { font-size: var(--fs-h2); line-height: 1.3; }
h3 { font-size: var(--fs-h3); line-height: 1.333; }
h4 { font-size: var(--fs-h4); line-height: 1.366; }
p { margin: 0 0 1em; }
p:last-child, h1:last-child, h2:last-child, h3:last-child, h4:last-child { margin-bottom: 0; }
strong { font-weight: 700; }
ul { margin: 0 0 1em; padding-left: 1.2em; }
li p { margin: 0 0 .5em; }
blockquote { margin: 0; }
.lg, .lg p { font-size: var(--fs-lg); line-height: 1.8; }
.sm, .sm p, .sm li { font-size: var(--fs-sm); line-height: 1.8; }
.center { text-align: center; }
.red { color: var(--red); }
.black { color: #000; }
.white, .white h1, .white h2, .white h3, .white h4 { color: var(--white); }

/* Squarespace "wave" text highlight: a hand-drawn underline on each line */
.wave {
  --wave: var(--navy);
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 26 10'%3E%3Cpath d='M0 8.6c6.5 0 6.5-7.2 13-7.2s6.5 7.2 13 7.2' fill='none' stroke='%23003049' stroke-width='2.6' stroke-linecap='round'/%3E%3C/svg%3E") repeat-x 0 100% / .5em .19em;
  padding-bottom: .12em;
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
}

/* Squarespace "scribble" highlight used on the product page titles */
.scribble {
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 577 20' preserveAspectRatio='none'%3E%3Cpath d='M 0,9.12 c 43.275,-0.333 201.95,-2.442 288.5,-2.22 c 86.55,0.222 279.845,3.7 288.5,3.7 c 8.655,0 -152.905,-4.255 -230.8,-3.7 c -77.895,0.555 -279.845,6.512 -288.5,7.4 c -8.655,0.888 170.215,-1.48 230.8,-1.48 c 60.585,0 173.1,0.703 173.1,1.48 c 0,0.777 -129.825,3.145 -173.1,3.7 c -43.275,0.555 -98.09,0 -115.4,0' fill='none' stroke='%23d62828' stroke-width='5.2' stroke-linecap='square' stroke-linejoin='bevel'/%3E%3C/svg%3E") no-repeat 0 100% / 100% .385em;
  padding-bottom: .16em;
}

/* ---------- header / footer ---------- */
.site-header {
  display: flex; align-items: center; justify-content: space-between;
  height: 73px; padding: 0 var(--gutter);
  background: var(--white);
  border-bottom: 2px solid var(--navy);
  position: relative; z-index: 10;
}
.site-header .logo img { width: 172px; height: auto; }
.btn {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 221px; min-height: 70px; padding: 0 21px;
  border-radius: 300px; background: var(--navy); color: var(--white);
  font-size: var(--fs-sm); font-weight: 500; line-height: 1.2; text-decoration: none;
  transition: opacity .2s;
}
.btn:hover { opacity: .85; }
.btn-sm { min-width: 0; min-height: 0; padding: 11.4px 19px; font-size: 14.27px; }
.site-footer { padding: 14px var(--gutter); display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.site-footer img { width: 221px; }

/* ---------- sections ---------- */
section.s { position: relative; padding: var(--pad) var(--gutter); background: var(--bg, var(--white)); }
section.s.s-grid { background-color: var(--light); background-image: linear-gradient(rgba(234,234,238,.15), rgba(234,234,238,.15)), url(/img/grid-bg.webp); background-size: cover; background-position: center; }
section.s.s-light { --bg: var(--light); }
section.s.s-navy { --bg: var(--navy); color: var(--white); }
.s-navy h1, .s-navy h2, .s-navy h3, .s-navy h4 { color: var(--white); }
.s-line { border-bottom: 6px solid var(--navy); }

/* Section dividers. The section's background is clipped along the divider
   line; the next section slides up underneath so its background shows
   through, exactly like Squarespace's divider sections. */
.dw { position: relative; z-index: 2; margin-bottom: calc(-1 * var(--dh)); }
.dw > section.s { clip-path: var(--clip); padding-bottom: calc(var(--pad) + var(--dh)); }
.dw > svg.div-stroke { position: absolute; left: 0; bottom: 0; width: 100%; height: var(--dh); overflow: visible; pointer-events: none; }
.dw:last-child { margin-bottom: 0; }
.dw + section.s, .dw + .dw > section.s { padding-top: calc(var(--pad) + var(--dh)); }

/* 24-column grid matching Squarespace's fluid engine */
.fe { display: grid; grid-template-columns: repeat(24, minmax(0, 1fr)); column-gap: var(--gap); row-gap: 2.2vw; align-items: start; }
.fe > * { grid-column: var(--c, 1 / -1); }
.mid { align-self: center; }

/* ---------- home ---------- */
.hero { min-height: calc(853px - 73px); }
.hero-collage { position: relative; aspect-ratio: 686 / 694; }
.hero-collage img { position: absolute; border: 6px solid var(--navy); background: var(--white); }
.rule { border: 0; border-top: 2px solid var(--navy); margin: 0; opacity: .9; }

/* ---------- carousel (Squarespace list section) ---------- */
.car { position: relative; }
.car-track {
  display: grid; grid-auto-flow: column;
  grid-auto-columns: calc((100% - 2 * 3vw) / 3);
  column-gap: 3vw; overflow-x: auto; scroll-snap-type: x mandatory;
  scrollbar-width: none; scroll-behavior: smooth;
}
.car-track::-webkit-scrollbar { display: none; }
.car-item { scroll-snap-align: start; }
.car-item img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; margin-bottom: 1rem; }
.car-item h3 { font-size: var(--fs-item); line-height: 1.3; margin-bottom: .4em; }
.car-item p { font-size: var(--fs-sm); line-height: 1.8; }
.car-btn {
  position: absolute; top: var(--arrow-top, 50%); transform: translateY(-50%);
  width: 48px; height: 48px; border-radius: 50%; border: 0; cursor: pointer;
  background: rgba(0, 48, 73, .6); color: var(--white); display: grid; place-items: center;
  z-index: 3;
}
.car-btn:hover { background: rgba(0, 48, 73, .85); }
.car-btn svg { width: 22px; height: 22px; }
.car-prev { left: 1.5vw; }
.car-next { right: 1.5vw; }
.car-img { --arrow-top: calc((100% - 6 * 3vw) / 6); }

/* ---------- product pages ---------- */
.p-hero { text-align: center; padding-top: 2vw; }
.p-hero h1 { margin-bottom: .45em; }
.p-hero h3 { max-width: 64vw; margin: 0 auto; }
.band p { max-width: 64vw; margin: 0 auto; text-align: center; }
.intro-h4 { max-width: 72vw; margin: 0 auto 2.2vw; text-align: center; }
.full-img { width: 100%; }

/* annotated screenshot on Integrated Interfaces */
.tour { position: relative; container-type: inline-size; }
.tour > img { width: 100%; }
.tour .spot { position: absolute; border-radius: 50%; background: rgba(214, 40, 40, .28); transform: translate(-50%, -50%); }
.tour .note {
  position: absolute; display: flex; align-items: center; justify-content: center;
  background: var(--navy); border: 6px solid var(--red); border-radius: 4px;
  color: var(--white); text-align: center; font-weight: 700;
  font-size: 1.4cqw; line-height: 1.72; padding: 0 3.1cqw;
}

/* ---------- team solutions ---------- */
.team-row { position: relative; }
.team-card { background: var(--navy); color: var(--white); padding: 2.3vw 2.3vw 2.6vw; position: relative; z-index: 2; }
.team-card h3 { color: var(--white); }
.team-img img { width: 100%; height: 100%; object-fit: cover; }
.team-quote { margin-top: 3.5vw; }

/* ---------- contact ---------- */
.contact .mail { font-size: var(--fs-h4); font-weight: 600; word-break: break-word; }

/* ---------- blog ---------- */
.blog-list { padding: 0 var(--gutter); }
.post-card { display: grid; grid-template-columns: 37.3% 1fr; gap: 5.4vw; align-items: center; padding: 1vw 0 1vw 1.4vw; }
.post-card img { width: 100%; aspect-ratio: 1; object-fit: cover; }
.post-card .date { font-size: 14px; margin-bottom: 1.5em; }
.post-card h2 { font-size: var(--fs-h2); line-height: 1.3; font-weight: 500; color: #000; }
.post-card h2 a { text-decoration: none; }
.post-card .excerpt { font-size: var(--fs-sm); color: #000; margin-top: 1.2em; }
.more { display: inline-block; margin-top: 1.5em; font-size: var(--fs-sm); color: var(--navy); text-decoration: none; border-bottom: 1px solid currentColor; line-height: 1.6; }
.post { max-width: calc(725px + 2 * var(--gutter)); margin: 0 auto; padding: 3vw var(--gutter) 4vw; }
.post .date { font-size: 14px; margin-bottom: 1.5em; }
.post h1 { font-size: var(--fs-h1); line-height: 1.232; margin-bottom: .8em; }
.post .body p, .post .body li { font-size: var(--fs-sm); line-height: 1.8; }
.post .body h3 { margin-top: 1.4em; }
.post .body li { margin-bottom: .7em; }
.post .body img { width: 100%; margin: 2em 0; }
.post .body a { text-decoration: underline; }
.pager { display: flex; justify-content: space-between; gap: 2rem; margin-top: 4vw; padding-top: 2vw; border-top: 1px solid rgba(0, 48, 73, .2); }
.pager a { text-decoration: none; max-width: 45%; }
.pager small { display: block; font-size: 13px; text-transform: uppercase; letter-spacing: .06em; opacity: .7; }
.pager .next { text-align: right; margin-left: auto; }

/* ---------- 404 ---------- */
.nf { text-align: center; padding: 10vw var(--gutter); }

/* ---------- mobile (Squarespace switches to its mobile layout at 767px) ---------- */
@media (max-width: 767px) {
  /* Squarespace's mobile type scale, measured on the live site at 390px */
  :root {
    --gutter: 6vw; --pad: 9vw; --dh: 9vw;
    --fs-h1: min(calc(8.3vw + 1rem), 60px);
    --fs-h2: min(calc(4.98vw + 1rem), 44px);
    --fs-h3: min(calc(3.32vw + 1rem), 36px);
    --fs-h4: min(calc(1.66vw + 1rem), 26px);
    --fs-lg: min(calc(1.38vw + 1rem), 24px);
    --fs-p: min(calc(0.385vw + 1rem), 19px);
    --fs-item: min(calc(2.49vw + 1rem), 31px);
  }
  .fe { row-gap: 6vw; }
  .fe > * { grid-column: 1 / -1; grid-row: auto !important; }
  .hero { min-height: 0; }
  .p-hero h3, .band p, .intro-h4 { max-width: none; }
  .car-track { grid-auto-columns: 82%; column-gap: 5vw; }
  .car-img { --arrow-top: calc(82vw * 0.88 / 3); }
  .car-prev { left: 2vw; } .car-next { right: 2vw; }
  .team-card { margin: 0 !important; padding: 7vw 6vw; }
  .team-quote { margin-top: 0; }
  .post-card { grid-template-columns: 1fr; gap: 5vw; padding: 5vw 0; }
  .post-card h2 { font-size: var(--fs-h3); }
  .post h1 { font-size: var(--fs-h1); }
  .site-footer img { width: 150px; }
  .site-header .logo img { width: 140px; }
  .tour .note { position: static; display: block; width: auto !important; height: auto !important; font-size: var(--fs-sm); padding: 1rem 1.2rem; margin-top: 4vw; border-width: 4px; }
  .tour .spot { display: none; }
}
@media (prefers-reduced-motion: reduce) { .car-track { scroll-behavior: auto; } }