/* GENERATED by bin/design-sync.py from web-design@400f411 styles.css: do not edit. Minified; the readable source is
   web-design/styles.css. Font URLs point to the parent's files (design-map.json "fonts"), @font-face rules get
   font-display: swap. Theme changes: assets/css/home-adapter.css; header and footer: assets/css/chrome.css. */
@font-face{font-display:swap;font-family:'Ableneo';src:url('../../ableneo/dist/fonts/Ableneo-Regular.woff2') format('woff2');font-weight:400}@font-face{font-display:swap;font-family:'Ableneo';src:url('assets/fonts/Ableneo-Light.otf') format('opentype');font-weight:300}@font-face{font-display:swap;font-family:'Ableneo';src:url('assets/fonts/Ableneo-SemiBold.otf') format('opentype');font-weight:600}@font-face{font-family:'Poppins';src:url('../../ableneo/dist/fonts/Poppins-300-latin-ext.woff2') format('woff2');font-weight:300;font-display:swap;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:'Poppins';src:url('../../ableneo/dist/fonts/Poppins-300-latin.woff2') format('woff2');font-weight:300;font-display:swap;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';src:url('../../ableneo/dist/fonts/Poppins-400-latin-ext.woff2') format('woff2');font-weight:400;font-display:swap;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:'Poppins';src:url('../../ableneo/dist/fonts/Poppins-400-latin.woff2') format('woff2');font-weight:400;font-display:swap;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';src:url('../../ableneo/dist/fonts/Poppins-500-latin-ext.woff2') format('woff2');font-weight:500;font-display:swap;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:'Poppins';src:url('../../ableneo/dist/fonts/Poppins-500-latin.woff2') format('woff2');font-weight:500;font-display:swap;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';src:url('../../ableneo/dist/fonts/Poppins-600-latin-ext.woff2') format('woff2');font-weight:600;font-display:swap;unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:'Poppins';src:url('../../ableneo/dist/fonts/Poppins-600-latin.woff2') format('woff2');font-weight:600;font-display:swap;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}:root{--charcoal:#1D2024;--panel:#404246;--white:#FFFFFF;--lime:#CDDE00;--lime-hover:#D2E027;--slate-1:#485668;--slate-2:#49576A;--slate-3:#76869B;--violet-1:#B7AEF2;--violet-2:#A095EA;--violet-3:#968AE7;--blue:#C3D4FD;--light:#E8E8E8;--cap-violet:#C6C0EF;--cap-blue:#C3D3FA;--cap-lime:#D2DA72;--cap-gray:#A3ADB9;--gray-dim:#8E8F91;--slate-bar:#8391A2;--blue-2:#9BB8FC;--input-bg:#F5F5F5;--input-placeholder:#969696;--font-head:'Ableneo','Poppins',sans-serif;--font-body:'Poppins',sans-serif;--container:1328px}*{margin:0;padding:0;box-sizing:border-box}body{background:var(--charcoal);color:var(--white);font-family:var(--font-body);min-width:1440px}img{max-width:100%;display:block}a{color:inherit}.container{max-width:var(--container);margin:0 auto}.label{font:600 12px/12px 'Poppins',sans-serif;letter-spacing:0.72px;text-transform:uppercase}.accent{color:var(--lime)}h2{font:400 32px/48px var(--font-head);letter-spacing:-0.32px}.btn-primary,.btn-secondary{display:inline-flex;align-items:center;justify-content:center;font:600 14px/20px 'Poppins',sans-serif;letter-spacing:0.42px;text-transform:uppercase;text-decoration:none;white-space:nowrap;padding:14px 20px}.btn-primary{background:var(--lime);color:var(--charcoal)}.btn-secondary{background:transparent;color:var(--white);border:1px solid var(--white)}.btn-sm{font-size:12px;line-height:12px;letter-spacing:0.36px;padding:14px 16px}.btn-dark,.btn-dark-lg{display:inline-flex;align-items:center;justify-content:space-between;background:var(--charcoal);color:var(--white);border:0;cursor:pointer;font:600 14px/20px 'Poppins',sans-serif;letter-spacing:0.42px;text-transform:uppercase;gap:20px}.btn-dark-lg{font:600 16px/24px 'Poppins',sans-serif;letter-spacing:0.48px}.hero-band{/* ponytail:reference render (crop.py 0 1277) is flat charcoal,no visible photo — hero-bg.png from Task 2 isn't used here; ground-truth crop wins per brief.
     No shared-height contract needed either: #results (Task 4) owns its own spacing. */
  position: relative;
  background: var(--charcoal);
}

.nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 40px 0;
}
.nav-links { display: flex; gap: 48px; }
.nav-links a, .nav-contact {
  font: 400 14px/20px 'Poppins', sans-serif;
  text-decoration: none;
  color: rgba(255,255,255,0.7); /* measured off ref crop: peak sampled brightness ~176/255, not pure white */
}
.nav-cta { display: flex; align-items: center; gap: 48px; }

#hero { position: relative; margin-top: 70px; min-height: 441px; }

#hero h1 {
  max-width: 788px;
  font: 400 72px/80px var(--font-head);
  letter-spacing: -1.44px;
}

.hero-side {
  position: absolute; top: 33px; right: 0; width: 389px;
  display: flex; flex-direction: column; gap: 24px;
}
.hero-desc {
  font: 300 20px/28px 'Poppins', sans-serif;
  letter-spacing: -0.2px;
}

.hero-cta { margin-top: 40px; display: flex; gap: 24px; } /* in flow: headline is 3 lines since review 28. 8. */

.hero-arrow {
  position: absolute; top: 305px; left: 941px; width: 136px; height: 136px;
  display: flex; align-items: center; justify-content: center;
}
.hero-arrow-shape {
  width: 100%; height: 100%;
  background: var(--charcoal);
  border: 2px solid var(--lime);
  border-radius: 32px;
  transform: rotate(45deg);
  display: flex; align-items: center; justify-content: center;
}
.hero-arrow-shape svg { transform: rotate(-45deg); }

/* ---- Results band ---- */
#results {
  padding-top: 34px;
  padding-bottom: 0;
  /* ponytail: 1x art cropped from reference render — re-crop @2x from ref-full-2x.png when Figma rate limit clears (see Task 12) */
  background-image: url('assets/img/results-top-lines.png');
  background-repeat: no-repeat;
  background-position: top right;
}
#results h2 { margin-bottom: 24px; }

