/* High-fidelity details layered over the base implementation. */
body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 1000;
  pointer-events: none;
  opacity: .028;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.7'/%3E%3C/svg%3E");
}

body { background:#0c0f17; }
.container { width:min(1225px, calc(100% - 40px)); }
.section-title h2 { font-size:45px; line-height:56px; }

@media (min-width:1051px) {
  .site-header { height:100px; padding-left:40px; padding-right:40px; gap:25px; }
  .site-header.scrolled { height:100px; }
  .site-header .brand { min-width:142px; font-size:34px; }
  .desktop-nav { gap:36px; font-size:17px; font-weight:600; }
  .header-cta { width:159px; height:52px; justify-content:center; padding:0; font-size:19px; background:#e11d48; }
  .home-hero { min-height:842px; padding-left:20px; padding-right:20px; grid-template-columns:603px 1fr; }
  .hero-copy h1 { font-size:50px; line-height:55px; }
  .hero-copy h1 span { color:#fff; }
  .hero-copy p { max-width:560px; }
  .hero-copy .check-pill { width:295px; justify-content:center; border-color:transparent; background:rgba(255,255,255,.1); }
  .hero-copy .button { width:205px; height:53px; justify-content:center; padding:0; font-size:20px; background:#e11d48; }
}

.integrations {
  overflow: hidden;
  padding: 100px 0 34px;
  background: radial-gradient(ellipse at 50% 0, rgba(225,29,72,.15), transparent 18%), #0c0f17;
}

.integrations .section-title {
  margin-bottom: 22px;
}

.integrations .section-title .eyebrow {
  min-height: 38px;
  padding: 8px 30px;
  margin-bottom: 22px;
  background: rgba(255,255,255,.05);
  font-size: 18px;
  line-height: 21.6px;
}

.integrations .section-title h2 {
  font-size: 45px;
  line-height: 56px;
}

.integrations .lead {
  max-width: 552px;
  margin-bottom: 25px;
  font-size: 18px;
  line-height: 26px;
}

.integration-stage {
  position: relative;
  display: block;
  width: calc(100% - 40px);
  max-width: 1225px;
  height: 470px;
  margin-top: 15px;
  margin-bottom: 32px;
  isolation: isolate;
}

.integration-stage::before {
  content: "";
  position: absolute;
  width: 430px;
  height: 300px;
  left: 50%;
  top: 50%;
  translate: -50% -50%;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(104, 83, 255, .17), transparent 70%);
  filter: blur(16px);
}

.connector-map {
  position: absolute;
  inset: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
  overflow: visible;
}

.connector-map marker path {
  fill: rgba(180, 171, 215, .54);
}

.connector-lines path,
.connector-flow path {
  fill: none;
  vector-effect: non-scaling-stroke;
}

.connector-lines path {
  stroke: rgba(171, 160, 207, .38);
  stroke-width: 1.35;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-dasharray: 1500;
  stroke-dashoffset: 1500;
}

.integration-stage.visible .connector-lines path {
  animation: connector-draw 1.35s cubic-bezier(.22, .8, .3, 1) forwards;
}

.connector-lines path:nth-child(2),
.connector-lines path:nth-child(7) { animation-delay: .08s !important; }
.connector-lines path:nth-child(3),
.connector-lines path:nth-child(8) { animation-delay: .16s !important; }
.connector-lines path:nth-child(4),
.connector-lines path:nth-child(9) { animation-delay: .24s !important; }
.connector-lines path:nth-child(5),
.connector-lines path:nth-child(10) { animation-delay: .32s !important; }

.connector-flow path {
  stroke: rgba(139, 118, 255, .8);
  stroke-width: 1.4;
  stroke-dasharray: 2 88;
  stroke-dashoffset: 90;
  opacity: 0;
}

.integration-stage.visible .connector-flow path {
  opacity: .85;
  animation: signal-travel 3.6s linear infinite;
  animation-delay: 1.1s;
}

.brand-column {
  position: absolute;
  z-index: 3;
  top: 8px;
  bottom: 8px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.brand-column-left { left: 0; }
.brand-column-right { right: 0; }

.integration-brand {
  position: relative;
  width: 76px;
  height: 76px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(161, 146, 217, .48);
  border-radius: 17px;
  background:
    linear-gradient(145deg, rgba(39, 31, 78, .95), rgba(20, 14, 51, .98));
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .04),
    inset 0 -18px 32px rgba(67, 43, 149, .09),
    0 14px 35px rgba(2, 0, 18, .35);
  opacity: 0;
  transform: translateX(-20px) scale(.9);
  transition: border-color .3s ease, box-shadow .3s ease, transform .65s ease, opacity .65s ease;
}

.brand-column-right .integration-brand { transform: translateX(20px) scale(.9); }
.integration-stage.visible .integration-brand { opacity: 1; transform: none; }
.integration-stage.visible .integration-brand:nth-child(2) { transition-delay: .08s; }
.integration-stage.visible .integration-brand:nth-child(3) { transition-delay: .16s; }
.integration-stage.visible .integration-brand:nth-child(4) { transition-delay: .24s; }
.integration-stage.visible .integration-brand:nth-child(5) { transition-delay: .32s; }

.integration-brand:hover {
  border-color: rgba(141, 119, 255, .9);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 0 35px rgba(103, 81, 255, .28);
  transform: translateY(-4px) scale(1.04) !important;
}

.brand-glyph,
.svg-brand,
.slack-glyph,
.apple-glyph,
.microsoft-glyph,
.notion-glyph {
  width: 42px;
  height: 42px;
}

.google-g {
  display: grid;
  place-items: center;
  font: 800 42px/1 Arial, sans-serif;
  background: conic-gradient(from -35deg, #4285f4 0 28%, #34a853 28% 45%, #fbbc05 45% 64%, #ea4335 64% 78%, #4285f4 78%);
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent;
}

.grammarly-g {
  position: relative;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: #3ccc8a;
  color: white;
  font: 500 30px/1 Arial, sans-serif;
}

.grammarly-g i {
  position: absolute;
  width: 16px;
  height: 2px;
  right: 5px;
  top: 21px;
  background: white;
}

.slack-glyph { position: relative; display: block; }
.slack-glyph i { position: absolute; width: 10px; height: 22px; border-radius: 8px; }
.slack-glyph i:nth-child(1) { background:#36c5f0; left:7px; top:0; transform:rotate(90deg); }
.slack-glyph i:nth-child(2) { background:#36c5f0; left:0; top:7px; }
.slack-glyph i:nth-child(3) { background:#2eb67d; right:7px; top:0; }
.slack-glyph i:nth-child(4) { background:#2eb67d; right:0; top:7px; transform:rotate(90deg); }
.slack-glyph i:nth-child(5) { background:#ecb22e; right:7px; bottom:0; transform:rotate(90deg); }
.slack-glyph i:nth-child(6) { background:#ecb22e; right:0; bottom:7px; }
.slack-glyph i:nth-child(7) { background:#e01e5a; left:7px; bottom:0; }
.slack-glyph i:nth-child(8) { background:#e01e5a; left:0; bottom:7px; transform:rotate(90deg); }

.apple-glyph { position: relative; display: block; }
.apple-glyph::before,
.apple-glyph::after { content:""; position:absolute; background:#e59032; }
.apple-glyph::before { width:31px; height:32px; left:6px; top:10px; border-radius:48% 48% 46% 46% / 58% 58% 45% 45%; }
.apple-glyph::after { width:13px; height:8px; left:23px; top:2px; border-radius:100% 0 100% 0; rotate:-28deg; }
.apple-glyph i { position:absolute; z-index:2; width:12px; height:12px; right:1px; top:13px; border-radius:50%; background:#17102f; }

.microsoft-glyph { display:grid; grid-template-columns:1fr 1fr; grid-template-rows:1fr 1fr; gap:3px; }
.microsoft-glyph i:nth-child(1) { background:#f35325; }
.microsoft-glyph i:nth-child(2) { background:#81bc06; }
.microsoft-glyph i:nth-child(3) { background:#05a6f0; }
.microsoft-glyph i:nth-child(4) { background:#ffba08; }

.discord-glyph { fill:#6c68ff; }
.discord-glyph circle { fill:#17102f; }
.drive-green { fill:#1da462; }
.drive-blue { fill:#4688f4; }
.drive-yellow { fill:#fbbc04; }
.react-glyph { fill:none; stroke:#ff515d; stroke-width:2.5; }
.react-glyph circle { fill:#ff515d; stroke:none; }
.notion-glyph { position:relative; display:grid; place-items:center; color:#40d08b; border:3px solid currentColor; font:800 29px/1 Georgia,serif; transform:rotate(-6deg); }
.notion-glyph i { position:absolute; inset:4px; border:1px solid currentColor; }
.bing-glyph { fill:#ff961e; }

.detailed-core {
  position: absolute;
  z-index: 5;
  left: 50%;
  top: 50%;
  width: 170px;
  height: 170px;
  transform: translate(-50%, -50%) scale(.86);
  border: 1px solid rgba(159, 143, 222, .53);
  border-radius: 35px;
  background: linear-gradient(145deg, rgba(35, 27, 75, .98), rgba(23, 16, 54, .98));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.05),
    0 0 0 10px rgba(110, 88, 255, .035),
    0 25px 60px rgba(5, 0, 34, .65);
  opacity: 0;
  transition: opacity .65s ease .25s, transform .65s cubic-bezier(.2,.85,.3,1.2) .25s;
}

.integration-stage.visible .detailed-core { opacity:1; transform:translate(-50%,-50%) scale(1); }

.detailed-core > span {
  width: 134px;
  height: 134px;
  display: grid;
  place-items: center;
  border-radius: 28px;
  background: linear-gradient(145deg, #766bff, #5c51f2);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.18), 0 16px 40px rgba(88, 70, 239, .3);
}

.openai-knot { width: 78px; height: 78px; overflow:visible; }
.openai-knot g { fill:none; stroke:white; stroke-width:5.3; stroke-linejoin:round; }
.openai-knot circle { fill:none; stroke:white; stroke-width:5.3; }
.integration-stage.visible .openai-knot { animation:knot-breathe 4s ease-in-out infinite 1s; }

.integration-particles { position:absolute; inset:-25px -3vw; z-index:0; pointer-events:none; }
.integration-particles i {
  position:absolute;
  left:var(--x);
  top:var(--y);
  width:var(--s);
  height:var(--s);
  border-radius:50%;
  background:var(--c);
  box-shadow:0 0 8px var(--c);
  opacity:.85;
  animation:particle-drift var(--d) ease-in-out infinite alternate;
}

@keyframes connector-draw { to { stroke-dashoffset:0; } }
@keyframes signal-travel { to { stroke-dashoffset:-270; } }
@keyframes knot-breathe { 50% { transform:rotate(4deg) scale(1.045); filter:drop-shadow(0 0 9px rgba(255,255,255,.3)); } }
@keyframes particle-drift { to { translate:6px -10px; opacity:.25; } }

@media (max-width: 1050px) {
  .integration-stage { width:calc(100% - 30px); height:470px; }
  .integration-brand { width:66px; height:66px; }
  .detailed-core { width:145px; height:145px; }
  .detailed-core > span { width:112px; height:112px; }
  .openai-knot { width:66px; height:66px; }
}

@media (max-width: 720px) {
  .integrations { padding:78px 0 70px; }
  .integrations .section-title h2 { font-size:38px; line-height:44px; }
  .integration-stage { width:calc(100% - 12px); height:520px; margin-top:20px; }
  .integration-brand { width:54px; height:54px; border-radius:13px; }
  .brand-glyph,.svg-brand,.slack-glyph,.apple-glyph,.microsoft-glyph,.notion-glyph { width:31px; height:31px; }
  .google-g { font-size:31px; }
  .grammarly-g { font-size:22px; }
  .slack-glyph { scale:.75; }
  .apple-glyph { scale:.8; }
  .detailed-core { width:104px; height:104px; border-radius:24px; }
  .detailed-core > span { width:80px; height:80px; border-radius:19px; }
  .openai-knot { width:48px; height:48px; }
  .connector-lines path { stroke-width:1; }
}

@media (prefers-reduced-motion: reduce) {
  .connector-lines path { stroke-dashoffset:0 !important; }
  .connector-flow path { animation:none !important; opacity:.25; }
  .integration-brand,.detailed-core { opacity:1; transition:none; }
  .integration-brand { transform:none; }
}

/* Original project imagery generated for this implementation. */
.project-art,
.blog-art {
  background-image: url("images/ai-projects-triptych-v1.png") !important;
  background-repeat: no-repeat !important;
  background-size: 300% auto !important;
  background-color: #10072f !important;
}

.project-art.art-1,
.blog-art.art-1 { background-position: left center !important; }
.project-art.art-2,
.blog-art.art-2 { background-position: center center !important; }
.project-art.art-3,
.blog-art.art-3 { background-position: right center !important; }
.project-art::before,
.blog-art::before { opacity:.12; }
.project-art .orb,
.project-art > span,
.blog-art > span { display:none; }

.project-marquee {
  width:100%;
  overflow:hidden;
  margin-bottom:55px;
  white-space:nowrap;
}
.project-marquee > div {
  display:flex;
  width:max-content;
  animation:project-scroll 20s linear infinite;
}
.project-marquee span {
  display:block;
  padding-right:70px;
  font:700 200px/1 var(--display);
  letter-spacing:-5px;
  color:rgba(255,255,255,.075);
}
@keyframes project-scroll { to { transform:translateX(-50%); } }

.giant-word { font-size:200px; line-height:200px; }
.process-line article:nth-child(2) { transform:translateY(-48px); }

.faq-grid { gap:20px; align-items:start; }
.faq-column { display:grid; gap:20px; }
.faq-item { border-radius:20px; }
.faq-item button { min-height:79px; padding:25px 40px; font-size:22px; }
.faq-item.open .faq-answer p { padding:0 40px 25px; }

.quote-card { min-height:369px; padding:30px 22px; border-radius:30px; background:#0f0927; border-color:rgba(255,255,255,.2); }
.price-card { min-height:614px; padding:40px 36px 34px; border-radius:30px; background:linear-gradient(145deg,#0b0523,#211b39); }
.blog-card { min-height:465px; padding:20px 20px 32px; border:0; border-radius:20px; }
.site-footer { min-height:656px; }
.automation-word { font-size:180px; line-height:1; }

/* Remove the obsolete straight connector inherited from the first draft. */
.integration-stage::after { display:none; }

@media (max-width:720px) {
  .section-title h2 { font-size:38px; line-height:44px; }
  .project-marquee span { font-size:92px; padding-right:35px; }
  .process-line article:nth-child(2) { transform:none; }
  .faq-item button { min-height:70px; padding:20px; font-size:18px; }
  .faq-item.open .faq-answer p { padding:0 20px 20px; }
}

@media (prefers-reduced-motion:reduce) {
  .project-marquee > div,
  .integration-particles i,
  .openai-knot { animation:none !important; }
}

/* Reference proportions for the remaining home sections. */
.logos > .partner-logo {
  width:286px;
  height:160px;
  flex:none;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:4px;
  position:relative;
  border-radius:20px;
  background:rgba(255,255,255,.09);
  color:#fff;
  font:700 30px/1 var(--display);
}
.partner-logo b,.partner-logo i { position:relative; font-style:normal; }
.tp-mark { width:30px; height:30px; margin-right:6px; border:5px solid #5ee7df; border-left-color:transparent; border-radius:50%; rotate:-35deg; }
.tp-mark::after { content:""; position:absolute; width:15px; height:5px; right:-10px; top:8px; border-radius:5px; background:#5ee7df; }
.amazon-smile { position:absolute !important; width:65px; height:18px; bottom:42px; left:105px; border-bottom:3px solid #ffae35; border-radius:50%; rotate:-5deg; }
.envato-leaf { width:22px; height:34px; margin-right:5px; border-radius:100% 0 100% 100%; background:#6edf38; rotate:32deg; }
.partner-walmart b { font-size:27px; }
.walmart-spark { color:#ffb92f; margin-left:6px; font-size:25px; }
.upwork-word { color:#6fdf39; }
.google-word { background:linear-gradient(90deg,#4285f4 0 25%,#ea4335 25% 42%,#fbbc05 42% 58%,#4285f4 58% 75%,#34a853 75%); background-clip:text; -webkit-background-clip:text; color:transparent; }
.analytics-row .grid-3 { grid-template-columns:1.28fr .74fr 1fr; }
.analytics-row .dash { height:260px; }
.feature-card.wide { min-height:386px; }
.feature-card:not(.wide):not(.grow) { min-height:451px; }
.feature-card.grow { min-height:433px; }
.process-line article:nth-child(2) { transform:translateY(-82px); }

.stars::before { animation:stars-drift-a 12s ease-in-out infinite alternate; }
.stars::after { animation:stars-drift-b 15s ease-in-out infinite alternate; }
@keyframes stars-drift-a { to { transform:translate3d(14px,-20px,0); opacity:.42; } }
@keyframes stars-drift-b { to { transform:translate3d(-18px,13px,0); opacity:.55; } }

.section-title { perspective:400px; }
.title-char { display:inline-block; will-change:transform,opacity; }
.title-space { width:.28em; }
.section-title:not(.visible) .title-char { opacity:0; transform:translateX(45px) rotateY(-12deg); }
.section-title.visible .title-char { animation:title-char-in .62s cubic-bezier(.2,.8,.25,1) both; animation-delay:calc(var(--char-index) * 16ms); }
@keyframes title-char-in { to { opacity:1; transform:translateX(0) rotateY(0); } }

.faq-column:first-child .faq-item.reveal { transform:translateX(-38px); }
.faq-column:last-child .faq-item.reveal { transform:translateX(38px); }
.faq-column .faq-item.reveal.visible { transform:translateX(0); }
.process-line article:first-child.reveal { transform:translateX(-45px); }
.process-line article:last-child.reveal { transform:translateX(45px); }
.process-line article:first-child.reveal.visible,
.process-line article:last-child.reveal.visible { transform:translateX(0); }
.process-line article:nth-child(2).reveal.visible { transform:translateY(-82px); }

@media (max-width:1050px) {
  .analytics-row .grid-3 { grid-template-columns:1fr 1fr; }
  .process-line article:nth-child(2),
  .process-line article:nth-child(2).reveal.visible { transform:none; }
}

@media (max-width:720px) {
  .analytics-row .grid-3 { grid-template-columns:1fr; }
  .feature-card.wide,
  .feature-card:not(.wide):not(.grow),
  .feature-card.grow { min-height:330px; }
  .title-char { animation-delay:calc(var(--char-index) * 9ms) !important; }
}

@media (prefers-reduced-motion:reduce) {
  .stars::before,.stars::after,.title-char { animation:none !important; }
  .section-title .title-char { opacity:1 !important; transform:none !important; }
}

/* Exact reference-asset geometry pass. */
.brand-logo { display:block; width:142px; height:43px; object-fit:contain; }
.hero-diagram-frame,
.hero-diagram-core { display:none; }
.partner-logo img,
.dash img,
.feature-card img,
.process-icon img,
.process-connector,
.integration-master,
.project-art img,
.quote-card img,
.blog-art img,
.footer-brand img { display:block; max-width:100%; }
.integration-glow { pointer-events:none; }

@media (min-width:1051px) {
  .home-hero {
    height:842px;
    min-height:842px;
    box-sizing:border-box;
    padding-top:0;
    padding-bottom:0;
    background-image:url("reference/banner-bg3.png") !important;
    background-position:center top !important;
    background-repeat:no-repeat !important;
    background-size:cover !important;
  }
  .home-hero::before,
  .hero-rings { display:none !important; }
  .hero-copy { align-self:start; margin-top:260px; }
  .ai-map { align-self:start; height:540px; margin-top:201px; }
  .ai-map > svg,
  .ai-map > .ai-core { display:none !important; }
  .hero-diagram-frame,
  .hero-diagram-core { display:block; position:absolute; z-index:1; object-fit:contain; }
  .hero-diagram-frame { left:194px; top:91px; width:321px; height:402px; }
  .hero-diagram-core { left:289px; top:228px; width:130px; height:130px; z-index:2; }
  .map-node { z-index:3; height:58px; min-width:0; border-color:rgba(139,121,255,.7); font-size:18px; }
  .map-node.n1 { left:249px; top:35px; right:auto; bottom:auto; width:203px; }
  .map-node.n2 { left:512px; top:142px; right:auto; bottom:auto; width:207px; }
  .map-node.n3 { left:511px; top:381px; right:auto; bottom:auto; width:227px; }
  .map-node.n4 { left:254px; top:491px; right:auto; bottom:auto; width:197px; }
  .map-node.n5 { left:8px; top:384px; right:auto; bottom:auto; width:189px; }
  .map-node.n6 { left:-18px; top:142px; right:auto; bottom:auto; width:219px; }

  .trusted { padding:52px 0; }
  .partner-logo { width:286px; height:160px; border-radius:20px; background:rgba(255,255,255,.1); }
  .partner-logo img { width:auto; height:36px; object-fit:contain; }
  .analytics-row { padding:58px 0 116px; }
  .analytics-row .grid-3 { grid-template-columns:497fr 288fr 389fr; gap:20px; align-items:start; }
  .analytics-row .dash { height:auto; padding:0; margin:0; border:0; border-radius:0; background:none; overflow:visible; }
  .analytics-row .dash img { width:100%; height:auto; }

  .features { height:1173px; box-sizing:border-box; padding:38px 0 0; overflow:visible; }
  .features .section-title { margin-bottom:32px; }
  .feature-card { position:relative; isolation:isolate; overflow:hidden; padding:40px; background:linear-gradient(180deg,#0b0523 0%,#211b39 100%); border-color:rgba(92,91,229,.3); }
  .feature-card > h3,
  .feature-card > p,
  .feature-card > ul { position:relative; z-index:3; }
  .feature-card > p { max-width:470px; color:rgba(255,255,255,.7); }
  .feature-card .feature-shape,
  .feature-card .feature-visual { position:absolute; z-index:1; pointer-events:none; }
  .feature-card .feature-visual { z-index:2; }
  .feature-card.wide { min-height:386px; }
  .feature-card:not(.wide):not(.grow) { min-height:451px; }
  .feature-card.grow { min-height:451px; }
  .feature-chart .feature-shape { inset:0; width:100%; height:100%; object-fit:cover; }
  .feature-chart .feature-visual { left:40px; bottom:31px; width:calc(100% - 80px); }
  .feature-security .feature-shape { right:0; bottom:0; width:561px; height:121px; }
  .feature-security .feature-visual { left:50%; bottom:45px; width:440px; height:140px; transform:translateX(-50%); }
  .feature-growth .feature-shape { left:0; top:10px; width:100%; height:auto; }
  .feature-growth .feature-visual { left:40px; bottom:27px; width:calc(100% - 80px); }
  .feature-insights .feature-shape { inset:0; width:100%; height:100%; object-fit:cover; }
  .feature-insights > ul { display:grid; gap:18px; width:250px; margin-top:28px; list-style:none; }
  .feature-insights > ul li { position:relative; padding-left:34px; }
  .feature-insights > ul li::before { content:""; position:absolute; left:0; top:2px; width:22px; height:20px; background:url("reference/check.png") center/contain no-repeat; }
  .feature-insights .feature-visual { right:40px; bottom:36px; width:482px; height:226px; }

  .process { height:728px; box-sizing:border-box; padding:30px 0 127px; overflow:hidden; }
  .process .giant-word { height:200px; line-height:200px; }
  .process-line { position:relative; grid-template-columns:repeat(3,1fr); gap:60px; margin-top:110px; }
  .process-line::before { display:none; }
  .process-line article { z-index:2; min-height:261px; }
  .process-line article:nth-child(2),
  .process-line article:nth-child(2).reveal.visible { transform:translateY(-94px); }
  .process-icon { width:90px; height:90px; margin:0 auto 27px; }
  .process-icon img { width:auto; height:44px; object-fit:contain; }
  .process-line article:first-of-type .process-icon img,
  .process-line article:last-of-type .process-icon img { width:40px; height:40px; }
  .process-line article h3 { font-size:27px; line-height:40px; }
  .process-line article p { max-width:340px; margin-left:auto; margin-right:auto; color:rgba(255,255,255,.7); }
  .process-connector { position:absolute; z-index:1; top:-40px; width:auto; height:95px; }
  .process-connector.connector-one { left:259px; width:352px; }
  .process-connector.connector-two { left:677px; width:343px; top:-42px; }

  .integrations { position:relative; height:868px; box-sizing:border-box; padding:100px 0 34px; background:#080220; }
  .integration-glow { position:absolute; z-index:0; left:50%; top:2px; width:1024px; height:170px; transform:translateX(-50%); }
  .integrations .section-title,
  .integrations .lead,
  .integration-stage { position:relative; z-index:2; }
  .integration-stage { width:calc(100% - 40px); max-width:1225px; height:auto; aspect-ratio:1320/506; margin:15px auto 0; }
  .integration-stage::before { display:none; }
  .integration-master { width:100%; height:auto; }

  .projects { height:971px; box-sizing:border-box; padding:20px 0 100px; }
  .project-marquee { height:216px; margin:0; }
  .project-marquee > div { height:216px; align-items:center; }
  .project-marquee span { font-size:200px; line-height:216px; color:transparent; background:linear-gradient(180deg,rgba(255,255,255,.26),rgba(255,255,255,.04)); -webkit-background-clip:text; background-clip:text; }
  .project-grid { margin-top:30px; gap:20px; }
  .project-card { min-height:565px; padding:20px; border-radius:20px; background:linear-gradient(180deg,#0b0523 0%,#211b39 100%); border-color:rgba(92,91,229,.3); }
  .project-art { height:257px; border-radius:12px; background:none !important; overflow:hidden; }
  .project-art::before,
  .project-art::after,
  .project-art .orb,
  .project-art > span { display:none !important; }
  .project-art img { width:100%; height:100%; object-fit:cover; }
  .project-card > div:last-child { padding:24px 20px 0; }
  .project-card h3 { margin-top:8px; }
  .project-card p { min-height:78px; color:rgba(255,255,255,.7); }

  .faq { position:relative; height:928px; box-sizing:border-box; background:url("reference/accrodion-effient.png") center top/100% 168px no-repeat; }
  .faq::before,
  .faq::after { content:""; position:absolute; top:17px; width:496px; height:489px; pointer-events:none; background:center/contain no-repeat; opacity:.8; }
  .faq::before { left:0; background-image:url("reference/accrodion-shape1.png"); }
  .faq::after { right:0; background-image:url("reference/accrodion-shape2.png"); }
  .faq .section-title,
  .faq .container { position:relative; z-index:1; }
  .testimonials { height:499px; box-sizing:border-box; padding:0 0 110px; }
  .testimonial-layout { height:389px; }
  .quote-card .quote-mark { width:40px; height:33px; margin:0 0 28px; }
  .quote-card > b { display:none; }
  .quote-card .person > span { display:none; }
  .quote-card .person > img { width:66px; height:66px; border-radius:50%; object-fit:cover; }

  .pricing { position:relative; height:1079px; box-sizing:border-box; }
  .price-card { position:relative; overflow:hidden; }
  .price-emblem { position:absolute; top:10px; right:12px; width:158px; height:160px; }
  .price-emblem img { position:absolute; }
  .price-box { inset:0; width:158px; height:160px; }
  .price-icon { top:63px; left:59px; width:40px; height:34px; }
  .price-card > h3,
  .price-card > .price,
  .price-card > p,
  .price-card > a,
  .price-card > h4,
  .price-card > ul { position:relative; z-index:2; }

  .blog-section { position:relative; height:929px; box-sizing:border-box; background:url("reference/accrodion-effient.png") center top/100% 168px no-repeat; }
  .blog-art { height:222px; background:none !important; overflow:hidden; }
  .blog-art::before,
  .blog-art::after,
  .blog-art > span { display:none !important; }
  .blog-art img { width:100%; height:100%; object-fit:cover; }
  .blog-art > b { z-index:2; }

  .site-footer { height:656px; min-height:656px; background:#080220 url("reference/footer-bg2-1.png") center/cover no-repeat; }
  .footer-glow { display:none; }
  .footer-brand img { width:142px; height:43px; }
}

@media (min-width:1321px) {
  .container { width:min(1280px,calc(100% - 40px)); }
  .section-title h2 { font-size:50px; line-height:56px; }
  .site-header { padding-left:max(40px,calc((100vw - 1300px)/2)); padding-right:max(40px,calc((100vw - 1300px)/2)); }
  .home-hero { height:856px; min-height:856px; padding-left:calc((100% - 1280px)/2); padding-right:calc((100% - 1280px)/2); grid-template-columns:630px 630px; column-gap:20px; }
  .hero-copy { width:630px; margin-top:270px; }
  .hero-copy h1 { font-size:70px; line-height:74px; }
  .hero-copy p { max-width:630px; margin-top:21px; font-size:20px; line-height:30px; }
  .hero-copy .button { margin-top:30px; }
  .ai-map { width:630px; }
  .hero-diagram-frame { left:194px; }
  .hero-diagram-core { left:288px; }
  .map-node.n1 { left:249px; }
  .map-node.n2 { left:512px; }
  .map-node.n3 { left:511px; }
  .map-node.n4 { left:254px; }
  .map-node.n5 { left:8px; }
  .map-node.n6 { left:-18px; }
  .partner-logo { width:300px; }
  .analytics-row .grid-3 { grid-template-columns:536fr 312fr 424fr; }
  .features { height:1161px; }
  .feature-card.wide { min-height:410px; }
  .feature-card:not(.wide):not(.grow),
  .feature-card.grow { min-height:451px; }
  .process-line { gap:60px; }
  .integrations { height:889px; }
  .integrations .section-title h2 { font-size:50px; line-height:60px; }
  .integration-stage { width:1280px; max-width:1280px; }
  .projects { height:964px; }
  .project-card { min-height:557px; }
  .project-art { height:276px; }
  .faq { height:926px; }
  .testimonials { height:526px; }
  .testimonial-layout { height:416px; }
  .pricing { height:1076px; }
  .blog-section { height:942px; }
}

@media (max-width:1050px) {
  .brand-logo { width:126px; height:auto; }
  .home-hero { background-image:url("reference/banner-bg3.png"); background-position:center top; background-size:cover; }
  .hero-diagram-frame,
  .hero-diagram-core { display:block; position:absolute; object-fit:contain; }
  .hero-diagram-frame { left:50%; top:50%; width:260px; transform:translate(-50%,-50%); }
  .hero-diagram-core { left:50%; top:50%; width:106px; transform:translate(-50%,-50%); }
  .ai-map > svg,
  .ai-map > .ai-core { display:none; }
  .feature-card { position:relative; overflow:hidden; }
  .feature-card .feature-shape { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:.75; }
  .feature-card .feature-visual { position:relative; z-index:2; width:100%; height:auto; margin-top:24px; }
  .process-connector { display:none; }
  .integration-glow { position:absolute; width:100%; left:0; top:0; opacity:.6; }
  .integration-stage { height:auto; aspect-ratio:1320/506; }
  .integration-master { width:100%; }
  .project-art img,
  .blog-art img { width:100%; height:100%; object-fit:cover; }
}

/* Pixel-level desktop alignment after side-by-side reference capture. */
@media (min-width:1051px) {
  .hero-diagram-frame { left:202px; }
  .hero-diagram-core { left:297px; }
  .map-node.n1 { left:257px; }
  .map-node.n2 { left:520px; }
  .map-node.n3 { left:519px; }
  .map-node.n4 { left:262px; }
  .map-node.n5 { left:16px; }
  .map-node.n6 { left:-10px; }

  .trusted { padding-top:32px; padding-bottom:72px; }
  .partner-logo { flex:0 0 286px; }
  .analytics-row .grid-3 { grid-template-columns:497px 288px 389px; justify-content:start; }

  .feature-card h3 { margin-bottom:10px; font-size:32px; line-height:40px; }
  .feature-chart > p,
  .feature-security > p { max-width:455px; }
  .feature-growth > p { max-width:274px; }
  .feature-insights > p { max-width:636px; }
  .feature-chart .feature-visual { bottom:49px; }
  .feature-growth .feature-visual { width:calc(100% - 82px); bottom:69px; }
  .feature-insights .feature-visual { right:49px; bottom:101px; }

  .process-line article:nth-child(2) { transform:none; }
  .process-line article:nth-of-type(2),
  .process-line article:nth-of-type(2).reveal.visible { transform:translateY(-94px); }

  .integrations { padding-top:119px; padding-bottom:15px; }
  .integrations .section-title { margin-bottom:20px; }
  .integrations .section-title h2 { line-height:56px; }
  .integrations .lead { max-width:576px; }

  .project-grid { width:min(1300px,calc(100% - 40px)); max-width:none; margin-top:66px; }
  .project-card h3 { font-size:30px; line-height:38px; }

  .faq { padding-top:126px; padding-bottom:94px; }
  .faq .section-title { margin-bottom:65px; }

  .testimonials { align-items:start; }
  .testimonial-layout { grid-template-columns:431px 829px; gap:20px; align-items:center; }
  .testimonial-intro { align-self:start; margin-top:10px; }
  .testimonial-track { grid-template-columns:repeat(4,400px); gap:29px; }
  .quote-card { min-height:396px; height:396px; padding:46px 32px 30px; }
  .quote-card .quote-mark { margin-bottom:20px; }
  .quote-card p { font-size:18px; line-height:27px; }
  .quote-card .stars-rating { margin-top:18px; }
  .quote-card .person { margin-top:35px; }

  .pricing { padding-top:125px; padding-bottom:95px; }
  .pricing .section-title { margin-bottom:50px; }
  .price-card { min-height:612px; height:612px; padding:40px 36px 34px; }
  .price-emblem { top:0; left:0; right:auto; width:158px; height:160px; }
  .price-emblem::after { content:""; position:absolute; z-index:1; left:36px; top:40px; width:70px; height:70px; border:1px solid rgba(124,112,255,.36); border-radius:50%; background:linear-gradient(145deg,rgba(255,255,255,.08),rgba(103,83,255,.03)); }
  .price-box { inset:0; width:158px; height:160px; }
  .price-icon { z-index:2; top:58px; left:53px; width:40px; height:34px; }
  .price-card > h3 { display:flex; align-items:center; height:70px; margin:0 0 25px; padding-left:92px; font-size:28px; line-height:34px; }
  .price-card > .price { display:flex; align-items:center; height:58px; margin:0; gap:16px; }
  .price-card > .price b,
  .price-card > .price span { font-size:48px; line-height:26px; }
  .price-card > p { margin:5px 0 30px; text-transform:capitalize; }
  .price-card > .ghost-button { margin:0 0 34px; height:58px; }
  .price-card > h4 { margin:0 0 22px; font-size:22px; line-height:27px; }

  .blog-section { padding-top:125px; padding-bottom:95px; }
  .blog-section .section-title { margin-bottom:50px; }
  .blog-grid { grid-template-columns:repeat(3,1fr); gap:0; }
  .blog-card { width:calc(100% - 22px); height:477px; min-height:477px; justify-self:center; }
  .blog-art { height:auto; aspect-ratio:390/250; }
  .blog-art img { height:auto; aspect-ratio:390/250; }

  .site-footer { position:relative; }
  .footer-brand,
  .site-footer > nav,
  .site-footer > .socials,
  .automation-word,
  .copyright { position:absolute; left:50%; transform:translateX(-50%); margin:0; }
  .footer-brand { top:120px; width:142px; height:43px; }
  .site-footer > nav { top:203px; width:1300px; justify-content:center; }
  .site-footer > .socials { top:264px; width:220px; justify-content:center; }
  .site-footer > .socials a { width:44px; height:44px; }
  .automation-word { top:340px; width:1300px; height:180px; font-size:180px; line-height:180px; overflow:hidden; white-space:nowrap; text-align:center; }
  .copyright { top:576px; width:1300px; height:62px; padding-top:25px; font-size:16px; line-height:26px; }
}

@media (min-width:1321px) {
  .partner-logo { flex-basis:300px; }
  .analytics-row .grid-3 { grid-template-columns:520px 302px 407px; }
  .feature-layout { position:relative; top:17px; row-gap:3px; }
  .feature-chart .feature-visual { bottom:66px; }
  .feature-security .feature-visual { bottom:70px; }
  .feature-growth .feature-visual { width:325px; }
}

/* Final reference-detail pass: typography, compact controls and motion states. */
html,
body { overflow-x:clip; }

@media (min-width:1051px) {
  .section-title .eyebrow,
  .testimonial-intro > .eyebrow {
    min-height:38px;
    padding:8px 30px;
    border:0;
    background:rgba(255,255,255,.05);
    font-size:18px;
    line-height:21.6px;
    margin-bottom:25px;
  }

  .features { padding-top:29px; padding-bottom:47px; }
  .faq { padding-top:117px; padding-bottom:103px; }
  .pricing { padding-top:116px; padding-bottom:104px; }
  .blog-section { padding-top:116px; padding-bottom:104px; }

  .popular { display:none; }

  .price-card li .icon {
    width:20px;
    height:20px;
    margin-right:9px;
    padding:4px;
    border:1px solid rgba(124,112,255,.55);
    border-radius:50%;
  }

  .to-top {
    right:90px;
    bottom:60px;
    width:60px;
    height:60px;
    font-size:0;
  }
  .to-top::before { content:'⌃'; font-size:28px; line-height:1; }
}

@media (min-width:1051px) and (max-width:1320px) {
  .blog-card { height:465px; min-height:465px; }
}