/* Home A corrections, all CSS so the template's DOM stays untouched. */

/* The client strip band: light, no dark bars, no slider chrome. The template
   wrapped it in a Webflow slider, which is where the stray arrows came from. */
.brand-wrapper, .brand-marquee-holder, .section.brand { background: #FFFFFF !important; }
.brand-wrapper { overflow: hidden; }
.brand-marquee-holder { max-width: 100%; }
.home-1-brand-right-shadow, .home-1-brand-left-shadow { display: none !important; }

/* Kill Webflow slider navigation wherever it appears on this page. */
.brand-wrapper .w-slider-arrow-left,
.brand-wrapper .w-slider-arrow-right,
.brand-wrapper .w-slider-nav,
.section.brand .w-slider-nav { display: none !important; }

/* Client marks: even weight, no colour clash against the white band. */
.brand-image { max-height: 30px; width: auto; object-fit: contain; opacity: .62; filter: grayscale(1); transition: opacity .2s ease, filter .2s ease; }
.brand-image:hover { opacity: 1; filter: grayscale(0); }

/* Any eyebrow pill left in the DOM collapses completely, no reserved space. */
.body-tag, .body-tag-text, .body-tag-text.white { display: none !important; }

/* Artwork is an <img> again so the template's sizing rules apply, but these
   pieces are wide, so keep them from overflowing their card. */
.real-time-chat-mockup-wrapper img,
.overview-01-real-time-chat-wrapper img,
.agent-01-image-wrapper img { max-width: 100%; height: auto; }

/* The hero eyebrow pill is its own component, not .body-tag. */
.hero-1-tag-wrapper, .hero-tag, .hero-tag-title { display: none !important; }

/* The hashtag block says nothing. */
.ai-voice-agent-tag-wrapper, .voice-agent-tag-text, .ai-voice-agent-tag { display: none !important; }

/* Carousel cards must share a height regardless of what art sits inside them.
   The CRM mockup is taller than the others and was dragging its slide down. */

/* The lower proof circles hold client marks, which are wordmarks on white, not
   faces. Drop the overlap and the crop so they stay legible. */
.contact-client-image-wrapper .avatar-group-item,
.contact-client-image-wrapper img { object-fit: contain; background: #FFFFFF; border: 1px solid #E9EDF6; padding: 4px; }

/* Equal card heights WITHOUT touching display. Webflow slides must remain
   inline-block; setting display:flex on .w-slide stacks the track vertically
   and destroys the carousel. Only the inner card wrappers get a min-height. */
.overview-01-real-time-chat-wrapper,
.overview-01-no-code-builder-wrapper,
.ovewview-01-voice-agent-wrapper,
.overview-01-custom-workflow-wrapper,
.overflow-01-ai-integration-wrapper { min-height: 480px; }

/* The CRM mockup is wider than the others; keep it inside its card. */
.real-time-chat-mockup-wrapper img { width: 100%; height: auto; }

/* Leftover eyebrow pill on the dark section. */
.section.dark .body-tag, .section.dark .hero-tag,
.why-choose-tag-wrapper, .why-choose-tag, [class*="-tag-wrapper"]:has(:empty) { display: none !important; }

/* Eyebrow pills on dark sections use their own class. */
.dark-section-tag, .dark-section-tag-wrapper { display: none !important; }

/* Closing CTA reads better centred without its broken right-hand image. */
.cta-3-image-wrapper, .cta-3-image { display: none !important; }
.cta-3-wrapper, .cta-3-holder, .cta-3-title-wrapper { text-align: center; }
.cta-3-content-wrapper { margin: 0 auto; max-width: 720px; }

/* The marquee track is intentionally wider than the screen; its container must
   clip it or the whole page gains a horizontal scrollbar on narrow viewports. */
.section.brand, .brand-wrapper, .brand-marquee-holder,
.hime-1brand-customer-text-wrapper { overflow: hidden; max-width: 100%; }
.brand-marquee-holder { width: 100%; }

/* Testimonial cards: the template used a wide scene photo in that slot, so a
   headshot dropped in there rendered nearly 300px across. Constrain it to a
   portrait thumbnail so the quote leads and the face supports it. */
.testimonial-card-image { width: 72px !important; height: 72px !important; border-radius: 50%; object-fit: cover; }
.testimonial-card-image-wrapper { width: auto !important; flex: none; }

/* The app-download block advertises a product that does not exist. */
[class*="download-1"], .download-1-content-wrapper { display: none !important; }

/* Closing CTA: centred, no eyebrow pill, no orphaned right column. */
.cta-3-tag-wrapper, .cta-3-tag, .get-started-tag { display: none !important; }

/* Client strip carries real logo marks, not text. */
.la-strip-item { display: inline-flex; align-items: center; justify-content: center; padding: 0 38px; }
.la-strip-logo { height: 30px; width: auto; max-width: 150px; object-fit: contain; opacity: .58; filter: grayscale(1); transition: opacity .2s ease, filter .2s ease; }
.la-strip-item:hover .la-strip-logo { opacity: 1; filter: grayscale(0); }

/* Any highlight span that survives in markup renders flat. */
[class*="text-bg-01"], [class*="text-bg-02"] { background: none !important; }

/* No italics in headings. The template used them as decoration and they read
   as a distraction rather than emphasis. */
.title-italic-text, h1 em, h2 em, h3 em, h4 em,
h1 .title-italic-text, h2 .title-italic-text { font-style: normal !important; }

/* H1 is two statements, one per line. Needs enough width for the second to
   stay whole, otherwise 'Your time back.' breaks across three lines. */
.hero-title { display: block; max-width: 20ch; margin-left: auto; margin-right: auto; text-wrap: balance; }
.hero-title .title-italic-text { display: block; }
.hero-title > span:last-of-type { display: inline; }

/* Close the gap between the step arrows and the heading that follows. */
.working-process-tab-link:last-child { margin-bottom: 0; }
.how-it-work-tab-content-wrapper { margin-bottom: 0; }

/* Robot glyph beside "Someone has to run the robots." */
.la-robot { display: inline-flex; vertical-align: -4px; margin-right: 10px; }
.la-robot svg { width: 30px; height: 30px; }