.results-grid { display: flex; gap: 8px; }

.result-card {
  position: relative; overflow: hidden; cursor: pointer;
  height: 430px;
  box-sizing: border-box;
  border: 1px solid var(--panel); /* extract stroke is #FFFFFF@15% on charcoal; blends to ~#404244, matches --panel #404246 */
  flex: 0 0 302px;
}

.result-card .label { display: inline-flex; align-items: center; gap: 12px; position: absolute; top: 33px; left: 32px; }

.dot { width: 12px; height: 12px; border-radius: 50%; }
.dot.lime { background: var(--lime); }
.dot.blue { background: var(--blue); }
.dot.violet { background: var(--violet-1); }
.dot.violet-2 { background: var(--violet-2); }

.stat-num {
  position: absolute; top: 246px; left: 32px;
  font: 400 80px/80px var(--font-head);
}
.stat-num--lime { color: var(--lime); }
.stat-num--blue { color: var(--blue); }
.stat-num--violet { color: var(--violet-1); }

.stat-label {
  position: absolute; top: 342px; left: 32px;
  font: 400 24px/32px var(--font-head);
  letter-spacing: -0.24px;
}

.result-detail {
  position: absolute; top: 249px; left: 254px; width: 425px;
  padding-top: 5px; padding-left: 33px;
  border-left: 1px solid var(--panel); /* same #FFFFFF@15%-on-charcoal ≈ --panel justification as .result-card */
}
.result-detail h3 {
  font: 600 24px/32px 'Poppins', sans-serif;
  letter-spacing: -0.24px;
}
.result-detail p {
  margin-top: 16px;
  font: 300 16px/24px 'Poppins', sans-serif;
  letter-spacing: -0.32px;
}

/* ---- Capabilities (light section) ---- */
.section-light { background: var(--white); color: var(--charcoal); }

#portfolio { margin-top: 64px; } /* extract 231:210 y=1373, logo bar ends 1302 -> 71px gap, minus ~7px
  upstream text-metrics drift already present in #results (Chrome vs Figma line-height rounding, out of scope) */
.cap-container { position: relative; height: 871px; }

.cap-headline {
  position: absolute; top: 80px; left: 0; width: 684px;
  font: 400 48px/56px var(--font-head);
  letter-spacing: -0.96px;
}

.cap-side { position: absolute; top: 119px; left: 938px; width: 390px; }
.cap-side .label { margin-bottom: 24px; }
.cap-side-desc {
  font: 400 20px/28px 'Poppins', sans-serif;
}

.cap-grid { position: absolute; top: 413px; left: 0; display: flex; }

.cap-card { position: relative; width: 347px; }
.cap-card--divider::before {
  content: ''; position: absolute; top: 0; left: -34px;
  width: 1px; height: 312px; background: var(--light);
}

.cap-dot { position: absolute; top: -12px; left: -12px; width: 24px; height: 24px; border-radius: 50%; }
.cap-dot--violet { background: var(--cap-violet); }
.cap-dot--blue { background: var(--cap-blue); }
.cap-dot--lime { background: var(--cap-lime); }
.cap-dot--gray { background: var(--cap-gray); }

.cap-chip {
  width: 64px; height: 64px; background: var(--charcoal);
  display: flex; align-items: center; justify-content: center;
}

.cap-title {
  margin-top: 38px;
  font: 400 24px/32px var(--font-head);
  letter-spacing: -0.24px;
}
.cap-desc-text {
  margin-top: 16px; width: 274px;
  font: 400 14px/22px 'Poppins', sans-serif;
}

.cap-tags-row { display: flex; gap: 8px; margin-top: 24px; }
.cap-tags-row--2 { margin-top: 8px; }

.tag {
  display: inline-flex; align-items: center;
  border: 1px solid var(--light); border-radius: 2px;
  padding: 4px 8px;
  font: 500 14px/24px 'Poppins', sans-serif;
  color: var(--slate-1);
  white-space: nowrap;
}

/* ---- Process (dark section) ---- */
/* ponytail: source bg (231:276) is a transparent->charcoal gradient fade;
   body is already charcoal so a solid fill reads identically. */
#process { background: var(--charcoal); margin-top: 159px; } /* extract 231:276 y=2403, capabilities ends 2244 -> 159px gap */

.line-grid {
  background: repeating-linear-gradient(90deg, var(--panel) 0 1px, transparent 1px 9px);
}

.process-container { position: relative; height: 537px; }

/* extract 231:143: pattern is 774 tall starting at page y=2161, i.e. 242px above process-container top (2403) —
   bleeds up over the capabilities/gap band, not just the process box itself */
.process-bg-pattern { position: absolute; top: -242px; left: 964px; width: 451px; height: 774px; }

/* decorative gap-band bars (231:270-275), bleeding up from #process into the charcoal gap above it.
   These are 0-height vectors with strokeWeight 24 in Figma — the stroke renders CENTERED on the path,
   so top = extract_y - 12 (verified against ref pixels, not the raw-y convention used by process-bar-extra). */
.gap-band-bar { position: absolute; height: 24px; }
.gap-band-bar--1 { top: -207px; left: 662px; width: 344px; background: var(--slate-bar); }
.gap-band-bar--2 { top: -183px; left: -44px; width: 356px; background: linear-gradient(to right, var(--violet-3), var(--violet-1)); }
.gap-band-bar--3 { top: -183px; left: 662px; width: 303px; background: var(--charcoal); }
.gap-band-bar--4 { top: -159px; left: 264px; width: 399px; background: var(--white); }
.gap-band-bar--5 { top: -159px; left: 1006px; width: 378px; background: var(--slate-bar); }
.gap-band-bar--6 { top: -135px; left: 341px; width: 351px; background: var(--slate-bar); }

.process-label { position: absolute; top: 17px; left: 0; }

.process-cta-btn { position: absolute; top: 17px; left: 1041px; }

.process-headline {
  position: absolute; top: 53px; left: 0; width: 799px;
  font: 400 48px/56px var(--font-head);
  letter-spacing: -0.96px;
}

.process-cta-box {
  position: absolute; top: 65px; left: 1041px; width: 185px; height: 62px;
  display: flex; align-items: center; gap: 16px; padding-left: 21px;
  font: 400 12px/16px 'Poppins', sans-serif;
}
.process-cta-divider { width: 1px; height: 27px; background: var(--violet-2); }

