@charset "UTF-8";
/* ============================================================================
   Novatech homepage — August 2026 design
   Built 1:1 against the 1728 x 4630 Illustrator artboard.
   Every px value below is measured from that comp.

   Type sizes live in custom properties so the whole page can be scaled up in
   one edit (see --h26-body / --h26-h1 etc). The comp's own body size is 13.48px.
   ========================================================================== */

.h26 {
  /* palette, sampled from the artboard */
  --c-accent:      #00aeef;
  --c-red:         #c20430;
  --c-ink:         #ffffff;
  --c-bg:          #000000;
  --c-navy:        #0e122c;
  --c-footer:      #030505;
  --c-card:        #000000;
  --c-card-line:   rgba(0, 174, 239, .62);
  --c-mgd-line:    rgba(255, 255, 255, .18);
  --c-btn-a:       #0054a4;
  --c-btn-b:       #003370;
  --c-subscribe:   #2cabe2;
  --c-muted:       #e5e5e5;

  /* type scale (comp values) */
  --h26-h1:        44px;
  --h26-h1-lh:     47px;
  --h26-h2:        44px;
  --h26-h3:        27.8px;
  --h26-h4:        24px;
  --h26-body:      13.48px;
  --h26-body-lh:   20.2px;
  --h26-small:     12px;
  --h26-eyebrow:   10.7px;
  --h26-btn:       12px;

  --container:     1204px;
  --btn-h:         44px;

  background: var(--c-bg);
  color: var(--c-ink);
  font-family: Montserrat, "Helvetica Neue", Arial, sans-serif;
  font-size: var(--h26-body);
  line-height: var(--h26-body-lh);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  overflow-x: hidden;
}

.h26 *, .h26 *::before, .h26 *::after { box-sizing: border-box; }
/* :where() keeps this at zero specificity so per-component sizing always wins. */
.h26 :where(img) { max-width: 100%; height: auto; display: block; }
/* h26_pic() puts the positioning class on BOTH <picture> and <img>, so a
   background picture is positioned as one box rather than leaking a stray
   grid/flex item into its parent. */
.h26 picture { display: block; }
/* `a` is :where()-wrapped so components can set their own colour without a
   specificity fight (this is what was turning the footer pills white-on-white).
   The rest stay at normal specificity — at zero they lose to plugin stylesheets
   and stray heading margins creep back into the layout. */
.h26 :where(a) { color: inherit; text-decoration: none; }
.h26 p { margin: 0; }
.h26 h1, .h26 h2, .h26 h3, .h26 h4 { margin: 0; font-weight: 700; letter-spacing: -.2px; }
.h26 ul { margin: 0; padding: 0; list-style: none; }
.h26 :focus-visible { outline: 2px solid var(--c-accent); outline-offset: 3px; border-radius: 2px; }

.h26__wrap { width: 100%; max-width: var(--container); margin-inline: auto; padding-inline: 24px; }
.h26 .accent { color: var(--c-accent); }

/* ---------- shared atoms ------------------------------------------------- */

.h26-btn {
  display: inline-flex; align-items: center; justify-content: center;
  height: var(--btn-h); padding: 0 22px;
  border: 0; border-radius: calc(var(--btn-h) / 2);
  background: linear-gradient(90deg, var(--c-btn-a) 0%, var(--c-btn-b) 100%);
  color: #fff; font-size: var(--h26-btn); font-weight: 600; line-height: 1;
  letter-spacing: .2px; white-space: nowrap; cursor: pointer;
  transition: filter .18s ease, transform .18s ease;
}
.h26-btn:hover { filter: brightness(1.22); transform: translateY(-1px); }
.h26-btn--wide { padding: 0 30px; }

.h26-eyebrow {
  font-size: var(--h26-eyebrow); font-weight: 500; letter-spacing: .3px;
  color: #fff; margin: 0 0 10px;
}
.h26-h2 { font-size: var(--h26-h2); line-height: var(--h26-h1-lh); }

/* ---------- 1. header ---------------------------------------------------- */

.h26-header {
  position: absolute; inset: 0 0 auto; z-index: 20;
  height: 90px; display: flex; align-items: center;
}
.h26-header__inner {
  width: 100%; max-width: 1500px; margin-inline: auto; padding-inline: 24px;
  display: flex; align-items: center; gap: 28px;
}
.h26-logo { flex: 0 0 auto; }
.h26-logo img { width: 173px; height: auto; }

.h26-nav { display: flex; align-items: center; gap: 24px; margin-left: 24px; }
.h26-nav a {
  font-size: 11.65px; font-weight: 700; letter-spacing: .1px;
  padding: 6px 0; position: relative; white-space: nowrap;
}
.h26-nav a::after {
  content: ""; position: absolute; left: 0; right: 100%; bottom: 0; height: 2px;
  background: var(--c-accent); transition: right .22s ease;
}
.h26-nav a:hover::after, .h26-nav .current-menu-item > a::after { right: 0; }

