@font-face { font-family: "Hanken Grotesk"; font-style: normal; font-weight: 100 900; font-display: swap; src: url("fonts/hanken-grotesk.woff2") format("woff2"); }
@font-face { font-family: "JetBrains Mono"; font-style: normal; font-weight: 100 800; font-display: swap; src: url("fonts/jetbrains-mono.woff2") format("woff2"); }
@font-face { font-family: "Lora"; font-style: normal; font-weight: 400 700; font-display: swap; src: url("fonts/lora.woff2") format("woff2"); }
@font-face { font-family: "Lora"; font-style: italic; font-weight: 400 700; font-display: swap; src: url("fonts/lora-italic.woff2") format("woff2"); }
body { margin: 0; background: #ffffff; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
a { color: #235b9c; text-decoration: none; }
a:hover { text-decoration: underline; }
.situ-input { font-family: "Hanken Grotesk", system-ui, sans-serif; font-size: 14px; color: #11182b; background: #fff; border: 1px solid #dadee7; border-radius: 4px; height: 40px; padding: 0 12px; width: 100%; transition: border-color .15s ease, box-shadow .15s ease; outline: none; box-sizing: border-box; }
.situ-input::placeholder { color: #6a738a; }
.situ-input:hover { border-color: #6a738a; }
.situ-input:focus { border-color: #3a77b8; box-shadow: 0 0 0 3px #e1f0ff; }
textarea.situ-input { height: auto; padding: 10px 12px; line-height: 1.5; resize: vertical; }
@keyframes situ-s1 { 0%, 0% { opacity: 0 } 5%, 92% { opacity: 1 } 96%, 100% { opacity: 0 } }
@keyframes situ-s2 { 0%, 5% { opacity: 0 } 10%, 92% { opacity: 1 } 96%, 100% { opacity: 0 } }
@keyframes situ-s3 { 0%, 10% { opacity: 0 } 15%, 92% { opacity: 1 } 96%, 100% { opacity: 0 } }
@keyframes situ-s4 { 0%, 15% { opacity: 0 } 20%, 92% { opacity: 1 } 96%, 100% { opacity: 0 } }
@keyframes situ-s5 { 0%, 20% { opacity: 0 } 25%, 92% { opacity: 1 } 96%, 100% { opacity: 0 } }
@keyframes situ-s6 { 0%, 25% { opacity: 0 } 30%, 92% { opacity: 1 } 96%, 100% { opacity: 0 } }
@keyframes situ-s7 { 0%, 30% { opacity: 0 } 35%, 92% { opacity: 1 } 96%, 100% { opacity: 0 } }
@keyframes situ-s8 { 0%, 35% { opacity: 0 } 40%, 92% { opacity: 1 } 96%, 100% { opacity: 0 } }
@keyframes situ-s9 { 0%, 40% { opacity: 0 } 45%, 92% { opacity: 1 } 96%, 100% { opacity: 0 } }
@keyframes situ-v1 { 0%, 8% { opacity: 0 } 13%, 38% { opacity: 1 } 42%, 100% { opacity: 0 } }
@keyframes situ-v2 { 0%, 38% { opacity: 0 } 43%, 58% { opacity: 1 } 62%, 100% { opacity: 0 } }
@keyframes situ-v3 { 0%, 58% { opacity: 0 } 63%, 92% { opacity: 1 } 96%, 100% { opacity: 0 } }
@keyframes situ-p1 { 0%, 18% { opacity: 0 } 23%, 92% { opacity: 1 } 96%, 100% { opacity: 0 } }
@keyframes situ-p2 { 0%, 38% { opacity: 0 } 43%, 92% { opacity: 1 } 96%, 100% { opacity: 0 } }
@keyframes situ-p3 { 0%, 58% { opacity: 0 } 63%, 92% { opacity: 1 } 96%, 100% { opacity: 0 } }
@keyframes situ-dot { 0%, 38% { left: 12.38% } 43%, 58% { left: 56.43% } 63%, 92% { left: 30% } 100% { left: 12.38% } }
@keyframes situ-f1 { 0%, 0% { opacity: 0 } 8%, 100% { opacity: 1 } }
@keyframes situ-f2 { 0%, 4% { opacity: 0 } 12%, 100% { opacity: 1 } }
@keyframes situ-f3 { 0%, 8% { opacity: 0 } 16%, 100% { opacity: 1 } }
@keyframes situ-f4 { 0%, 12% { opacity: 0 } 20%, 100% { opacity: 1 } }
@keyframes situ-f5 { 0%, 16% { opacity: 0 } 24%, 100% { opacity: 1 } }
@keyframes situ-f6 { 0%, 20% { opacity: 0 } 28%, 100% { opacity: 1 } }
@keyframes situ-fchip { 0%, 45% { opacity: 0 } 55%, 100% { opacity: 1 } }
@keyframes situ-fbgf { 0%, 45% { background-color: transparent } 55%, 100% { background-color: #f7e7e2 } }
@keyframes situ-fbgc { 0%, 45% { background-color: transparent } 55%, 100% { background-color: #f6ecd8 } }
@keyframes situ-fup2 { 0%, 72% { transform: translateY(0) } 86%, 100% { transform: translateY(calc(-2 * var(--portfolio-row-height, 38px))) } }
@keyframes situ-fup3 { 0%, 72% { transform: translateY(0) } 86%, 100% { transform: translateY(calc(-3 * var(--portfolio-row-height, 38px))) } }
@keyframes situ-fdn2 { 0%, 72% { transform: translateY(0) } 86%, 100% { transform: translateY(calc(2 * var(--portfolio-row-height, 38px))) } }
@keyframes situ-fdn3 { 0%, 72% { transform: translateY(0) } 86%, 100% { transform: translateY(calc(3 * var(--portfolio-row-height, 38px))) } }
@keyframes situ-g1 { 0%, 0% { opacity: 0 } 6%, 92% { opacity: 1 } 96%, 100% { opacity: 0 } }
@keyframes situ-g2 { 0%, 4% { opacity: 0 } 10%, 92% { opacity: 1 } 96%, 100% { opacity: 0 } }
@keyframes situ-g3 { 0%, 8% { opacity: 0 } 14%, 92% { opacity: 1 } 96%, 100% { opacity: 0 } }
@keyframes situ-g4 { 0%, 12% { opacity: 0 } 18%, 92% { opacity: 1 } 96%, 100% { opacity: 0 } }
@keyframes situ-g5 { 0%, 16% { opacity: 0 } 22%, 92% { opacity: 1 } 96%, 100% { opacity: 0 } }
@keyframes situ-g6 { 0%, 20% { opacity: 0 } 26%, 92% { opacity: 1 } 96%, 100% { opacity: 0 } }
@keyframes situ-h1 { 0%, 30% { opacity: 0 } 33%, 92% { opacity: 1 } 96%, 100% { opacity: 0 } }
@keyframes situ-k1 { 0%, 32% { opacity: 0 } 36%, 92% { opacity: 1 } 96%, 100% { opacity: 0 } }
@keyframes situ-h2 { 0%, 41% { opacity: 0 } 44%, 92% { opacity: 1 } 96%, 100% { opacity: 0 } }
@keyframes situ-k2 { 0%, 43% { opacity: 0 } 47%, 92% { opacity: 1 } 96%, 100% { opacity: 0 } }
@keyframes situ-h3 { 0%, 52% { opacity: 0 } 55%, 92% { opacity: 1 } 96%, 100% { opacity: 0 } }
@keyframes situ-k3 { 0%, 54% { opacity: 0 } 58%, 92% { opacity: 1 } 96%, 100% { opacity: 0 } }
@keyframes situ-h4 { 0%, 63% { opacity: 0 } 66%, 92% { opacity: 1 } 96%, 100% { opacity: 0 } }
@keyframes situ-k4 { 0%, 65% { opacity: 0 } 69%, 92% { opacity: 1 } 96%, 100% { opacity: 0 } }
@keyframes situ-h5 { 0%, 74% { opacity: 0 } 77%, 92% { opacity: 1 } 96%, 100% { opacity: 0 } }
@keyframes situ-k5 { 0%, 76% { opacity: 0 } 80%, 92% { opacity: 1 } 96%, 100% { opacity: 0 } }
@keyframes situ-amk { 0%, 38% { transform: translateY(0) } 43%, 58% { transform: translateY(42px) } 63%, 100% { transform: translateY(84px) } }
@keyframes situ-a1 { 0%, 23% { background-color: transparent } 28%, 38% { background-color: #f7f8fb } 43%, 100% { background-color: transparent } }
@keyframes situ-a2 { 0%, 38% { background-color: transparent } 43%, 58% { background-color: #f7f8fb } 63%, 100% { background-color: transparent } }
@keyframes situ-a3 { 0%, 58% { background-color: transparent } 63%, 92% { background-color: #f7f8fb } 96%, 100% { background-color: transparent } }
@keyframes situ-tabfill { from { transform: scaleX(0) } to { transform: scaleX(1) } }
@keyframes situ-pchipbox { 0%, 0.98% { opacity: 0; transform: translateY(10px) } 4.28%, 100% { opacity: 1; transform: translateY(0) } }
@keyframes situ-pband { 0%, 0.98% { opacity: 0; transform: translateY(10px) } 4.28%, 100% { opacity: 1; transform: translateY(0) } }
@keyframes situ-prow1 { 0%, 17.76% { opacity: 0; transform: translateY(8px) } 20.5%, 100% { opacity: 1; transform: translateY(0) } }
@keyframes situ-prow2 { 0%, 29.05% { opacity: 0; transform: translateY(-10px) } 31.41%, 100% { opacity: 1; transform: translateY(0) } }
@keyframes situ-prow3 { 0%, 52.45% { opacity: 0; transform: translateY(-10px) } 54.92%, 100% { opacity: 1; transform: translateY(0) } }
@keyframes situ-prow4 { 0%, 77.8% { opacity: 0; transform: translateY(8px) } 80.16%, 100% { opacity: 1; transform: translateY(0) } }
    @keyframes situ-penv { 0%, 16% { opacity: 0 } 21%, 100% { opacity: 1 } }
    @keyframes situ-pfdel { 0%, 36% { opacity: 0; transform: translateX(-12px) } 43%, 100% { opacity: 1; transform: translateX(0) } }
    @keyframes situ-pfder { 0%, 10.52% { opacity: 0; transform: translateX(22px) } 13.86%, 100% { opacity: 1; transform: translateX(0) } }
    @keyframes situ-pmodl { 0%, 39% { opacity: 0; transform: translateX(-46px) } 48%, 100% { opacity: 1; transform: translateX(0) } }
    @keyframes situ-pmodr { 0%, 10.52% { opacity: 0; transform: translateX(22px) } 13.86%, 100% { opacity: 1; transform: translateX(0) } }
    @keyframes situ-pmodr3 { 0%, 72.16% { opacity: 0; transform: translateX(22px) } 76.26%, 100% { opacity: 1; transform: translateX(0) } }
    @keyframes situ-pmodr2 { 0%, 45.47% { opacity: 0; transform: translateX(22px) } 49.58%, 100% { opacity: 1; transform: translateX(0) } }
    @keyframes situ-ppkt114 { 0% { opacity: 0; transform: translateY(0) } 10% { opacity: 1 } 88% { opacity: 1 } 100% { opacity: 0; transform: translateY(110px) } }
    @keyframes situ-bmold { 0%, 49% { opacity: 0 } 51.5%, 62.72% { opacity: 1 } 65%, 100% { opacity: 0 } }
    @keyframes situ-bmnew { 0%, 63.5% { opacity: 0 } 66.5%, 100% { opacity: 1 } }
    @keyframes situ-pout3 { 0%, 84.06% { opacity: 0 } 88.07%, 100% { opacity: 1 } }
    @keyframes situ-bmline { 0%, 82% { opacity: 0 } 86%, 100% { opacity: 1 } }
    @keyframes situ-ppktup { 0% { opacity: 0; transform: translateY(0) } 12% { opacity: 1 } 86% { opacity: 1 } 100% { opacity: 0; transform: translateY(-26px) } }
    @keyframes situ-feng { 0%, 43% { transform: translate(-50%, -50%) } 45.4%, 69.7% { transform: translate(-50%, calc(-50% + 97px)) } 72.1%, 84% { transform: translate(-50%, calc(-50% + 194px)) } 87%, 100% { transform: translate(-50%, calc(-50% + 306px)) } }
    @keyframes situ-psrc { 0%, 17.76% { opacity: 0; transform: translateY(-6px) } 22.48%, 100% { opacity: 1; transform: translateY(0) } }
    @keyframes situ-pin { 0%, 23.5% { opacity: 0 } 27.5%, 100% { opacity: 1 } }
    @keyframes situ-pout { 0%, 80.88% { opacity: 0 } 85.5%, 100% { opacity: 1 } }
    @keyframes situ-pcard { 0%, 81.7% { opacity: 0; transform: translateY(10px) } 89.61%, 100% { opacity: 1; transform: translateY(0) } }
    @keyframes situ-stream { from { transform: translateY(-50%) } to { transform: translateY(0) } }
    @keyframes situ-pdash { from { stroke-dashoffset: 0 } to { stroke-dashoffset: -16 } }
    @keyframes situ-ppulse { 0%, 100% { background-color: #1f2638 } 50% { background-color: #192b47 } }
    @keyframes situ-ppkt50 { 0% { opacity: 0; transform: translateY(0) } 12% { opacity: 1 } 86% { opacity: 1 } 100% { opacity: 0; transform: translateY(46px) } }
    @keyframes situ-ppkt96 { 0% { opacity: 0; transform: translateY(0) } 10% { opacity: 1 } 88% { opacity: 1 } 100% { opacity: 0; transform: translateY(92px) } }
    @keyframes situ-ppkt38 { 0% { opacity: 0; transform: translateY(0) } 12% { opacity: 1 } 86% { opacity: 1 } 100% { opacity: 0; transform: translateY(34px) } }
    @keyframes situ-pcell { 0%, 31.41% { opacity: 0; transform: scaleX(0) } 35.21%, 100% { opacity: 1; transform: scaleX(1) } }
    @keyframes situ-hcap1 { 0% { opacity: 0 } 2%, 9% { opacity: 1 } 11%, 100% { opacity: 0 } }
    @keyframes situ-hcap { 0% { opacity: 0 } 2%, 17% { opacity: 1 } 19%, 100% { opacity: 0 } }
    @keyframes situ-hcaplast { 0% { opacity: 0 } 2%, 100% { opacity: 1 } }
    @keyframes situ-h1 { 0%, 30% { opacity: 0 } 33%, 100% { opacity: 1 } }
@keyframes situ-k1 { 0%, 32% { opacity: 0 } 36%, 100% { opacity: 1 } }
@keyframes situ-h2 { 0%, 41% { opacity: 0 } 44%, 100% { opacity: 1 } }
@keyframes situ-k2 { 0%, 43% { opacity: 0 } 47%, 100% { opacity: 1 } }
@keyframes situ-h3 { 0%, 52% { opacity: 0 } 55%, 100% { opacity: 1 } }
@keyframes situ-k3 { 0%, 54% { opacity: 0 } 58%, 100% { opacity: 1 } }
@keyframes situ-h4 { 0%, 63% { opacity: 0 } 66%, 100% { opacity: 1 } }
@keyframes situ-k4 { 0%, 65% { opacity: 0 } 69%, 100% { opacity: 1 } }
@keyframes situ-h5 { 0%, 74% { opacity: 0 } 77%, 100% { opacity: 1 } }
@keyframes situ-k5 { 0%, 76% { opacity: 0 } 80%, 100% { opacity: 1 } }
@keyframes situ-amk { 0%, 38% { transform: translateY(0) } 43%, 58% { transform: translateY(42px) } 63%, 100% { transform: translateY(84px) } }
@keyframes situ-a1 { 0%, 23% { background-color: transparent } 28%, 38% { background-color: #f7f8fb } 43%, 100% { background-color: transparent } }
@keyframes situ-a2 { 0%, 38% { background-color: transparent } 43%, 58% { background-color: #f7f8fb } 63%, 100% { background-color: transparent } }
@keyframes situ-a3 { 0%, 58% { background-color: transparent } 63%, 92% { background-color: #f7f8fb } 96%, 100% { background-color: transparent } }
@keyframes situ-pstat { 0%, 55.74% { opacity: 0; transform: scaleX(0) } 58.82%, 100% { opacity: 1; transform: scaleX(1) } }
@keyframes situ-pmvA { 0%, 62.72% { transform: translateY(0); animation-timing-function: cubic-bezier(0.45,0,0.2,1) } 66%, 100% { transform: translateY(22px) } }
@keyframes situ-pmvB { 0%, 62.72% { transform: translateY(0); animation-timing-function: cubic-bezier(0.45,0,0.2,1) } 66%, 100% { transform: translateY(-11px) } }
@keyframes situ-pmvD { 0%, 62.72% { transform: translateY(0); animation-timing-function: cubic-bezier(0.45,0,0.2,1) } 66%, 100% { transform: translateY(11px) } }
@keyframes situ-pmvF { 0%, 62.72% { transform: translateY(0); animation-timing-function: cubic-bezier(0.45,0,0.2,1) } 66%, 100% { transform: translateY(-33px) } }
[data-pipe="paused"] [style*="animation"] { animation-play-state: paused !important; }
@media (prefers-reduced-motion: reduce) { [style*="animation"] { animation: none !important; } }

[data-hover="hover-1"]:is(:hover, :focus-visible) { color: #11182b !important; text-decoration: underline !important; }
[data-hover="hover-2"]:is(:hover, :focus-visible) { background-color: #235b9c !important; border-color: #235b9c !important; }
[data-hover="hover-3"]:is(:hover, :focus-visible) { background-color: #f7f8fb !important; border-color: #6a738a !important; text-decoration: none !important; }
[data-hover="hover-4"]:is(:hover, :focus-visible) { background-color: #e1f0ff !important; border-color: #e1f0ff !important; }
[data-hover="hover-5"]:is(:hover, :focus-visible) { opacity: 1 !important; text-decoration: underline !important; }

/* Static defaults keep the page and all product examples usable without JavaScript. */
:root {
  --tab1Disp: block; --tab2Disp: block; --tab3Disp: block;
  --tab1Fill: none; --tab2Fill: none; --tab3Fill: none;
  --tab1Track: #dadee7; --tab2Track: #dadee7; --tab3Track: #dadee7;
  --tabPlay: running; --pipePlay: running;
  --bc1: 1; --bc2: 1; --bc3: 1; --bc4: 1; --bc5: 1;
  --co1: 0; --co2: 0; --co3: 0; --co4: 0; --co5: 0;
}
.contact-dialog, .dialog-content { box-sizing: border-box; }
html { scroll-padding-top: 90px; }
body { font-family: "Hanken Grotesk", system-ui, sans-serif; }
button, input, textarea { font: inherit; }
:focus-visible { outline: 3px solid #3a77b8; outline-offset: 4px; }
[data-contact] { text-decoration: none !important; }
.skip-link { position: fixed; left: 16px; top: -80px; padding: 12px; z-index: 100; background: white; }
.skip-link:focus { top: 12px; }
#product-demos, #product-demos > [role="tabpanel"] { min-width: 0; }
/* The pipeline uses a fixed coordinate system; scale its entire canvas together. */
#pipeline { position: relative; width: 482px; max-width: 100%; min-width: 0; aspect-ratio: 482 / 562; overflow: clip; }
#pipeline > div { position: absolute !important; top: 0; left: 0; transform: scale(var(--pipeline-scale, 1)); transform-origin: top left; }
.contact-dialog { width: min(440px, calc(100% - 32px)); max-height: calc(100dvh - 32px); padding: 0; border: 0; border-radius: 4px; color: #11182b; box-shadow: 0 24px 70px -16px #11182b80; }
.contact-dialog::backdrop { background: #11182b73; }
body:has(.contact-dialog[open]) { overflow: hidden; }
.dialog-brand { display: flex; align-items: center; gap: 8px; padding: 16px 22px; background: #11182b; color: white; font-size: 19px; }
.dialog-content { padding: 22px; }
.dialog-content h2 { margin: 0; font: 600 22px/1.2 Lora, Georgia, serif; }
.dialog-content p { color: #6a738a; font-size: 13.5px; line-height: 1.5; }
.contact-field { display: flex; flex-direction: column; gap: 6px; margin-top: 14px; }
.contact-field label { font-size: 13px; font-weight: 600; }
.contact-honeypot { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); }
.dialog-content #contact-error { color: #b4503f; }
.dialog-content #contact-status:empty { display: none; }
.dialog-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 20px; }
.dialog-actions button { min-height: 40px; padding: 8px 18px; font-size: 14px; font-weight: 600; border: 1px solid transparent; border-radius: 4px; cursor: pointer; }
.dialog-actions button[type="submit"] { background: #11182b; color: white; }
.dialog-actions button[type="submit"]:hover { background: #235b9c; }
.dialog-actions button:disabled { opacity: 0.6; cursor: wait; }
.dialog-actions button[type="button"] { background: white; color: #11182b; }
.dialog-actions button[type="button"]:hover { background: #f7f8fb; }
@media (max-width: 1000px) {
  .site-header > div { height: auto !important; min-height: 64px; padding-top: 16px !important; padding-bottom: 16px !important; gap: 20px; flex-wrap: wrap; }
  .site-header nav { gap: 18px !important; flex-wrap: wrap; }
  #why > div > div[style*="grid-template-columns"] { grid-template-columns: minmax(0, 1fr) !important; gap: 32px !important; }
  #pipeline { justify-self: center; }
  .customers > div > div[style*="grid-template-columns"] { gap: 24px !important; }
}
@media (max-width: 700px) {
  html { scroll-padding-top: 90px; }
  main > section > div, footer > div, .site-header > div { padding-left: 20px !important; padding-right: 20px !important; }
  main > section > div { padding-top: 44px !important; padding-bottom: 44px !important; }
  h1 { font-size: 39px !important; }
  main h2 { font-size: 30px !important; }
  .site-header nav { gap: 12px 18px !important; }
  .site-header nav [data-contact] { height: 36px !important; }
  .hero [style*="margin-top: 32px"] { flex-wrap: wrap; }
  .hero [data-contact] { white-space: normal !important; height: auto !important; min-height: 48px; padding: 12px 20px !important; }
  .customers > div > div[style*="grid-template-columns"] { grid-template-columns: minmax(0, 1fr) !important; gap: 28px !important; }
  .customers > div > div > div > div:first-child { height: auto !important; min-height: 70px; }
  .customers img { max-width: 290px !important; }
  .experience > div { flex-direction: column; align-items: flex-start !important; gap: 24px !important; }
  .experience > div > span { width: 100% !important; height: 1px; }
  #product [role="tablist"] { grid-template-columns: minmax(0, 1fr) !important; gap: 20px !important; }
  #product [role="tab"] { min-width: 0; }
  #why [style*="font-size: 62px"] { font-size: 48px !important; }
  .contact-cta > div { align-items: flex-start !important; flex-direction: column; gap: 24px !important; }
  .contact-cta [data-contact] { white-space: normal !important; height: auto !important; min-height: 48px; padding: 12px 18px !important; }
  footer > div:first-child { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  footer > div:first-child > div:first-child { grid-column: 1 / -1; }
  footer > div:last-child > div { flex-direction: column; gap: 10px; }
  .situ-input { font-size: 16px; }
}


/* Reflow the product examples so the content stays readable on narrow screens. */
@media (max-width: 1000px) {
  #product-demos .demo-frame { height: auto !important; padding: 20px 16px !important; }
  .extraction-demo { grid-template-columns: minmax(0, 1fr) !important; height: auto !important; gap: 20px !important; }
  .extraction-demo > div { min-width: 0; }
  .extraction-demo > div:nth-child(2) { height: 1px; }
  .history-demo { width: 100% !important; height: auto !important; display: grid; gap: 16px; }
  .history-demo > div { position: relative !important; left: auto !important; top: auto !important; width: 100% !important; box-sizing: border-box; }
  .history-demo > div:first-child { padding: 16px !important; }
  .history-demo > div:first-child > div:first-child { flex-wrap: wrap; gap: 8px !important; }
  .history-demo > div:last-child [style*="grid-template-columns"] { grid-template-columns: minmax(0, 1fr) 64px 56px !important; gap: 6px !important; padding-left: 28px !important; padding-right: 8px !important; }
  .history-demo > div:last-child [style*="grid-template-columns"] > span:first-child { overflow-wrap: anywhere; }
  .portfolio-demo > div:first-child { flex-wrap: wrap; gap: 10px; }
  .portfolio-demo > div:last-child > div:first-child { display: none !important; }
  .portfolio-demo { --portfolio-row-height: 156px; }
  .portfolio-demo > div:last-child > div:not(:first-child) { grid-template-columns: repeat(6, minmax(0, 1fr)) !important; grid-template-rows: 24px 40px 40px 36px; height: var(--portfolio-row-height) !important; padding: 8px 0; }
  .portfolio-demo [data-label] { min-width: 0; grid-column: span 2; display: block !important; padding: 0 4px !important; white-space: normal !important; }
  .portfolio-demo [data-label="Asset"], .portfolio-demo [data-label="Technology"] { grid-column: span 3; }
  .portfolio-demo [data-label="Technology"] { text-align: right; }
  .portfolio-demo [data-label]:not([data-label="Asset"]):not([data-label="Technology"]):not([data-label="Flag"])::before { content: attr(data-label); display: block; font: 9px/1.5 "JetBrains Mono", monospace; color: #6a738a; }
  .portfolio-demo [data-label="Flag"] { grid-column: 1 / -1; display: flex !important; gap: 6px !important; overflow: visible !important; }
  .portfolio-demo [data-label="Flag"] > span:last-child { white-space: normal !important; }
}
@media (max-width: 700px) {
  .comparison-table { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .comparison-table > div { min-width: 0; padding: 12px !important; overflow-wrap: anywhere; }
  .comparison-table > div:first-child { display: none; }
  .comparison-table > div:nth-child(3n + 4) { grid-column: 1 / -1; }
}

.menu-toggle { display: none; }
@media (max-width: 700px) and (orientation: portrait) {
  .js .site-header > div { min-height: 64px; padding-top: 10px !important; padding-bottom: 10px !important; box-sizing: border-box; }
  .js .menu-toggle { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border: 1px solid #dadee7; border-radius: 4px; color: #11182b; background: #fff; cursor: pointer; }
  .js #site-navigation { display: none !important; position: absolute; top: 100%; left: 0; right: 0; padding: 16px 20px 20px; background: #fff; border-bottom: 1px solid #dadee7; box-shadow: 0 12px 20px -16px #11182b80; flex-direction: column; align-items: stretch !important; gap: 8px !important; max-height: calc(100dvh - 64px); overflow-y: auto; box-sizing: border-box; }
  .js .menu-toggle[aria-expanded="true"] + #site-navigation { display: flex !important; }
  .js #site-navigation > a { display: flex; align-items: center; min-height: 44px; }
  .js #site-navigation [data-contact] { height: auto !important; white-space: normal !important; text-align: center; }
}