.process-card {
  position: absolute; width: 302px; height: 310px;
  background: var(--charcoal); border: 1px solid var(--white);
}
.process-card--01 { left: 2px; top: 189px; }
.process-card--02 { left: 303px; top: 260px; }
.process-card--03 { left: 604px; top: 166px; }
.process-card--04 { left: 905px; top: 236px; }

.process-dot { position: absolute; top: 33px; left: 32px; width: 12px; height: 12px; border-radius: 50%; }
.process-num {
  position: absolute; top: 33px; left: 56px;
  font: 600 12px/12px 'Poppins', sans-serif; letter-spacing: 0.72px; text-transform: uppercase;
}
.process-title {
  position: absolute; top: 60px; left: 32px; width: 250px;
  font: 400 24px/32px var(--font-head); letter-spacing: -0.24px;
}
.process-desc {
  position: absolute; top: 108px; left: 32px; width: 238px;
  font: 400 14px/22px 'Poppins', sans-serif;
}

.process-grid { position: absolute; top: 214px; left: 32px; width: 262px; height: 96px; }
.process-bar { position: absolute; left: 0; width: 262px; height: 8px; }
.process-bar--01 { top: 60px; background: var(--white); }
.process-bar--02 { top: 37px; background: var(--lime); }
.process-bar--03 { top: 59px; background: var(--blue); }
.process-bar--04 { top: 37px; background: var(--violet-2); }

/* decorative continuation chips of the 03/04 bars, bleeding into the right margin (231:439/443) */
.process-bar-extra { position: absolute; left: 1207px; height: 8px; background: var(--blue); }
/* top = extract_y - 12: these are 0-height stroked vectors, centered on the path (verified against ref pixels) */
.process-bar-extra--blue { top: 427px; width: 87px; }
.process-bar-extra--violet { top: 475px; width: 269px; background: var(--violet-2); }

/* ---- Logo bar ---- */

/* ---- Market contrast (dark section) ---- */
#contrast { background: var(--charcoal); padding-top: 120px; overflow: hidden; } /* follows #proof since the 2026-10-05 swap; clips its bg pattern (used to hide under #proof) */
/* container box is 702 not the pattern's 787:contrast-bg-pattern (231:449) bleeds 85px past the section and #proof's opaque white bg (which starts right at 3803, no gap) paints over the overflow, per ref */
.contrast-container { position: relative; height: 702px; }

.contrast-label { position: absolute; top: 0; left: 0; width: 100%; text-align: center; }

.contrast-headline { position: absolute; top: 36px; left: 0; width: 100%; text-align: center; }
.contrast-line {
  display: block;
  font: 400 48px/56px var(--font-head); letter-spacing: -0.96px;
  color: var(--white);
}
.contrast-line--dim { color: var(--slate-3); }

.contrast-bg-pattern {
  position: absolute; top: 219px; left: 438px; width: 451px; height: 568px;
  background-image: repeating-linear-gradient(to bottom, var(--panel) 0 1px, transparent 1px 9px);
}

.contrast-arrow { position: absolute; top: 196px; left: 596px; width: 136px; height: 136px; }

.chip {
  position: absolute; height: 38px; padding: 3px 12px; box-sizing: border-box;
  border: 1px solid var(--panel);
  font: 400 20px/32px var(--font-head); letter-spacing: -0.2px; white-space: nowrap;
}
.chip--dim { background: var(--charcoal); color: var(--gray-dim); }
.chip--white { background: var(--white); color: var(--charcoal); }

.chip--1a { top: 335px; left: 257px; width: 235px; }
.chip--1b { top: 335px; left: 813px; width: 306px; }
.chip--2a { top: 398px; left: 363px; width: 163px; }
.chip--2b { top: 398px; left: 759px; width: 158px; }
.chip--3a { top: 461px; left: 209px; width: 259px; }
.chip--3b { top: 461px; left: 838px; width: 242px; }
.chip--4a { top: 524px; left: 408px; width: 173px; }
.chip--4b { top: 524px; left: 785px; width: 169px; }

/* ---- Proof (light section) ---- */
#proof { margin-top: 161px; background: var(--white); color: var(--charcoal); position: relative; overflow: hidden; }
.proof-container { position: relative; height: 774px; }

.proof-card { position: absolute; width: 302px; height: 430px; overflow: hidden; }
.proof-card-img { width: 100%; height: 100%; object-fit: cover; }
.proof-card--tmobile { left: -12px; top: 91px; }
.proof-card--eos { left: 330px; top: 200px; }

.proof-chip {
  position: absolute; top: 32px; left: 0; height: 38px; box-sizing: border-box;
  display: flex; align-items: center; padding: 7px 12px;
  font: 600 16px/24px 'Poppins', sans-serif; letter-spacing: -0.16px;
  color: var(--charcoal);
}
.proof-chip--violet { background: var(--violet-1); width: 130px; }
.proof-chip--lime { background: var(--lime); width: 166px; }

.proof-card-label { position: absolute; top: 242px; left: 32px; color: var(--white); }

.proof-label { position: absolute; top: 88px; left: 755px; }
.proof-headline {
  position: absolute; top: 124px; left: 755px; width: 573px;
  font: 400 48px/56px var(--font-head); letter-spacing: -0.96px;
}
.proof-swatch { display: inline-block; width: 56px; height: 24px; background: var(--lime); vertical-align: -4px; margin-right: 16px; }

.proof-stat { position: absolute; }
.proof-stat--1 { top: 350px; left: 755px; }
.proof-stat--2 { top: 350px; left: 1078px; }
.proof-stat--3 { top: 524px; left: 755px; }
.proof-stat--4 { top: 524px; left: 1078px; }
.stat-num--sm { position: static; font-size: 64px; line-height: 72px; }
.proof-stat-label { font: 400 20px/32px var(--font-head); letter-spacing: -0.2px; color: var(--gray-dim); }

