@font-face {
  font-family: "Nortiva DM Sans";
  font-style: normal;
  font-weight: 100 1000;
  font-display: swap;
  src: url("assets/fonts/dm-sans.woff2") format("woff2");
}
:root {
  --nortiva-paper: #f4f5f2;
  --nortiva-ink: #101622;
  --nortiva-cobalt: #3156df;
  --nortiva-muted: #535a66;
  --nortiva-font-sans: "Nortiva DM Sans", "Avenir Next", sans-serif;
  --nortiva-font-mono: ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;
}
.nortiva-hero, .nortiva-hero *, .nortiva-dialog, .nortiva-dialog * { box-sizing: border-box; }
body.nortiva-page { margin: 0; background: var(--nortiva-paper); }
:where(.nortiva-hero, .nortiva-dialog) button { font: inherit; cursor: pointer; }
.nortiva-hero :is(button, a), .nortiva-dialog button { -webkit-tap-highlight-color: transparent; touch-action: manipulation; }
.nortiva-hero :is(button, a):focus-visible, .nortiva-dialog button:focus-visible { outline: 2px solid var(--nortiva-cobalt); outline-offset: 5px; }

.nortiva-hero {
  position: relative;
  isolation: isolate;
  display: flex;
  flex-direction: column;
  min-height: 100svh;
  overflow: clip;
  padding-inline: clamp(28px, 5.3vw, 88px);
  color-scheme: light;
  color: var(--nortiva-ink);
  background: var(--nortiva-paper);
  font-family: var(--nortiva-font-sans);
  -webkit-font-smoothing: antialiased;
}
.nortiva-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  opacity: .38;
  background-image: linear-gradient(rgba(16, 22, 34, .035) 1px, transparent 1px), linear-gradient(90deg, rgba(16, 22, 34, .035) 1px, transparent 1px);
  background-size: 64px 64px;
  mask-image: linear-gradient(90deg, transparent 20%, #000 62%);
}
.nortiva-header { display: flex; align-items: center; gap: 35px; padding-top: 34px; min-height: 78px; }
.nortiva-brand { display: inline-flex; align-items: center; gap: 13px; flex-shrink: 0; color: var(--nortiva-ink); text-decoration: none; }
.nortiva-brand__mark { width: 33px; height: 33px; color: var(--nortiva-cobalt); }
.nortiva-brand > span { font-size: 24px; font-weight: 650; letter-spacing: .14em; line-height: 1; }
.nortiva-nav { display: flex; gap: 31px; margin-left: auto; }
.nortiva-nav button { min-height: 44px; border: 0; padding: 10px 0; background: transparent; color: var(--nortiva-ink); font-size: 13px; font-weight: 450; transition: color 160ms ease; }
.nortiva-nav button:hover { color: var(--nortiva-cobalt); }
.nortiva-header__cta { display: inline-flex; align-items: center; gap: 18px; border: 1px solid var(--nortiva-ink); border-radius: 5px; padding: 11px 22px; background: var(--nortiva-ink); color: #fff; font-size: 13px; font-weight: 550; line-height: 1.4; white-space: nowrap; transition: background-color 160ms ease; }
.nortiva-header__cta:hover { background: #293142; }
.nortiva-arrow { display: inline-block; font-size: 21px; font-weight: 400; line-height: 1; transition: transform 160ms ease; }
.nortiva-header__cta:hover .nortiva-arrow, .nortiva-button--primary:hover .nortiva-arrow { transform: translate(2px, -2px); }

.nortiva-main { position: relative; display: flex; align-items: center; flex: 1; min-width: 0; padding-block: 66px 60px; }
.nortiva-copy { position: relative; z-index: 1; width: 59%; max-width: 770px; }
.nortiva-eyebrow { display: flex; align-items: center; gap: 14px; margin: 0 0 30px; font-family: var(--nortiva-font-mono); font-size: 10px; line-height: 1.5; letter-spacing: .055em; }
.nortiva-eyebrow::before { content: ""; display: block; width: 8px; height: 8px; flex-shrink: 0; background: var(--nortiva-cobalt); }
.nortiva-title { margin: 0; font-size: clamp(60px, 5.7vw, 88px); font-weight: 700; letter-spacing: -.065em; line-height: 1.07; }
.nortiva-title > span { display: block; white-space: nowrap; }
.nortiva-title > span + span { margin-top: 4px; color: var(--nortiva-cobalt); }
.nortiva-description { max-width: 475px; margin: 30px 0 0; color: #333c4c; font-size: 18px; font-weight: 400; line-height: 1.65; letter-spacing: -.014em; }
.nortiva-actions { display: flex; align-items: center; gap: 31px; margin-top: 33px; }
.nortiva-button { display: inline-flex; align-items: center; justify-content: center; gap: 19px; min-height: 53px; padding: 14px 23px; border: 1px solid transparent; border-radius: 5px; font-size: 14px; font-weight: 550; line-height: 1.4; white-space: nowrap; transition: background-color 160ms ease; }
.nortiva-button--primary { color: #fff; background: var(--nortiva-cobalt); }
.nortiva-button--primary:hover { background: #2345c1; }
.nortiva-button--quiet { padding-inline: 0; gap: 16px; color: var(--nortiva-ink); background: transparent; }
.nortiva-button--quiet:hover .nortiva-arrow { transform: translateX(4px); }
.nortiva-hero__art { position: absolute; z-index: 0; right: -4%; top: 50%; width: 54%; transform: translateY(-50%); pointer-events: none; }
.nortiva-hero__art picture { display: block; }
.nortiva-hero__image { display: block; width: 100%; height: auto; object-fit: contain; }

.nortiva-footer { position: relative; z-index: 1; display: grid; grid-template-columns: 1fr 1.4fr .85fr 1.2fr; align-items: center; gap: 22px; border-top: 1px solid #b9bfc6; padding-block: 24px 32px; font-family: var(--nortiva-font-mono); font-size: 10px; font-weight: 400; letter-spacing: .07em; line-height: 1.6; }
.nortiva-footer > span { display: flex; align-items: baseline; gap: 9px; white-space: nowrap; }
.nortiva-footer > span + span { border-left: 1px solid #b9bfc6; padding-left: 27px; }
.nortiva-footer__index { color: var(--nortiva-muted); }

.nortiva-eyebrow { animation: nortiva-reveal 480ms 40ms both; }
.nortiva-title { animation: nortiva-reveal 480ms 90ms both; }
.nortiva-description { animation: nortiva-reveal 480ms 150ms both; }
.nortiva-actions { animation: nortiva-reveal 480ms 200ms both; }
@keyframes nortiva-reveal { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }

.nortiva-dialog { width: min(590px, calc(100vw - 40px)); max-height: calc(100svh - 48px); padding: 46px; border: 1px solid #c4cad2; border-radius: 6px; overflow-y: auto; color-scheme: light; color: var(--nortiva-ink); background: var(--nortiva-paper); font-family: var(--nortiva-font-sans); box-shadow: 0 25px 90px rgba(16, 22, 34, .15); }
.nortiva-dialog::backdrop { background: rgba(16, 22, 34, .4); backdrop-filter: blur(6px); }
.nortiva-dialog__close-form { position: absolute; right: 17px; top: 17px; }
.nortiva-dialog__close { display: grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 1px solid #bcc3cd; border-radius: 4px; background: transparent; color: var(--nortiva-ink); }
.nortiva-dialog__close:hover { background: #e7eaf0; }
.nortiva-dialog__eyebrow { margin: 0 0 23px; color: var(--nortiva-cobalt); font-family: var(--nortiva-font-mono); font-size: 10px; letter-spacing: .075em; }
.nortiva-dialog h2 { margin: 0 0 24px; padding-right: 5px; font-size: 33px; font-weight: 650; letter-spacing: -.04em; line-height: 1.2; }
.nortiva-dialog__body { color: #3a4455; font-size: 15px; line-height: 1.75; }
.nortiva-dialog__body p { margin: 0 0 15px; }
.nortiva-dialog__body p:last-child { margin-bottom: 0; }
.nortiva-dialog__body strong { color: var(--nortiva-ink); font-weight: 600; }

@media (min-width: 641px) and (max-height: 800px) {
  .nortiva-header { padding-top: 27px; min-height: 71px; }
  .nortiva-main { padding-block: 42px 37px; }
  .nortiva-footer { padding-block: 21px 25px; }
  .nortiva-eyebrow { margin-bottom: 25px; }
  .nortiva-description { margin-top: 25px; }
  .nortiva-actions { margin-top: 28px; }
}
@media (min-width: 641px) and (max-width: 1000px) {
  .nortiva-header { gap: 23px; }
  .nortiva-brand > span { font-size: 21px; }
  .nortiva-brand__mark { width: 28px; height: 28px; }
  .nortiva-nav { gap: 20px; }
  .nortiva-header__cta { padding-inline: 15px; }
  .nortiva-title { font-size: clamp(41px, 5.75vw, 58px); }
  .nortiva-description { font-size: 15px; max-width: 365px; }
  .nortiva-eyebrow { font-size: 8px; gap: 10px; }
  .nortiva-actions { gap: 23px; }
  .nortiva-button { font-size: 12px; gap: 13px; padding-inline: 18px; }
  .nortiva-button--quiet { padding-inline: 0; }
  .nortiva-footer { gap: 13px; font-size: 8px; letter-spacing: .015em; }
  .nortiva-footer > span + span { padding-left: 15px; }
}
@media (max-width: 640px) {
  .nortiva-hero { padding-inline: 24px; }
  .nortiva-hero::before { opacity: .28; background-size: 44px 44px; mask-image: linear-gradient(180deg, transparent 30%, #000 80%); }
  .nortiva-header { position: relative; justify-content: space-between; gap: 15px; min-height: 65px; padding-top: 26px; }
  .nortiva-brand { gap: 9px; }
  .nortiva-brand > span { font-size: 17px; letter-spacing: .12em; }
  .nortiva-brand__mark { width: 25px; height: 25px; }
  .nortiva-header__cta { gap: 11px; font-size: 10px; padding: 10px 13px; border-radius: 4px; }
  .nortiva-header__cta .nortiva-arrow { font-size: 17px; }
  .nortiva-nav { position: absolute; top: 80px; left: 0; gap: 23px; }
  .nortiva-nav button { padding: 4px 0; font-size: 10px; }
  .nortiva-main { flex-direction: column; justify-content: center; align-items: stretch; gap: 20px; padding-block: 69px 15px; }
  .nortiva-copy { width: 100%; max-width: none; }
  .nortiva-eyebrow { gap: 9px; margin-bottom: 21px; font-size: 7px; letter-spacing: .015em; }
  .nortiva-eyebrow::before { width: 6px; height: 6px; }
  .nortiva-title { font-size: clamp(33px, 10.8vw, 67px); font-weight: 700; letter-spacing: -.055em; line-height: 1.09; }
  .nortiva-title > span + span { margin-top: 2px; }
  .nortiva-description { margin-top: 22px; max-width: 420px; font-size: 13px; line-height: 1.7; letter-spacing: -.01em; }
  .nortiva-actions { gap: 24px; margin-top: 24px; }
  .nortiva-button { gap: 13px; min-height: 46px; padding: 12px 17px; font-size: 11px; border-radius: 4px; }
  .nortiva-button .nortiva-arrow { font-size: 18px; }
  .nortiva-button--quiet { gap: 11px; padding-inline: 0; }
  .nortiva-hero__art { position: relative; top: auto; right: auto; align-self: center; width: min(100%, 400px); height: 235px; transform: none; }
  .nortiva-hero__art picture { height: 100%; }
  .nortiva-hero__image { height: 100%; object-fit: contain; }
  .nortiva-footer { grid-template-columns: 1fr 1.3fr; gap: 13px 14px; padding-block: 16px 22px; font-size: 8px; letter-spacing: .01em; }
  .nortiva-footer > span { gap: 5px; }
  .nortiva-footer > span + span { padding-left: 0; border-left: 0; }
  .nortiva-dialog { padding: 42px 27px 29px; }
  .nortiva-dialog h2 { font-size: 28px; }
  .nortiva-dialog__body { font-size: 14px; }
}
@media (max-width: 640px) and (max-height: 780px) {
  .nortiva-main { padding-top: 63px; padding-bottom: 12px; gap: 15px; }
  .nortiva-hero__art { height: 190px; }
  .nortiva-eyebrow { margin-bottom: 17px; }
  .nortiva-description { margin-top: 18px; }
  .nortiva-actions { margin-top: 21px; }
  .nortiva-footer { padding-block: 14px 17px; gap: 10px 14px; }
}
@media (max-width: 350px) {
  .nortiva-hero { padding-inline: 20px; }
  .nortiva-brand > span { font-size: 15px; }
  .nortiva-actions { gap: 19px; }
  .nortiva-button { padding-inline: 14px; font-size: 10px; }
  .nortiva-button--quiet { padding-inline: 0; }
  .nortiva-footer { font-size: 7.5px; }
}
@media (prefers-reduced-motion: reduce) {
  .nortiva-hero *, .nortiva-hero *::before, .nortiva-hero *::after, .nortiva-dialog * { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}