.h26-header__tools { margin-left: auto; display: flex; align-items: center; gap: 14px; }
.h26-search {
  display: flex; align-items: center; gap: 6px;
  width: 106px; height: 24px; padding: 0 8px;
  background: #fff; border-radius: 12px; border: 0;
}
.h26-search input {
  border: 0; outline: 0; background: transparent; width: 100%;
  font: inherit; font-size: 10px; color: #111;
}
.h26-search svg { flex: 0 0 auto; width: 13px; height: 13px; color: #111; }

.h26-header__cta {
  display: inline-flex; align-items: center; justify-content: center;
  height: 24px; padding: 0 14px; border-radius: 12px;
  border: 1px solid var(--c-red); color: #fff;
  font-size: 8.8px; font-weight: 700; white-space: nowrap;
  transition: background .18s ease;
}
.h26-header__cta:hover { background: var(--c-red); }

.h26-header__login { display: inline-flex; align-items: center; gap: 5px; font-size: 10.5px; font-weight: 700; }
.h26-header__login svg, .h26-header__phone svg { width: 15px; height: 15px; }
.h26-header__phone { display: inline-flex; }

.h26-burger { display: none; width: 34px; height: 34px; align-items: center; justify-content: center;
  background: none; border: 0; color: #fff; cursor: pointer; margin-left: auto; }
.h26-burger svg { width: 22px; height: 22px; }

/* ---------- 2. hero ------------------------------------------------------ */

.h26-hero {
  position: relative; min-height: 415px; display: flex; align-items: center;
  background: #05070f center / cover no-repeat;
  isolation: isolate;
}
.h26-hero::after {
  content: "";
  position: absolute; left: 0; right: 0; bottom: 0;
  height: 260px; z-index: 0; pointer-events: none;
  background: linear-gradient(180deg, transparent 0%, rgba(0,0,0,.08) 30%, rgba(0,0,0,.28) 62%, rgba(0,0,0,.68) 86%, #000 100%);
}
.h26-hero__bg {
  position: absolute; inset: 0; z-index: -1;
  width: 100%; height: 100%; object-fit: cover; object-position: center;
}
.h26-hero__inner { position: relative; z-index: 1; padding-top: 62px; }
.h26-hero h1 { font-size: var(--h26-h1); line-height: var(--h26-h1-lh); max-width: 620px; }
.h26-hero .h26-btn { margin-top: 46px; }

/* ---------- 3. service cards -------------------------------------------- */

.h26-cards { background: var(--c-bg); padding: 53px 0 40px; }
.h26-cards__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }

.h26-card {
  position: relative; min-height: 322px; padding: 40px 28px 34px;
  border: 0; border-radius: 14px; isolation: isolate;
  background: var(--c-card);
  display: flex; flex-direction: column;
  transition: border-color .2s ease, transform .2s ease;
}
.h26-card::before {
  content: ""; position: absolute; inset: 0; z-index: 2; pointer-events: none;
  border: 1px solid var(--c-card-line); border-radius: inherit; transition: border-color .2s ease;
}
.h26-card:hover { transform: translateY(-3px); }
.h26-card:hover::before { border-color: var(--c-accent); }

/* Clipping lives on an inner layer so the icon can straddle the top border. */
.h26-card__media {
  position: absolute; inset: 0; z-index: 0;
  border-radius: inherit; overflow: hidden; pointer-events: none;
}
.h26-card__media img {
  position: absolute; top: -16px; height: calc(100% + 24px); min-height: calc(100% + 24px); width: auto; max-width: none;
  object-fit: cover; opacity: 1;
}
.h26-card--1 .h26-card__media img { left: 0; }
.h26-card--2 .h26-card__media img { left: -210px; }
.h26-card--3 .h26-card__media img { left: -390px; }
.h26-card--4 .h26-card__media img { left: -660px; }
/* Scrim over the photo. Kept opaque enough behind the copy on the left, then
   lifted across the rest so the equipment in the photo actually reads. */
.h26-card__media::after {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(96deg, rgba(0,0,0,.94) 16%, rgba(0,0,0,.44) 52%, rgba(0,0,0,.04) 100%);
}
.h26-card__blur {
  position: absolute; left: 0; right: 0; bottom: 0;
  height: 160px; z-index: 1; pointer-events: none;
  border-radius: 0 0 14px 14px; overflow: hidden;
  backdrop-filter: blur(24px) saturate(190%) brightness(115%);
  -webkit-backdrop-filter: blur(24px) saturate(190%) brightness(115%);
  -webkit-mask-image: linear-gradient(to top, #000 0%, #000 60px, rgba(0,0,0,0.6) 95px, rgba(0,0,0,0.2) 130px, transparent 100%);
  mask-image: linear-gradient(to top, #000 0%, #000 60px, rgba(0,0,0,0.6) 95px, rgba(0,0,0,0.2) 130px, transparent 100%);
}
.h26-card > *:not(.h26-card__media):not(.h26-card__icon):not(.h26-card__blur) { position: relative; z-index: 2; }
.h26-card__icon {
  position: absolute; top: -29px; left: 37px; z-index: 3;
  width: 61px; height: 58px;
}
.h26-card__icon--gradient {
  display: grid; place-items: center; border-radius: 50%;
  background: linear-gradient(145deg, #0076d7, #004e9c); color: #fff;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.18), 0 8px 18px rgba(0,78,156,.22);
}
.h26-card__icon--gradient svg { width: 31px; height: 31px; }
.h26-card__icon--gradient img { width: 56px; height: 56px; object-fit: contain; }
/* These three source images contain stray horizontal marks at their edges.
   Clip only that empty margin, preserving the central glyph and its scale. */
.h26-card__icon--gradient img[src*="card-printer-line"],
.h26-card__icon--gradient img[src*="card-managed-line"],
.h26-card__icon--gradient img[src*="card-voice-line"] { clip-path: inset(0 20%); }
.h26-card__icon--gradient img[src*="cyber-line"] { width: 36px; height: 36px; }
.h26-card__icon--gradient img[src*="managed-ai"] { width: 36px; height: 36px; filter: brightness(0) invert(1); }
.h26-card h3 { font-size: 24px; line-height: 29px; min-height: 58px; }
.h26-card p { margin-top: 26px; max-width: 250px; }
.h26-card__more {
  margin-top: auto; padding-top: 17px;
  font-size: var(--h26-eyebrow); font-weight: 700; letter-spacing: .2px;
}
.h26-card__more span { transition: margin-left .18s ease; margin-left: 4px; display: inline-block; }
.h26-card:hover .h26-card__more span { margin-left: 9px; }

/* ---------- 4. centred CTA ---------------------------------------------- */

.h26-cta { background: var(--c-bg); padding: 42px 0 60px; text-align: center; }
.h26-cta h2 { font-size: var(--h26-h2); line-height: var(--h26-h1-lh); }
.h26-cta__row {
  margin-top: 32px; display: flex; align-items: center; justify-content: center;
  gap: 60px; flex-wrap: wrap;
}
.h26-cta__row p { text-align: left; max-width: 400px; }

/* ---------- 5 + 8. split sections (Print / NovaVoice) -------------------- */

.h26-split { position: relative; isolation: isolate; overflow: hidden; }
.h26-split__bg {
  position: absolute; inset: 0; z-index: -1;
  width: 100%; height: 100%; object-fit: cover; object-position: left center;
}
.h26-split__inner { display: grid; grid-template-columns: 604px 1fr; gap: 116px; align-items: start; }
.h26-split h2 { font-size: var(--h26-h2); line-height: var(--h26-h1-lh); }
.h26-split__copy p + p { margin-top: 20px; }
.h26-split__copy > p:first-of-type { margin-top: 33px; }
.h26-split .h26-btn { margin-top: 44px; }

/* print variant */
.h26-print { padding: 64px 0 0; }
.h26-print .h26-split__inner { grid-template-columns: 590px 1fr; gap: 64px; }

.h26-list { display: flex; flex-direction: column; gap: 20px; }
.h26-list__item {
  display: flex; align-items: center; gap: 26px;
  min-height: 93px; padding: 14px 26px;
  border: 1px solid var(--c-card-line); border-radius: 12px;
  background: rgba(0,0,0,.35); backdrop-filter: blur(2px);
  transition: border-color .2s ease, background .2s ease;
}
.h26-list__item:hover { border-color: var(--c-accent); background: rgba(0,60,90,.22); }
.h26-list__item img { width: 58px; height: auto; flex: 0 0 58px; }
.h26-list__item h3 { font-size: var(--h26-h4); line-height: 1.15; }
.h26-list__item p { margin-top: 8px; }

/* novavoice variant */
.h26-voice { padding: 44px 0 62px; }
.h26-voice .h26-split__inner { grid-template-columns: 560px 1fr; gap: 108px; }
.h26-voice__items { display: flex; flex-direction: column; gap: 47px; padding-top: 30px; }
.h26-voice__item { display: flex; align-items: flex-start; gap: 26px; }
.h26-voice__item img { width: 54px; height: auto; flex: 0 0 54px; }
.h26-voice__item h3 { font-size: var(--h26-h4); line-height: 1.15; }
.h26-voice__item p { margin-top: 10px; }

/* ---------- 6. "why businesses struggle" flow --------------------------- */

.h26-flow { padding: 60px 0 76px; text-align: center; }
.h26-flow h2 { font-size: var(--h26-h2); line-height: var(--h26-h1-lh); margin-top: 48px; }
.h26-flow__diagram {
  margin-top: 70px; display: grid; align-items: center; justify-content: center;
  grid-template-columns: auto 56px auto 56px auto; gap: 0 20px;
}
.h26-flow__pairs { display: grid; grid-template-columns: repeat(2, max-content); gap: 24px 40px; }
.h26-flow__cell { display: flex; align-items: center; gap: 13px; text-align: left; }
.h26-flow__cell img { width: 50px; height: 50px; flex: 0 0 50px; }
.h26-flow__cell span { display: block; width: 96px; }

.h26-flow__arrow { height: 12px; width: 56px; }
.h26-flow__hub {
	width: 132px; height: 132px; border-radius: 50%;
	border: 1px solid var(--c-accent);
	background: radial-gradient(circle at 50% 62%, #123a63 0%, #05080f 72%);
	display: flex; flex-direction: column; align-items: center; justify-content: center;
	gap: 8px; padding: 0 12px;
}
.h26-flow__hub img { width: 44px; height: auto; }
.h26-flow__hub strong { font-size: 18px; line-height: 1.1; font-weight: 700; display: block; text-align: center; }

/* ---------- 7. managed services grid ------------------------------------ */

.h26-mgd { position: relative; isolation: isolate; overflow: hidden; padding: 72px 0 68px; text-align: center; background: #000; }
.h26-mgd__bg { display: none; }
.h26-mgd h2 { font-size: var(--h26-h2); line-height: var(--h26-h1-lh); }
.h26-mgd__lede { margin-top: 36px; font-weight: 700; }
.h26 .h26-mgd__intro {
  width: min(100%, 760px);
  margin: 21px auto 0;
  text-align: center;
}
.h26-print__drivers { padding: 48px 0 72px; }
.h26-print__drivers-copy { max-width: 880px; margin: 0 auto 40px; text-align: center; }
.h26-print__drivers-copy h2 { font-size: var(--h26-h2); line-height: var(--h26-h1-lh); }
.h26-print__drivers-copy p { max-width: 820px; margin: 18px auto 0; font-size: 16px; line-height: 1.6; }
.h26-print__drivers .h26-value-grid { margin-top: 0; }
.h26-print__cta {
  margin-top: 48px;
  text-align: center;
}
.h26-print__cta .h26-btn {
  margin-inline: auto;
}
.h26-value-grid { display: grid; gap: 22px; margin: 54px auto 0; max-width: 1350px; text-align: left; }
.h26-value-grid--four { grid-template-columns: repeat(4, 1fr); }
.h26-value-grid--six { grid-template-columns: repeat(3, 1fr); grid-auto-rows: 1fr; max-width: 862px; align-items: stretch; }
.h26-value-card {
  min-width: 0; overflow: hidden; border: 1px solid rgba(255,255,255,.26); border-radius: 14px;
  background: rgba(14,14,13,.94); box-shadow: 0 10px 28px rgba(0,0,0,.18);
  min-height: 440px; display: flex; flex-direction: column; transition: transform .2s ease, border-color .2s ease;
}
.h26-value-card:hover { transform: translateY(-3px); border-color: rgba(0,170,255,.82); }
.h26-value-card__main { min-height: 294px; padding: 34px 30px 28px; }
.h26-value-card__icon { display: block; width: 72px; height: 72px; margin: 0 auto; object-fit: contain; object-position: center; }
.h26-value-card h3 { margin-top: 28px; font-size: clamp(22px, 1.8vw, 31px); line-height: 1.08; font-weight: 700; }
.h26-value-card ul { margin: 26px 0 0; padding-left: 20px; list-style: disc; }
.h26-value-card li { margin: 0 0 10px; font-size: 16px; line-height: 1.4; }
.h26-value-card__outcome { margin-top: auto; min-height: 124px; padding: 24px 30px 25px; background: rgba(255,255,255,.075); }
.h26-value-card__outcome strong { display: block; font-size: 11px; line-height: 1.2; letter-spacing: 0; text-transform: uppercase; white-space: nowrap; }
.h26-value-card__outcome p { margin-top: 12px; font-size: 16px; line-height: 1.42; }
.h26-value-grid--four .h26-value-card__main,
.h26-value-grid--six .h26-value-card__main { min-height: 270px; padding: 30px 24px 26px; }
.h26-value-grid--four .h26-value-card h3,
.h26-value-grid--six .h26-value-card h3 {
  font-size: 19px;
  text-align: center;
}
.h26-value-grid--four .h26-value-card li,
.h26-value-grid--six .h26-value-card li,
.h26-value-grid--four .h26-value-card__outcome p,
.h26-value-grid--six .h26-value-card__outcome p { font-size: 14px; }
.h26-value-grid--four .h26-value-card__outcome,
.h26-value-grid--six .h26-value-card__outcome { min-height: 112px; padding: 20px 24px; }
.h26-value-grid--six .h26-value-card__main { min-height: 0; padding: 20px 20px 16px; }
.h26-value-grid--six .h26-value-card__icon { width: 54px; height: 54px; }
.h26-value-grid--six .h26-value-card h3 { margin-top: 16px; line-height: 1.1; }
.h26-value-grid--six .h26-value-card ul { margin-top: 16px; padding-left: 18px; }
.h26-value-grid--six .h26-value-card li { margin-bottom: 6px; font-size: 12.5px; line-height: 1.3; }
.h26-value-grid--six .h26-value-card__outcome { min-height: 104px; padding: 16px 20px; }
.h26-value-grid--six .h26-value-card__outcome strong { font-size: 10px; }
.h26-value-grid--six .h26-value-card__outcome p { margin-top: 8px; font-size: 12.5px; line-height: 1.3; }
.h26-value-grid--six .h26-value-card { height: 100%; }
/* Reserve equal heading space so each row's bullet lists start together. */
.h26-value-grid--four .h26-value-card h3 { min-height: 3.24em; }
.h26-value-grid--six .h26-value-card h3 { min-height: 2.2em; }
.h26-print__drivers .h26-value-card__main { flex: 1; min-height: 0; }
.h26-mgd .h26-value-grid { margin-top: 54px; }
.h26-mgd .h26-btn { margin-top: 44px; }
.h26 .h26-mgd__group { margin-top: 96px; scroll-margin-top: 110px; background: transparent; box-shadow: none; border: 0; }
.h26-mgd__group:first-of-type { margin-top: 54px; }
.h26-mgd .h26-mgd__group-heading { margin: 0; font-size: clamp(28px, 3vw, 42px); line-height: 1.08; font-weight: 700; }
.h26-mgd__group .h26-value-grid { margin-top: 28px; }
.h26-mgd__group .h26-value-card { min-height: 0; }
.h26-mgd__group .h26-value-card__main { min-height: 0; }
.h26-mgd__group .h26-value-card__icon[src*="card-voice-line"] { clip-path: inset(0 20%); }
.h26-mgd__group .h26-value-card { background: #101010; border: 1px solid rgba(255,255,255,.3); box-shadow: none; }
.h26-mgd__group .h26-value-card:hover { transform: none; border-color: #00aeef; }
.h26-mgd__group .h26-value-card__main { padding: 18px 20px 14px; }
.h26-mgd__group .h26-value-card__icon { width: 76px; height: 76px; }
.h26-mgd__group .h26-value-card h3 { margin-top: 14px; min-height: 2.2em; font-size: 20px; line-height: 1.1; }
.h26-mgd__group .h26-value-card__outcome { min-height: 88px; padding: 14px 20px 16px; background: #262626; border-top: 1px solid rgba(255,255,255,.08); }
.h26-mgd__group .h26-value-card__outcome strong { font-size: 10px; }
.h26-mgd__group .h26-value-card__outcome p { margin-top: 10px; font-size: 13px; line-height: 1.4; }
.h26-mgd__group .h26-value-card__footer {
  display: flex; align-items: center; align-self: stretch; width: 100%; min-height: 52px;
  margin: auto 0 0; padding: 0; border-top: 1px solid rgba(255,255,255,.08);
  background: #262626;
}
.h26-mgd__group .h26-value-card__link {
  display: inline-flex; align-self: stretch; width: 100%; min-height: 52px; height: auto;
  margin: 0; padding: 0 20px; border: 0; border-radius: 0; background: transparent; color: #8bd6ff;
  justify-content: space-between; gap: 14px; font-size: 14px; line-height: 1.2;
  white-space: normal; text-align: left;
}
.h26-mgd__group .h26-value-card__link:hover { background: #173850; color: #fff; filter: none; transform: none; }
.h26-mgd__group .h26-value-card__link span { font-size: 20px; line-height: 1; }

/* Managed-service tile details: the details well reserves the bullet-list
   space, so opening a card never shifts the row. The static markup keeps the
   bullets available when JavaScript is unavailable. */
.h26-value-card--interactive .h26-value-card__main { display: flex; flex-direction: column; flex: 1; }
.h26-value-card--interactive .h26-value-card__details { display: grid; align-items: start; flex: 1; margin-top: 12px; }
.h26-value-card--interactive .h26-value-card__blurb { display: none; }
.h26-value-card--interactive.is-ready .h26-value-card__blurb {
  display: block; grid-area: 1 / 1; margin: 0; font-size: 14px; line-height: 1.45; opacity: 1;
  transform: none; transition: opacity .2s ease, transform .2s ease;
}
.h26-value-card--interactive.is-ready .h26-value-card__bullets {
  grid-area: 1 / 1; margin: 0; opacity: 0; visibility: hidden;
  transform: translateY(8px); pointer-events: none; transition: opacity .2s ease, transform .2s ease, visibility 0s linear .2s;
}
.h26-value-card--interactive.is-ready.is-expanded .h26-value-card__blurb { opacity: 0; transform: translateY(-6px); pointer-events: none; }
.h26-value-card--interactive.is-ready.is-expanded .h26-value-card__bullets {
  opacity: 1; visibility: visible; transform: none; pointer-events: auto; transition-delay: 0s;
}
.h26-value-card--interactive.is-ready .h26-value-card__bullets li { opacity: 0; transform: translateY(5px); transition: opacity .16s ease, transform .16s ease; }
.h26-value-card--interactive.is-ready.is-expanded .h26-value-card__bullets li { opacity: 1; transform: none; }
.h26-value-card--interactive.is-ready.is-expanded .h26-value-card__bullets li:nth-child(1) { transition-delay: .02s; }
.h26-value-card--interactive.is-ready.is-expanded .h26-value-card__bullets li:nth-child(2) { transition-delay: .05s; }
.h26-value-card--interactive.is-ready.is-expanded .h26-value-card__bullets li:nth-child(3) { transition-delay: .08s; }
.h26-value-card--interactive.is-ready.is-expanded .h26-value-card__bullets li:nth-child(4) { transition-delay: .11s; }

.h26-value-card__toggle {
  display: none;
  align-items: center;
  gap: 6px;
  margin: 0 0 12px auto;
  padding: 4px 12px;
  border-radius: 999px;
  background: rgba(0, 174, 239, .08);
  border: 1px solid rgba(0, 174, 239, .32);
  color: #00aeef;
  font-family: inherit;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: 0.25px;
  cursor: pointer;
  text-decoration: none;
  transition: background .18s ease, border-color .18s ease, color .18s ease;
  align-self: flex-end;
}
.h26-value-card--interactive.is-ready .h26-value-card__toggle {
  display: inline-flex;
}
.h26-value-card__toggle:hover,
.h26-value-card__toggle:focus-visible {
  background: rgba(0, 174, 239, .2);
  border-color: #00aeef;
  color: #fff;
  outline: none;
}
.h26-value-card--interactive.is-ready.is-expanded .h26-value-card__toggle {
  background: rgba(255, 255, 255, .08);
  border-color: rgba(255, 255, 255, .25);
  color: #e5e5e5;
}
.h26-value-card--interactive.is-ready.is-expanded .h26-value-card__toggle:hover {
  background: rgba(255, 255, 255, .16);
  border-color: rgba(255, 255, 255, .6);
  color: #fff;
}
.h26-value-card__toggle-icon {
  display: inline-block;
  font-size: 11px;
  line-height: 1;
  transition: transform .2s ease;
}
.h26-value-card--interactive.is-ready.is-expanded .h26-value-card__toggle-icon {
  transform: rotate(180deg);
}
.h26-mgd__group .h26-value-card.is-expanded {
  border-color: #00aeef;
}

/* ---------- 9. testimonials --------------------------------------------- */

.h26-quotes { background: var(--c-bg); padding: 96px 0 44px; text-align: center; }
.h26-quotes h2 { font-size: var(--h26-h2); line-height: var(--h26-h1-lh); }
.h26-quotes__viewport { margin-top: 59px; overflow: hidden; }
.h26-quotes__track { display: flex; transition: transform .45s cubic-bezier(.4,0,.2,1); }
.h26-quotes__slide { flex: 0 0 100%; display: grid; grid-template-columns: 110px 1fr 230px; gap: 38px; align-items: center; }
.h26-quotes__photo { width: 110px; height: 110px; border-radius: 50%; object-fit: cover; }
.h26-quotes__text { font-size: 15.53px; line-height: 25px; font-style: italic; text-align: center; }
.h26-quotes__who { text-align: center; font-size: 15.53px; line-height: 24px; }
.h26-quotes__who strong { display: block; font-size: 18.63px; font-weight: 700; }
.h26-quotes__who em { display: block; font-style: normal; }
.h26-quotes__who b { display: block; font-weight: 700; }
.h26-quotes__mid { display: flex; flex-direction: column; align-items: center; gap: 29px; }
.h26-quotes__foot { margin-top: 20px; display: flex; justify-content: center; }
.h26-quotes__cta { font-size: 11.65px; font-weight: 700; color: var(--c-muted); }
.h26-quotes__nav { display: flex; align-items: center; gap: 14px; }
.h26-quotes__dots { display: flex; gap: 0; }
.h26-quotes__dots button {
  position: relative; width: 44px; height: 44px; padding: 0; border: 0; border-radius: 50%;
  background: transparent; cursor: pointer;
}
.h26-quotes__dots button::before {
  content: ""; position: absolute; top: 50%; left: 50%; width: 7px; height: 7px;
  border-radius: 50%; background: #757575; transform: translate(-50%, -50%);
  transition: background .2s ease, transform .2s ease;
}
.h26-quotes__dots button[aria-current="true"]::before { background: #fff; transform: translate(-50%, -50%) scale(1.25); }
.h26-quotes__arrow {
  display: inline-grid; place-items: center; width: 44px; height: 44px;
  background: none; border: 0; color: #b8b8b8; cursor: pointer; padding: 0; line-height: 0;
}
.h26-quotes__arrow:hover { color: #fff; }
.h26-quotes__arrow svg { width: 16px; height: 16px; }

/* ---------- 10. 360Print banner ----------------------------------------- */

.h26-banner { background: var(--c-bg); padding: 6px 0 25px; }
.h26-banner__box {
  position: relative; isolation: isolate; overflow: hidden;
  border-radius: 4px; min-height: 324px;
  display: grid; grid-template-columns: 1.05fr 1.05fr .82fr; align-items: center;
  gap: 0 24px; padding: 40px 44px 40px 69px;
}
.h26-banner__bg { position: absolute; inset: 0; z-index: -1; width: 100%; height: 100%; object-fit: cover; }
.h26-banner__lead { font-size: 38px; line-height: 44px; }
.h26-banner__body h3 { font-size: 22px; line-height: 1.2; }
.h26-banner__body p { margin-top: 22px; max-width: 380px; }
.h26-banner__body .h26-btn { margin-top: 32px; height: var(--btn-h); border-radius: calc(var(--btn-h) / 2); }
.h26-banner__media {
  position: relative; display: block; border-radius: 6px; overflow: hidden;
  width: 297px; max-width: 100%; justify-self: end;
  appearance: none; -webkit-appearance: none; border: 0; padding: 0;
  background: none; cursor: pointer; font: inherit; color: inherit;
  transition: transform .2s ease, box-shadow .2s ease;
}
.h26-banner__media img { width: 100%; height: auto; }
.h26-banner__media:hover { transform: scale(1.02); box-shadow: 0 12px 32px rgba(0,0,0,.45); }
/* No CSS play badge: the comp's thumbnail already has one baked in, and
   drawing a second produced the doubled play button. */

/* ---------- 11. partners ------------------------------------------------ */

/* A continuous marquee rather than paged slides: ten logos never divided
   evenly into a page, so the last page was mostly empty and the row read as
   static. home-2026.js clones the set and scrolls it; the arrows nudge it. */
.h26-partners { background: var(--c-bg); padding: 34px 0 56px; text-align: center; }
.h26-partners h2 { font-size: var(--h26-h2); line-height: var(--h26-h1-lh); }
.h26-partners__row { margin-top: 58px; display: flex; align-items: center; gap: 18px; }
.h26-partners__viewport {
  flex: 1 1 auto; overflow: hidden;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 44px, #000 calc(100% - 44px), transparent);
          mask-image: linear-gradient(90deg, transparent, #000 44px, #000 calc(100% - 44px), transparent);
}
.h26-partners__track { display: flex; align-items: center; width: max-content; will-change: transform; }
.h26-partners__item {
  flex: 0 0 auto; width: var(--h26-logo-w, 134px);
  display: flex; align-items: center; justify-content: center; padding: 0 10px;
}
.h26-partners__item img { max-height: 38px; width: auto; object-fit: contain; filter: brightness(0) invert(1); opacity: .95; }
.h26-partners__arrow {
  display: inline-grid; place-items: center; flex: 0 0 44px; width: 44px; height: 44px;
  background: none; border: 0; color: #cfcfcf; cursor: pointer; padding: 0; line-height: 0;
}
.h26-partners__arrow:hover { color: #fff; }
.h26-partners__arrow svg { width: 16px; height: 16px; }

/* ---------- 12. footer --------------------------------------------------- */

.h26-footer { background: var(--c-footer); padding: 66px 0 40px; }
.h26-footer__inner { max-width: 1173px; margin-inline: auto; padding-inline: 24px; }
.h26-footer__cols {
  display: grid;
  grid-template-columns: minmax(190px, 1fr) minmax(190px, .95fr) minmax(210px, 1.1fr) minmax(145px, .75fr) 235px;
  gap: 0 12px;
}
.h26-footer__col h3 { font-size: var(--h26-small); line-height: 23px; font-weight: 700; margin-bottom: 0; }
.h26-footer__col li a { font-size: var(--h26-small); line-height: 23px; font-weight: 500; transition: color .16s ease; }
.h26-footer__col li a:hover { color: var(--c-accent); }
.h26-footer__col--bold li a { font-weight: 700; }
.h26-footer__aside { border-left: 1px solid rgba(255,255,255,.22); padding-left: 40px; }
.h26-footer__pill {
  display: flex; align-items: center; justify-content: center;
  height: 33px; border-radius: 4px; background: #fff; color: #030505;
  font-size: var(--h26-small); font-weight: 700; margin-bottom: 14px;
  transition: background .16s ease;
}
.h26-footer__pill:hover { background: var(--c-accent); color: #fff; }
.h26-footer__news h3 { font-size: 14px; font-weight: 700; letter-spacing: .3px; margin-top: 20px; }
.h26-footer__news p { margin-top: 8px; font-size: var(--h26-small); line-height: 17px; }
.h26-footer__news form { margin-top: 16px; }
.h26-footer__news iframe { display: block; width: 100%; height: 220px; border: 0; }
.h26-footer__news input[type="email"] {
  width: 100%; height: 33px; padding: 0 12px; border: 0; border-radius: 3px;
  background: #424143; color: #fff; font: inherit; font-size: 14px;
}
.h26-footer__news input[type="email"]::placeholder { color: #d8d8d8; }
.h26-footer__news button {
  margin: 20px auto 0; display: flex; align-items: center; justify-content: center;
  width: 173px; height: 33px; border: 0; border-radius: 3px;
  background: var(--c-subscribe); color: #fff; font: inherit;
  font-size: var(--h26-small); font-weight: 700; cursor: pointer;
  transition: filter .18s ease;
}
.h26-footer__news button:hover { filter: brightness(1.12); }
.h26-footer__social { margin-top: 46px; display: flex; gap: 15px; }
.h26-footer__social a { color: var(--c-subscribe); transition: transform .18s ease, color .18s ease; }
.h26-footer__social a:hover { color: #fff; transform: translateY(-2px); }
.h26-footer__social svg { width: 26px; height: 26px; }
.h26-footer__legal { margin-top: 40px; font-size: 11px; color: #8b8b8b; }

@media (max-width: 1180px) {
  .h26-footer__cols { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 32px 24px; }
  .h26-footer__aside { grid-column: 1 / -1; min-width: 0; border-left: 0; padding-left: 0; border-top: 1px solid rgba(255,255,255,.22); padding-top: 30px; }
  .h26-footer__news { max-width: 420px; }
  .h26-footer__news form, .h26-footer__news .gform_wrapper, .h26-footer__news .gform_body,
  .h26-footer__news .gform_fields, .h26-footer__news .gfield { width: 100%; max-width: 100%; }
  .h26-footer__news input[type="email"], .h26-footer__news .ginput_container input { box-sizing: border-box; max-width: 100%; }
}

/* ---------- responsive --------------------------------------------------- */

@media (max-width: 1280px) {
  .h26 { --h26-h1: 40px; --h26-h1-lh: 44px; --h26-h2: 40px; }
  .h26-nav { gap: 16px; }
  .h26-nav a { font-size: 11px; }
  .h26-split__inner, .h26-print .h26-split__inner, .h26-voice .h26-split__inner { gap: 48px; }
  .h26-print .h26-split__inner { grid-template-columns: 1fr 1fr; }
  .h26-voice .h26-split__inner { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 1080px) {
  .h26-nav, .h26-header__tools { display: none; }
  .h26-burger { display: flex; }

  /* The source is a three-panel strip. Scale it to each card on smaller
     screens so neighboring scenes do not bleed into its background. */
  .h26-card__media img {
    top: 50%; left: 0; width: 300%; height: auto; min-height: 0;
    transform: translateY(-50%);
  }
  .h26-card--2 .h26-card__media img { left: 0; transform: translate(-33.3333%, -50%); }
  .h26-card--3 .h26-card__media img {
    left: 0; width: 368.3%; transform: translate(-39.5137%, -50%);
  }
  .h26-card--4 .h26-card__media img { left: 0; transform: translate(-66.6667%, -50%); }

  .h26-header.is-open { height: auto; background: rgba(3, 5, 5, .97); backdrop-filter: blur(6px); }
  .h26-header.is-open .h26-header__inner { flex-wrap: wrap; padding-block: 18px 26px; }
  .h26-header.is-open .h26-nav,
  .h26-header.is-open .h26-header__tools { display: flex; }
  .h26-header.is-open .h26-nav { flex-basis: 100%; margin: 20px 0 0; }
  .h26-header.is-open .h26-nav ul { flex-direction: column; align-items: flex-start; gap: 4px !important; }
  .h26-header.is-open .h26-nav a { font-size: 15px; padding: 10px 0; }
  .h26-header.is-open .h26-header__tools { flex-basis: 100%; margin: 18px 0 0; flex-wrap: wrap; }
  .h26-header.is-open .h26-search { width: 100%; height: 40px; border-radius: 20px; }
  .h26-header.is-open .h26-header__cta { height: 40px; border-radius: 20px; font-size: 12px; padding: 0 20px; }
  .h26-cards__grid { grid-template-columns: 1fr 1fr; gap: 32px; }
  .h26-value-grid--four, .h26-value-grid--six { grid-template-columns: 1fr 1fr; }
  .h26-value-grid--six { max-width: 100%; }
  .h26 .h26-mgd__group { margin-top: 78px; }
  .h26-banner__box { grid-template-columns: 1fr 1fr; row-gap: 32px; }
  .h26-banner__media { grid-column: 1 / -1; width: 340px; max-width: 100%; justify-self: start; }
  .h26-partners { --h26-logo-w: 122px; }
}

@media (max-width: 860px) {
  .h26 { --h26-h1: 34px; --h26-h1-lh: 38px; --h26-h2: 32px; --h26-h3: 24px; --h26-h4: 20px;
         --h26-body: 15px; --h26-body-lh: 23px; --h26-btn: 13px; --h26-eyebrow: 12px;
         --btn-h: 44px; }
  .h26-hero { min-height: 520px; }
  .h26-hero__bg { object-position: 72% center; opacity: .55; }
  .h26-hero__inner { padding-top: 96px; padding-bottom: 40px; }
  .h26-cards__grid { grid-template-columns: 1fr; gap: 46px; }
  .h26-card { min-height: 0; }
  /* On phones, keep the section-link cards tappable only through their CTA. */
  .h26-card--1,
  .h26-card--2,
  .h26-card--3,
  .h26-card--4 { pointer-events: none; }
  .h26-card--1 .h26-card__more,
  .h26-card--2 .h26-card__more,
  .h26-card--3 .h26-card__more,
  .h26-card--4 .h26-card__more { pointer-events: auto; }
  .h26-split__inner, .h26-print .h26-split__inner, .h26-voice .h26-split__inner {
    grid-template-columns: 1fr; gap: 42px;
  }
  .h26-voice__items { padding-top: 0; gap: 30px; }
  .h26-cta__row { flex-direction: column; gap: 26px; }
  .h26-cta__row p { text-align: center; }
  .h26-flow__diagram { grid-template-columns: 1fr; gap: 30px; justify-items: center; }
  .h26-flow__arrow { transform: rotate(90deg); }
  .h26-print__drivers { padding: 40px 0 56px; }
  .h26-print__drivers-copy { margin-bottom: 32px; }
  .h26-print__drivers-copy p { font-size: 15px; line-height: 1.55; }
  .h26-value-grid--four, .h26-value-grid--six { grid-template-columns: 1fr; }
  .h26-value-grid--four .h26-value-card,
  .h26-value-grid--four .h26-value-card__main { min-height: 0; }
  .h26 .h26-mgd__group { margin-top: 64px; }
  .h26-value-card__main { min-height: 0; }
  .h26-value-grid--four .h26-value-card h3,
  .h26-value-grid--six .h26-value-card h3 { min-height: 0; }
  .h26-quotes__slide { grid-template-columns: 1fr; justify-items: center; gap: 20px; }
  .h26-banner__box { grid-template-columns: 1fr; padding: 32px 22px; row-gap: 26px; }
  .h26-banner__lead { font-size: 32px; line-height: 38px; }
  .h26-banner__body p { max-width: none; }
  .h26-banner__media { width: 100%; max-width: 420px; justify-self: center; margin-inline: auto; }
  .h26-partners { --h26-logo-w: 108px; }
  .h26-footer__cols { grid-template-columns: 1fr 1fr; gap: 32px 24px; }
  .h26-footer__aside { grid-column: 1 / -1; border-left: 0; padding-left: 0; border-top: 1px solid rgba(255,255,255,.22); padding-top: 30px; }
  /* match the full-width white pills above it */
  .h26-footer__news button,
  .h26-footer__news .gform_button,
  .h26-footer__news input[type="submit"] { width: 100%; margin-inline: 0; }
}

@media (prefers-reduced-motion: reduce) {
  .h26 *, .h26 *::before, .h26 *::after {
    transition-duration: .01ms !important; animation-duration: .01ms !important;
  }
  .h26-value-card__blurb, .h26-value-card__bullets, .h26-value-card__bullets li { transition: none !important; }
}