.proof-bleed { position: absolute; height: 24px; }
.proof-bleed--blue { top: 610px; left: -12px; width: 87px; background: #9BB7FC; } /* top = extract_y - 12, centered stroke; color sampled from ref crop pixel, near --blue-2 (#9BB8FC) but distinct */
.proof-bleed--violet { top: 682px; left: 12px; width: 269px; background: var(--violet-3); }

/* ---- CTA + Playbook ---- */
#cta { position: relative; overflow: hidden; margin-top: 40px; } /* extract 231:729 y=4617, proof ends 4577 -> 40px gap */
.cta-container { position: relative; height: 598px; }
.cta-bg { position: absolute; left: 0; top: 70px; width: 100%; height: 528px; background: var(--lime); }

.cta-bar { position: absolute; height: 24px; }
.cta-bar--blue { background: linear-gradient(180deg, var(--blue-2), var(--blue)); }
.cta-bar--violet { background: var(--violet-3); }

.cta-headline {
  position: absolute; left: 80px; top: 150px; width: 684px;
  font: 400 48px/56px var(--font-head); letter-spacing: -0.96px; color: var(--charcoal);
}
.cta-sub {
  position: absolute; left: 80px; top: 310px; width: 626px;
  font: 300 20px/28px 'Poppins', sans-serif; letter-spacing: -0.2px; color: var(--charcoal);
}
.cta-btn { position: absolute; left: 80px; top: 398px; width: 332px; height: 64px; padding: 0 20px; }

.cta-shape {
  position: absolute; left: 863px; top: 414px; width: 136px; height: 136px;
  border: 2px solid var(--white); border-radius: 32px; transform: rotate(45deg);
}

.cta-barcode {
  position: absolute; left: 33px; top: 543px; width: 1288px; height: 55px;
  background: repeating-linear-gradient(to right, var(--white) 0 1px, transparent 1px 9px);
}

.cta-card {
  position: absolute; left: 897px; top: 0; width: 303px; height: 378px;
  background: var(--white); color: var(--charcoal);
}
.cta-card-label { position: absolute; left: 32px; top: 33px; display: inline-flex; align-items: center; gap: 8px; }
.cta-card-title {
  position: absolute; left: 32px; top: 60px; width: 251px;
  font: 400 24px/32px var(--font-head); letter-spacing: -0.24px;
}
.cta-card-desc {
  position: absolute; left: 32px; top: 140px; width: 236px;
  font: 400 14px/22px 'Poppins', sans-serif; color: var(--charcoal);
}
.cta-card-input {
  position: absolute; left: 32px; top: 238px; width: 238px; height: 48px;
  background: var(--input-bg); border: 0; padding: 0 19px;
  font: 400 14px/22px 'Poppins', sans-serif; color: var(--input-placeholder);
}
.cta-card-input::placeholder { color: var(--input-placeholder); }
.cta-card-btn { position: absolute; left: 32px; top: 298px; width: 239px; height: 48px; padding: 0 20px; }

.cta-logo-bar { margin-top: 40px; }

/* ---- Footer ---- */
#footer { margin-top: 44px; } /* extract 231:918 y=5393, cta logo strip ends 5349 -> 44px gap */
.footer-container { position: relative; height: 607px; }
.footer-divider-h { position: absolute; top: 0; left: 0; width: 100%; height: 1px; background: #282E36; } /* extract fill on 231:918 is #282E36, not var(--panel) #404246 — sampled value, not a guess */

.footer-logo { position: absolute; left: 0; top: 70px; width: 160px; height: 40px; }
.footer-divider-v { position: absolute; left: 208px; top: 74px; width: 1px; height: 32px; background: var(--slate-2); }
.footer-social { position: absolute; left: 257px; top: 80px; display: flex; gap: 24px; }
.footer-social img { width: 20px; height: 20px; display: block; }

.footer-col { position: absolute; top: 89px; display: flex; flex-direction: column; }
.footer-col--1 { left: 698px; }
.footer-col--2 { left: 989px; }
.footer-col--3 { left: 1226px; }
.footer-col-title {
  font: 600 12px/12px 'Poppins', sans-serif; letter-spacing: 0.72px; text-transform: uppercase;
  color: var(--slate-3); margin-bottom: 32px;
}
.footer-col a { display: block; font: 400 14px/20px 'Poppins', sans-serif; text-decoration: none; margin-bottom: 24px; }
.footer-col a:last-child { margin-bottom: 0; }

.footer-newsletter .label { position: absolute; left: 0; top: 187px; display: inline-flex; align-items: center; gap: 12px; }
.footer-newsletter-copy {
  position: absolute; left: 0; top: 220px; width: 475px;
  font: 400 24px/32px var(--font-head); letter-spacing: -0.24px;
}
.footer-input {
  position: absolute; top: 321px; left: 0; width: 350px; height: 48px;
  background: var(--input-bg); border: 0; padding: 0 19px;
  font: 400 14px/22px 'Poppins', sans-serif; color: var(--input-placeholder);
}
.footer-input::placeholder { color: var(--input-placeholder); }
.footer-subscribe-btn { position: absolute; top: 321px; left: 220px; width: 130px; height: 48px; padding: 0; border: 0; cursor: pointer; }

.footer-copyright { position: absolute; left: 0; top: 564px; font: 400 12px/20px 'Poppins', sans-serif; }

.footer-bar { position: absolute; height: 24px; }
/* top = extract_y - 12, centered stroke (verified against ref pixels) */
.footer-bar--1 { top: 512px; left: -2px; width: 1386px; background: linear-gradient(to right, var(--violet-1), var(--violet-3)); }
.footer-bar--2 { top: 536px; left: 310px; width: 1074px; background: linear-gradient(to right, var(--blue-2), var(--blue)); }
.footer-bar--3 { top: 560px; left: 658px; width: 726px; background: linear-gradient(to right, var(--lime), var(--cap-lime)); }
.footer-bar--4 { top: 584px; left: 1004px; width: 380px; background: var(--white); }

/* ---- Interactions ---- */
.js .reveal { opacity:0; transform:translateY(16px); transition:opacity .5s ease, transform .5s ease; }
.js .reveal.in { opacity:1; transform:none; }
@media (prefers-reduced-motion: reduce) { .js .reveal { opacity:1; transform:none; transition:none; } }

a, .btn-primary, .btn-secondary { transition: opacity .2s ease, background .2s ease; }
.btn-primary:hover { background: var(--lime-hover); }
.btn-secondary:hover { border-color:var(--lime); }
.nav-links a:hover, .nav-contact:hover { color: var(--white); }

@keyframes arrow-pulse { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(6px); } }
.hero-arrow, .contrast-arrow { animation: arrow-pulse 2s ease-in-out infinite; }
@media (prefers-reduced-motion: reduce) { .hero-arrow, .contrast-arrow { animation: none; } }

.nav-toggle {
  display: none;
  width: 32px; height: 32px; padding: 0; border: 0; background: transparent; cursor: pointer;
  flex-direction: column; justify-content: center; align-items: center; gap: 5px;
}
.nav-toggle span { display: block; width: 22px; height: 2px; background: var(--white); }

/* ==================== Mobile (<=768px, derived — no Figma mobile design; see task-14-brief) ====================
   Desktop is pixel-locked above this breakpoint; every rule here is scoped inside the media query
   so it cannot touch >=1440 rendering. Sections switch from the desktop's absolute-position/fixed-height layout to normal document flow (position:static lets top/left fall away;width overrides are needed only where the desktop rule also set a fixed pixel width). Purely decorative bleed bars/patterns are hidden rather than repositioned — they carry no content. */ @media (max-width:768px){body{min-width:0}.container{padding:0 20px}h2{font:400 24px/32px var(--font-head);letter-spacing:-0.24px}.nav{padding:20px 0}.nav-links,.nav-contact,.nav-cta>a.btn-primary.btn-sm{display:none}.nav-toggle{display:flex;width:44px;height:44px}body.menu-open{overflow:hidden}body.menu-open .nav-links{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:32px;position:fixed;inset:0;z-index:100;background:var(--charcoal)}body.menu-open .nav-links a{font:400 28px/36px var(--font-head);letter-spacing:-0.28px;color:var(--white)}#hero{margin-top:24px;min-height:0}#hero h1{max-width:100%;font:400 44px/52px var(--font-head);letter-spacing:-0.88px}.hero-side{position:static;width:100%;margin-top:24px;gap:16px}.hero-cta{position:static;width:100%;margin-top:24px;flex-wrap:wrap}.hero-arrow{display:none}#results{padding-top:24px;background-image:none}.results-grid{flex-direction:column;gap:12px}.result-card{flex-basis:auto;height:auto;padding:24px 20px}.result-card .label{position:static;margin-bottom:16px}.result-card .stat-num{position:static;font-size:44px;line-height:44px;margin-bottom:8px}.result-card .stat-label{position:static}.result-detail{position:static;width:100%;margin-top:16px;padding:16px 0 0;border-left:0;border-top:1px solid var(--panel)}#portfolio{margin-top:40px}.cap-container{height:auto;padding-top:40px;padding-bottom:40px}.cap-headline{position:static;width:100%;font:400 28px/36px var(--font-head);letter-spacing:-0.28px}.cap-side{position:static;width:100%;margin-top:24px}.cap-grid{position:static;flex-direction:column;gap:32px;margin-top:32px}.cap-card{width:100%}.cap-card--divider::before{display:none}.cap-card--divider{border-top:1px solid var(--light);padding-top:32px}.cap-desc-text{width:100%}#process{margin-top:64px}.process-container{height:auto;padding-top:40px;padding-bottom:56px;display:flex;flex-direction:column}.process-bg-pattern,.gap-band-bar,.process-bar-extra{display:none}.process-label{position:static;order:1}.process-headline{position:static;width:100%;order:2;margin-top:16px;font:400 28px/36px var(--font-head);letter-spacing:-0.28px}.process-cta-box{position:static;width:100%;order:3;margin-top:16px;padding-left:0}.process-cta-btn{position:static;order:4;align-self:flex-start;margin-top:16px}.process-card{position:static;order:5;width:100%;height:auto;margin-top:24px;padding-bottom:24px}.process-dot,.process-num{position:static;display:inline-block;vertical-align:middle}.process-num{margin-left:8px}.process-title{position:static;width:100%;margin-top:16px}.process-desc{position:static;width:100%;margin-top:8px}.process-grid{position:static;width:100%;margin-top:16px}.process-bar{position:static;display:block;width:100%}#contrast{padding-top:64px}#proof{margin-top:64px}.contrast-container{height:auto;padding-top:40px;padding-bottom:40px}.contrast-label{position:static}.contrast-headline{position:static;margin-top:16px}.contrast-line{font:400 28px/36px var(--font-head);letter-spacing:-0.28px}.contrast-bg-pattern,.contrast-arrow{display:none}.contrast-container .chip{position:static;width:100%;min-height:44px;margin-bottom:8px;white-space:normal;text-align:center;display:flex;align-items:center;justify-content:center}.proof-container{height:auto;padding-top:40px;padding-bottom:40px}.proof-container::after{content:'';display:table;clear:both}.proof-card{position:relative;top:0;left:0;width:100%;height:220px;margin-bottom:16px}.proof-card-label{top:auto;bottom:16px;left:20px}.proof-label,.proof-headline{position:static;margin-top:24px}.proof-headline{width:100%;font:400 28px/36px var(--font-head);letter-spacing:-0.28px}.proof-stat{position:static;margin-top:24px}.proof-stat--1,.proof-stat--3{float:left;clear:left;width:48%}.proof-stat--2,.proof-stat--4{float:right;width:48%}.stat-num--sm{font-size:36px;line-height:40px}.proof-bleed{display:none}#cta{margin-top:32px}.cta-container{height:auto;padding-top:40px;padding-bottom:40px}.cta-bg{inset:0;height:auto;width:auto;z-index:-1}.cta-bar,.cta-shape,.cta-barcode{display:none}.cta-headline{position:static;width:100%;font:400 28px/36px var(--font-head);letter-spacing:-0.28px}.cta-sub{position:static;width:100%;margin-top:16px}.cta-btn{position:static;width:100%;margin-top:24px}.cta-card{position:static;width:100%;height:auto;margin-top:32px;padding:24px 20px}.cta-card-label,.cta-card-title,.cta-card-desc,.cta-card-input,.cta-card-btn{position:static;width:100%;margin-top:12px}.cta-card-label{margin-top:0}.cta-card-input,.cta-card-btn{margin-top:16px}.cta-logo-bar{margin-top:32px}#footer{margin-top:56px}.footer-container{height:auto;padding-top:40px;padding-bottom:40px}.footer-divider-h{position:static;margin-bottom:32px}.footer-logo{position:static}.footer-divider-v{display:none}.footer-social{position:static;margin-top:16px}.footer-social a{padding:12px;margin:-12px}.footer-col{position:static;margin-top:32px}.footer-newsletter{margin-top:32px}.footer-newsletter .label{position:static}.footer-newsletter-copy,.footer-input,.footer-subscribe-btn{position:static;width:100%}.footer-newsletter-copy{margin-top:12px}.footer-input{margin-top:20px}.footer-subscribe-btn{margin-top:12px}.footer-copyright{position:static;margin-top:32px}.footer-bar{display:none}}/* hero diamond:circle rolls in,then locks into the diamond (port of the live site's primary.json Lottie).
   roll distance = PI * r (68px) for a half turn; easings = motion tokens enter + snap. Replays on hover. */
@keyframes circle-to-diamond {
  0%   { border-radius: 50%; transform: translateX(-214px) rotate(-180deg); opacity: 0; animation-timing-function: cubic-bezier(.215,.61,.355,1); }
  10%  { opacity: 1; }
  55%  { border-radius: 50%; transform: translateX(0) rotate(0deg); animation-timing-function: cubic-bezier(.34,1.56,.64,1); }
  100% { border-radius: 32px; transform: rotate(45deg); }
}
@keyframes circle-to-diamond-replay { from { border-radius: 50%; transform: rotate(0deg); } to { border-radius: 32px; transform: rotate(45deg); } }
#hero .hero-arrow-shape { animation: circle-to-diamond 1.6s .3s both; }
#hero .hero-arrow:hover .hero-arrow-shape { animation: circle-to-diamond-replay .45s cubic-bezier(.34,1.56,.64,1) both; }
@media (prefers-reduced-motion: reduce) { #hero .hero-arrow-shape, #hero .hero-arrow:hover .hero-arrow-shape { animation: none; } }

/* regulated-grade proof row (strategy 3.1 / 2.2) */
.trust-row { list-style: none; margin: 24px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 12px 40px; }
.trust-row li { display: flex; align-items: center; gap: 10px; font: 400 16px/24px 'Poppins', sans-serif; color: var(--gray-dim); }
.trust-row li::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--lime); }
.chip--3a, .chip--3b { width: auto; }

/* ---- Results: expandable cards, one open at a time (script.js) ---- */
.results-grid .result-card { transition: flex-basis .45s cubic-bezier(.215,.61,.355,1), border-color .3s, opacity .5s ease, transform .5s ease; } /* beats .js .reveal */
.result-card.is-open { flex-basis: 708px; border-bottom-color: var(--accent); cursor: default; }
.result-card:not(.is-open):hover { border-color: var(--slate-2); }
.result-card:focus-visible { outline: 2px solid var(--lime); outline-offset: 2px; }
.result-art { position: absolute; top: 0; left: 0; width: 708px; height: 246px; pointer-events: none; opacity: 0; transition: opacity .3s; }
.result-detail { opacity: 0; visibility: hidden; transition: opacity .3s, visibility .3s; }
.is-open .result-art, .is-open .result-detail { opacity: 1; visibility: visible; transition-delay: .25s; }
.result-plus { position: absolute; top: 24px; right: 24px; width: 32px; height: 32px; box-sizing: border-box; border: 1px solid var(--panel); transition: opacity .3s, border-color .3s; }
.result-plus::before, .result-plus::after { content: ""; position: absolute; top: 50%; left: 50%; width: 12px; height: 1.5px; background: var(--white); transform: translate(-50%,-50%); }
.result-plus::after { transform: translate(-50%,-50%) rotate(90deg); }
.result-card:not(.is-open):hover .result-plus { border-color: var(--accent); }
.is-open .result-plus { opacity: 0; }

/* ---- Client logos: endless marquee, two identical sets, track slides -50% ---- */
.logo-marquee {
  overflow: hidden; margin-top: 48px;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
          mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent);
}
.cta-logo-bar .logo-marquee { margin-top: 0; }
.logo-track { display: flex; width: max-content; animation: logo-scroll 60s linear infinite; }
.logo-marquee:hover .logo-track { animation-play-state: paused; }
.logo-set { display: flex; gap: 72px; padding-right: 72px; }
.logo-group { display: flex; flex-direction: column; gap: 14px; }
.logo-group .label { margin: 0; font-size: 11px; line-height: 16px; color: var(--gray-dim); white-space: nowrap; }
.logo-row { display: flex; align-items: center; gap: 48px; height: 40px; }
.logo-row img { display: block; }
@keyframes logo-scroll { to { transform: translateX(-50%); } }

@media (prefers-reduced-motion: reduce) {
  .results-grid .result-card, .result-art, .result-detail { transition: none; }
  .logo-track { animation: none; }
  .logo-marquee { overflow-x: auto; }
}
@media (max-width: 768px) {
  .result-art { display: none; }
  .result-card:not(.is-open) .result-detail { display: none; }
  .result-plus { top: 20px; right: 20px; }
  .logo-marquee { margin-top: 32px; }
}
.result-card .stat-label { width: 200px; } /* stays clear of the detail column when the card opens */
@media (max-width: 768px) { .result-card .stat-label { width: auto; } .result-card.is-open { flex-basis: auto; } }

/* T-Mobile testimonial: HTML card with line art (replaces the photo), styled after the eOS card */
.proof-card--tmobile, .proof-card--eos { background: var(--charcoal); }
.proof-chip--lime { width: auto; padding: 0 16px; }
/* ZSD quote is longer than the ST stat line: start it higher so the name fits the 430px card */
.proof-card--eos .proof-card-label { top: 190px; }
.proof-card--eos .proof-quote { top: 222px; }
.proof-card-art { position: absolute; inset: 0; width: 100%; height: 100%; }
.proof-quote { position: absolute; left: 32px; right: 32px; top: 278px; margin: 0; color: var(--white); }
.proof-quote p { font: 300 16px/24px 'Poppins', sans-serif; letter-spacing: -0.32px; color: rgba(255,255,255,.85); }
.proof-quote footer { margin-top: 16px; font: 400 16px/24px 'Poppins', sans-serif; }
@media (max-width: 768px) {
  .proof-card--tmobile { height: 300px; }
  .proof-card--tmobile .proof-card-label { top: 150px; bottom: auto; }
  .proof-quote { top: 178px; left: 20px; right: 20px; }
}
@media (max-width: 768px) {
  .proof-card--eos { height: 340px; }
  .proof-card--eos .proof-card-label { top: 150px; bottom: auto; }
  .proof-card--eos .proof-quote { top: 178px; }
}

/* ---- Review 10/2026 (Filip, Jaro): full menu, 4 sectors, all cases, portfolio, static logo grid ---- */
.nav-links { gap: 36px; }
.result-card { flex: 1 1 0; min-width: 0; }
.results-grid .result-card.is-open { flex: 0 0 640px; }
.result-detail { width: auto; right: 32px; }
.result-card .stat-label { width: 170px; }
.stat-num--white { color: var(--white); }
.dot.white { background: var(--white); }

.case-list { display: grid; grid-template-columns: repeat(4, 1fr); gap: 32px; margin-top: 48px; }
.case-col .label { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; }
.case-col ul { list-style: none; margin: 0; padding: 0; }
.case-col li { padding: 14px 0; border-top: 1px solid var(--panel); font: 300 14px/22px 'Poppins', sans-serif; color: rgba(255,255,255,.75); }
.case-client { display: block; margin-bottom: 4px; font: 500 12px/16px 'Poppins', sans-serif; letter-spacing: .6px; text-transform: uppercase; color: var(--gray-dim); }
.case-num { font: 400 20px/22px var(--font-head); color: var(--white); }

.why { margin-top: 56px; }
.why .trust-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px 40px; margin-top: 20px; }
.why .trust-row li { align-items: flex-start; color: rgba(255,255,255,.85); }
.why .trust-row li::before { flex: 0 0 8px; margin-top: 8px; }

.logo-grid { display: flex; flex-wrap: wrap; gap: 32px 72px; margin-top: 64px; }
.logo-row { height: 52px; }

.cap-tags { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 24px; width: 300px; }
a.tag { text-decoration: none; }
a.tag:hover { border-color: var(--charcoal); color: var(--charcoal); }
.cap-card--divider::before { height: 380px; }
.proof-chip--violet { width: auto; padding: 0 16px; }

@media (max-width: 768px) {
  .result-card, .results-grid .result-card.is-open { flex: none; }
  .result-detail { right: auto; }
  .case-list, .why .trust-row { grid-template-columns: 1fr; gap: 24px; }
  .logo-grid { gap: 24px 40px; margin-top: 32px; }
  .logo-row { flex-wrap: wrap; gap: 24px 32px; height: auto; }
  .cap-tags { width: 100%; }
}
.results-grid .result-card.is-open { flex-basis: 680px; }
.result-detail h3 { font-size: 20px; line-height: 28px; }
.cap-container { height: 960px; }
.cap-tags { width: 320px; }
@media (max-width: 768px) { .cap-container { height: auto; } }
@media (max-width: 768px) { .results-grid .result-card.is-open { flex-basis: auto; } }
.result-card .stat-num--fit { font-size: 60px; } /* 99.3 % must fit the 208px closed card */

/* ---- Redesign 10/2026: case strip follows the open card, split "why" block, regulated logo wall ---- */
.case-strip { margin-top: 8px; }
.case-set { border: 1px solid var(--panel); border-top: 0; padding: 32px 32px 36px; }
.js .case-set:not(.is-active) { display: none; }
.case-set .label { color: var(--gray-dim); margin-bottom: 24px; }
.case-set ul { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); }
.case-set li { padding: 0 32px; border-left: 1px solid var(--panel); display: flex; flex-direction: column; }
.case-set li:first-child { padding-left: 0; border-left: 0; }
.case-set .case-num { font: 400 48px/56px var(--font-head); letter-spacing: -0.96px; color: var(--accent); margin-bottom: 12px; white-space: nowrap; }
.case-set .case-text { font: 300 16px/24px 'Poppins', sans-serif; letter-spacing: -0.32px; color: rgba(255,255,255,.85); }
.case-set .case-client { margin-top: auto; padding-top: 16px; font: 600 12px/16px 'Poppins', sans-serif; letter-spacing: .72px; text-transform: uppercase; color: var(--white); }

.why { margin-top: 136px; display: grid; grid-template-columns: 560px 1fr; gap: 0 96px; }
.why-head h2 { margin-top: 24px; font: 400 48px/56px var(--font-head); letter-spacing: -0.96px; }
.why-list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 0 48px; }
.why-list li { padding: 24px 0 28px; border-top: 1px solid var(--panel); font: 300 16px/24px 'Poppins', sans-serif; letter-spacing: -0.32px; color: var(--gray-dim); }
.why-list strong { display: flex; align-items: center; gap: 12px; margin-bottom: 8px; font: 400 20px/28px var(--font-head); letter-spacing: -0.2px; color: var(--white); }
.why-list strong::before { content: ""; flex: 0 0 8px; height: 8px; border-radius: 50%; background: var(--lime); }


@media (max-width: 768px) {
  .case-set { border: 0; padding: 32px 0 0; }
  .case-set ul { grid-template-columns: 1fr; gap: 24px; }
  .case-set li { padding: 0; border-left: 0; border-top: 1px solid var(--panel); padding-top: 16px; }
  .case-set .case-num { font-size: 36px; line-height: 40px; }
  .why { grid-template-columns: 1fr; margin-top: 64px; }
  .why-head h2 { font: 400 28px/36px var(--font-head); letter-spacing: -0.28px; margin-bottom: 24px; }
  .why-list { grid-template-columns: 1fr; }
}

/* autoplay progress: the open card's accent bar fills over one autoplay step (AUTOPLAY_MS in script.js) */ .result-card::after{content:"";position:absolute;left:0;bottom:-1px;height:2px;width:0;background:var(--accent)}.autoplay .result-card.is-open::after{animation:result-progress 3s linear}@keyframes result-progress{from{width:0}to{width:100%}}.autoplay .result-card.is-open{border-bottom-color:var(--panel)}#why{padding-top:136px}#why .why{margin-top:0}@media (max-width:768px){#why{padding-top:64px}.container>.why{margin-top:0}}/* ---- Freshness pass (Jaro:keep the "How we build" language):thick color bars,line grids,light break ---- */ .case-set li{padding-bottom:0}.case-set{padding-bottom:0}#why{padding-top:0;margin-top:136px}.why-container{position:relative;padding:136px 0 120px}.why-bar{position:absolute;height:24px}.why-bar--1{top:-36px;left:700px;width:344px;background:var(--slate-bar)}.why-bar--2{top:-12px;left:-56px;width:356px;background:linear-gradient(to right,var(--violet-3),var(--violet-1))}.why-bar--3{top:-12px;left:1044px;width:340px;background:var(--blue)}.why-bar--4{top:12px;left:300px;width:400px;background:var(--slate-bar)}#why .why-head h2{color:var(--charcoal)}#why .why-list li{border-top-color:var(--light);color:var(--slate-1)}#why .why-list strong{color:var(--charcoal)}#why .why-list strong::before{background:var(--charcoal)}#why + *,#footer{}@media (max-width:768px){.why-bar{display:none}#why{margin-top:64px}.why-container{padding:48px 20px}}#why .why-list li:nth-child(odd) strong::before{background:var(--violet-2)}#why .why-list li:nth-child(even) strong::before{background:var(--blue-2)}.case-set{padding-bottom:36px}#logos{margin-top:136px;padding:136px 0 120px}.clients h2{max-width:760px;margin:0;font:400 48px/56px var(--font-head);letter-spacing:-0.96px;color:var(--charcoal)}.clients-rows{margin-top:80px;border-bottom:1px solid var(--light)}.clients-row{display:grid;grid-template-columns:200px 1fr;align-items:center;padding:40px 0;border-top:1px solid var(--light)}.clients-sector{display:flex;align-items:center;gap:12px;margin:0;font:400 16px/24px 'Poppins',sans-serif;color:var(--slate-1)}.clients-sector .dot.white{background:var(--charcoal)}.clients-sector .dot.blue{background:var(--blue-2)}.clients-sector .dot.violet{background:var(--violet-2)}.clients-logos{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;align-items:center;gap:40px 80px}.clients-logos img{display:block;width:auto;opacity:.78;transition:opacity .3s}.clients-logos img:hover{opacity:1}#logos + #portfolio{margin-top:0}@media (prefers-reduced-motion:reduce){.clients-logos img{transition:none}}@media (max-width:768px){#logos{margin-top:64px;padding:64px 0}.clients h2{font:400 28px/36px var(--font-head);letter-spacing:-0.28px}.clients-rows{margin-top:40px}.clients-row{grid-template-columns:1fr;gap:20px;padding:28px 0}.clients-logos{gap:32px 48px;zoom:.62}}.nav-bar{position:sticky;top:0;z-index:50}.nav-bar::before{content:"";position:absolute;inset:0;z-index:-1;background:rgba(29,32,36,.86);backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%)}.nav{padding:18px 0}#hero{margin-top:114px}@media (prefers-reduced-transparency:reduce){.nav-bar::before{background:var(--charcoal);backdrop-filter:none;-webkit-backdrop-filter:none}}@media (prefers-contrast:more){.nav-bar::before{background:var(--charcoal);border-bottom:1px solid var(--white)}}.btn-primary,.btn-secondary,.btn-dark,.btn-dark-lg{transition:opacity .2s ease,background .2s ease,transform .1s ease-out}:is(.btn-primary,.btn-secondary,.btn-dark,.btn-dark-lg):active{transform:scale(.97)}.result-card:not(.is-open):active{transform:scale(.985);transition:transform .1s ease-out}.results-grid .result-card{transition:flex-basis .5s cubic-bezier(.32,.72,0,1),border-color .3s,opacity .5s ease,transform .1s ease-out}.is-open .result-art,.is-open .result-detail{transition-delay:.12s}.result-detail{transform:translateX(16px);transition:opacity .3s,visibility .3s,transform .5s cubic-bezier(.32,.72,0,1)}.is-open .result-detail{transform:none}@media (prefers-reduced-motion:reduce){:is(.btn-primary,.btn-secondary,.btn-dark,.btn-dark-lg,.result-card):active{transform:none}.result-detail{transform:none}}@media (max-width:768px){.nav{padding:12px 0}#hero{margin-top:40px}}html{scroll-padding-top:80px}@media (min-width:769px){.cta-card{height:342px}.cta-card-btn{top:262px}}.cta-card-btn{text-decoration:none}.footer-copyright a{margin-left:24px;color:inherit}.clients{position:relative}.clients-row{position:relative}.clients-logos{position:relative;z-index:1}.clients-art{position:absolute;top:0;bottom:0;right:0;width:460px;overflow:hidden;pointer-events:none;color:#C9D0D9;-webkit-mask-image:linear-gradient(to right,transparent,#000 35%);mask-image:linear-gradient(to right,transparent,#000 35%)}.clients-art-svg{position:absolute;top:-24px;right:-40px;width:708px;height:246px}.clients-bar{position:absolute;height:24px}.clients-bar--1{bottom:-72px;left:-56px;width:356px;background:var(--blue)}.clients-bar--2{bottom:-96px;left:300px;width:400px;background:var(--slate-bar)}.clients-bar--3{bottom:-72px;left:1006px;width:434px;background:linear-gradient(to right,var(--violet-3),var(--violet-1))}@media (max-width:768px){.clients-art,.clients-bar{display:none}}.clients-art-svg{top:-8px;right:-24px;width:560px;height:195px}@media (min-width:769px){.clients-rows{margin-top:120px}}#logos{padding-top:88px}@media (min-width:769px){.clients-rows{margin-top:64px}}/* ---- Proof points:Michal's statements as a quiet hairline list under the stats ---- */
.proof-container { height: 990px; }
.proof-points { position: absolute; top: 712px; left: 755px; right: 0; list-style: none; margin: 0; padding: 0; }
.proof-points li { display: flex; align-items: baseline; gap: 16px; padding: 14px 0; border-top: 1px solid var(--light); font: 400 16px/24px 'Poppins',sans-serif;color:var(--charcoal)}.proof-points li:last-child{border-bottom:1px solid var(--light)}.proof-points li::before{content:"";flex:0 0 8px;height:8px;border-radius:50%;background:var(--accent);transform:translateY(-1px)}@media (max-width:768px){.proof-points{position:static;clear:both;padding-top:32px}.proof-container{height:auto}}.clients-rows{position:relative}.clients-map{position:absolute;right:0;bottom:0;width:400px;pointer-events:none;color:#C9D0D9;-webkit-mask-image:linear-gradient(to right,transparent,#000 30%);mask-image:linear-gradient(to right,transparent,#000 30%)}.clients-map-svg{display:block;width:100%;height:auto}@media (max-width:768px){.clients-map{display:none}}@media (min-width:769px){.clients-row,.clients-rows{border-image:linear-gradient(to right,var(--light) 60%,transparent 76%) 1}}