:root {
  --background: oklch(0.14 0.012 40);
  --foreground: oklch(0.97 0.005 70);
  --card: oklch(0.18 0.014 42);
  --primary: oklch(0.7 0.2 45);
  --primary-foreground: oklch(0.14 0.012 40);
  --muted-foreground: oklch(0.72 0.015 60);
  --border: oklch(0.3 0.018 45);
  --ember: oklch(0.64 0.22 38);
  --flame: oklch(0.76 0.19 58);
  --amber-line: oklch(0.78 0.16 62);
  --bubble: oklch(0.24 0.016 45);
  --gradient-molten: radial-gradient(120% 90% at 8% 20%, oklch(0.55 0.19 45 / .4), transparent 55%), radial-gradient(100% 80% at 92% 15%, oklch(0.6 0.16 62 / .35), transparent 55%), radial-gradient(90% 70% at 50% 95%, oklch(0.5 0.16 38 / .3), transparent 60%);
  --gradient-flame: linear-gradient(100deg, var(--ember), var(--flame));
  --shadow-ember: 0 30px 90px -30px oklch(0.7 0.2 45 / .45);
  --shadow-card: 0 24px 70px -30px oklch(0 0 0 / .7);
  --font-display: "Outfit", ui-sans-serif, system-ui, sans-serif;
  --font-sans: "DM Sans", ui-sans-serif, system-ui, sans-serif;
  --font-capabilities: "Figtree", ui-sans-serif, system-ui, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, monospace;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--background); color: var(--foreground); font-family: var(--font-sans); -webkit-font-smoothing: antialiased; }
button, a { font: inherit; }
button { color: inherit; }
a { color: inherit; text-decoration: none; }
img, video { display: block; max-width: 100%; }
ul, p, h1, h2, h3, blockquote { margin: 0; padding: 0; }
ul { list-style: none; }
::selection { background: var(--ember); color: var(--primary-foreground); }
.site-main { position: relative; }
.content { position: relative; width: min(100% - 3rem, 80rem); margin-inline: auto; }
.content-md { max-width: 72rem; }
.section-pad { padding-block: 7rem; }

.site-header { position: absolute; inset: 0 0 auto; z-index: 50; }
.nav-shell { width: min(100% - 3rem, 80rem); margin: auto; padding-block: 1.5rem; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 1rem; }
.wordmark { justify-self: start; flex: 0 0 auto; white-space: nowrap; }
.wordmark, .footer-wordmark { font: 900 1.125rem/1 var(--font-display); letter-spacing: -.025em; }
.wordmark span, .footer-wordmark b { color: var(--primary); }
.nav-links { display: flex; align-items: center; gap: .5rem; border: 1px solid oklch(0.97 0.005 70 / .1); border-radius: 999px; background: oklch(0.97 0.005 70 / .05); padding: .25rem; backdrop-filter: blur(12px); }
.nav-links a { display: block; border-radius: 999px; padding: .5rem 1rem; font-size: .75rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: oklch(0.97 0.005 70 / .8); transition: .2s; }
.nav-links a:hover { background: oklch(0.97 0.005 70 / .1); color: var(--foreground); }
.nav-actions { grid-column: 3; justify-self: end; display: flex; align-items: center; gap: .75rem; }
.nav-cta { border: 1px solid oklch(0.78 0.16 62 / .6); border-radius: 999px; background: oklch(0.97 0.005 70 / .05); padding: .625rem 1.25rem; font-size: .75rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; backdrop-filter: blur(12px); transition: .2s; }
.nav-cta:hover { background: oklch(0.78 0.16 62 / .2); }
.language-toggle { display: flex; gap: .125rem; align-items: center; border: 1px solid oklch(0.97 0.005 70 / .15); border-radius: 999px; background: oklch(0.97 0.005 70 / .05); padding: .25rem; backdrop-filter: blur(12px); }
.language-toggle button { cursor: pointer; border: 0; border-radius: 999px; background: transparent; padding: .375rem .75rem; font-size: .75rem; font-weight: 600; letter-spacing: .12em; color: oklch(0.97 0.005 70 / .7); transition: .2s; }
.language-toggle button[aria-pressed="true"] { background: var(--primary); color: var(--primary-foreground); }
.nav-toggle { display: none; position: relative; width: 2.5rem; height: 2.5rem; flex: 0 0 auto; cursor: pointer; border: 1px solid oklch(0.97 0.005 70 / .15); border-radius: 999px; background: oklch(0.97 0.005 70 / .05); color: var(--foreground); backdrop-filter: blur(12px); }
.nav-toggle span { position: absolute; top: 50%; left: 50%; width: 1rem; height: 2px; margin: -1px 0 0 -.5rem; border-radius: 2px; background: currentColor; transition: transform .25s ease, opacity .2s ease; }
.nav-toggle span:nth-child(1) { transform: translateY(-.3rem); }
.nav-toggle span:nth-child(3) { transform: translateY(.3rem); }
.nav-toggle[aria-expanded="true"] span:nth-child(1) { transform: rotate(45deg); }
.nav-toggle[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.nav-toggle[aria-expanded="true"] span:nth-child(3) { transform: rotate(-45deg); }

.hero-section { position: relative; overflow: hidden; }
.section-video, .video-dimmer { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.section-video { object-fit: cover; }
.hero-video, .hero-dimmer { mask-image: linear-gradient(to bottom, #000 55%, transparent 100%); -webkit-mask-image: linear-gradient(to bottom, #000 55%, transparent 100%); }
.hero-dimmer { background: oklch(0.14 0.012 40 / .4); }
.hero-inner { position: relative; width: min(100% - 3rem, 80rem); min-height: 100vh; margin: auto; padding-top: 8rem; display: flex; flex-direction: column; align-items: center; }
.hero-inner h1 { text-align: center; font: 900 clamp(2.25rem, 5vw, 3.75rem)/.95 var(--font-display); letter-spacing: -.025em; }
.hero-subtitle { margin-top: 1rem; max-width: 28rem; text-align: center; font-size: 1rem; color: oklch(0.97 0.005 70 / .7); }
.hero-subtitle::first-letter { color: var(--foreground); }
.hero-showcase { position: relative; width: 100%; margin-top: 3rem; padding-bottom: 4rem; display: flex; align-items: flex-start; justify-content: center; }
.giant-wordmark { position: absolute; bottom: 4rem; left: 50%; transform: translateX(-50%); white-space: nowrap; user-select: none; pointer-events: none; font: 900 min(24vw, 24rem)/1 var(--font-display); letter-spacing: -.05em; opacity: .9; filter: blur(16px); }
.giant-wordmark b { color: var(--primary); }
.note-card { width: 100%; max-width: 24rem; min-height: 7.5rem; border: 1px solid color-mix(in oklab, var(--foreground) 15%, transparent); border-radius: 1rem; padding: 1.25rem 1.5rem; background: color-mix(in oklab, var(--card) 60%, transparent); color: var(--foreground); box-shadow: var(--shadow-card); backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px); }
.note-card > span { display: inline-flex; border: 1px solid color-mix(in oklab, var(--primary) 40%, transparent); border-radius: 999px; background: color-mix(in oklab, var(--primary) 25%, transparent); padding: .25rem .75rem; font-size: .6875rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--primary); }
.note-card p { margin-top: .75rem; font-size: 1.05rem; font-weight: 600; line-height: 1.35; }
.desktop-note { position: absolute; top: 1rem; z-index: 20; max-width: min(24rem, calc((100% - 460px) / 2 - 1rem)); }
.note-left { left: 0; }
.note-right { top: 16rem; right: 0; }
.phone-wrap { position: relative; z-index: 10; width: min(460px, 92vw); padding-bottom: 2.5rem; }
.phone-glow { position: absolute; inset: -2.5rem; z-index: -1; border-radius: 999px; background: oklch(0.64 0.22 38 / .25); filter: blur(64px); animation: pulse-glow 4s ease-in-out infinite; }
.phone-frame { border: 1px solid oklch(0.97 0.005 70 / .15); border-radius: 2.75rem; background: var(--background); padding: .625rem; box-shadow: var(--shadow-ember); }
.phone-screen { position: relative; height: min(760px, 80vh); display: flex; flex-direction: column; overflow: hidden; border-radius: 2.25rem; background: var(--card); }
.phone-notch { position: absolute; z-index: 10; top: .625rem; left: 50%; transform: translateX(-50%); width: 6rem; height: 1.25rem; border-radius: 999px; background: var(--background); }
.phone-header { display: flex; align-items: center; gap: .75rem; border-bottom: 1px solid oklch(0.3 0.018 45 / .7); padding: 2.25rem 1rem .75rem; }
.agent-avatar { width: 2.25rem; height: 2.25rem; flex: 0 0 auto; border-radius: 50%; background: var(--gradient-flame); }
.phone-header p { font-size: .875rem; font-weight: 600; line-height: 1.25; }
.phone-header small { font-size: .6875rem; color: var(--muted-foreground); }
.conversation { flex: 1; overflow: hidden; padding: 1rem; display: flex; flex-direction: column; gap: .625rem; }
.message { width: fit-content; max-width: 85%; border-radius: 1rem; padding: .625rem .875rem; font-size: .875rem; }
.message.bot { border-bottom-left-radius: .375rem; background: var(--bubble); }
.message.user { margin-left: auto; max-width: 80%; border-bottom-right-radius: .375rem; background: var(--gradient-flame); color: var(--primary-foreground); }
.message.action { display: inline-flex; align-items: center; gap: .5rem; border: 1px solid oklch(0.78 0.16 62 / .4); border-radius: 999px; background: oklch(0.97 0.005 70 / .05); padding: .375rem .75rem; font-size: .6875rem; font-weight: 500; color: var(--amber-line); }
.message.action::before { content: ""; width: .375rem; height: .375rem; border-radius: 50%; background: var(--amber-line); }
.suggestions { display: flex; flex-wrap: wrap; gap: .375rem; padding: 0 1rem 1.25rem; }
.suggestions span { border: 1px solid var(--border); border-radius: 999px; padding: .25rem .625rem; font-size: .6875rem; color: var(--muted-foreground); }
.suggestions span.highlighted { border-color: var(--amber-line); color: var(--amber-line); }
.message { animation: message-in .45s cubic-bezier(.2, .9, .3, 1.2) backwards; transform-origin: 0 100%; }
.message.user { transform-origin: 100% 100%; }
.message.action { transform-origin: 0 50%; }
.message.typing { display: flex; align-items: center; gap: .3rem; padding: .8rem 1rem; }
.message.typing span { width: .4rem; height: .4rem; border-radius: 50%; background: currentColor; animation: typing-dot 1.2s ease-in-out infinite; }
.message.typing span:nth-child(2) { animation-delay: .15s; }
.message.typing span:nth-child(3) { animation-delay: .3s; }
.message.bot.typing { color: var(--muted-foreground); }
.message.action.is-running { background-image: linear-gradient(100deg, transparent 30%, oklch(0.78 0.16 62 / .22) 50%, transparent 70%); background-size: 200% 100%; background-repeat: no-repeat; animation: message-in .45s cubic-bezier(.2, .9, .3, 1.2) backwards, action-shimmer 1.1s linear infinite; }
.message.action.is-running::before { animation: action-ping .9s ease-out infinite; }
.conversation.is-clearing { animation: chat-clear .45s ease forwards; }
.suggestions span { transition: transform .2s ease, background-color .2s ease; }
.suggestions span.is-tapped { transform: scale(.92); background: oklch(0.78 0.16 62 / .18); }
#phone-status { transition: color .2s ease; }
#phone-status.is-typing { color: var(--amber-line); }
.mobile-notes { display: none; width: min(100%, 28rem); margin-bottom: 4rem; gap: 1rem; }

.conversational { position: relative; overflow: hidden; }
.warm-glow { position: absolute; left: 50%; transform: translateX(-50%); border-radius: 50%; pointer-events: none; }
.glow-one { top: -10rem; width: 45rem; height: 26.25rem; background: oklch(0.64 0.22 38 / .1); filter: blur(140px); }
.glow-two { top: -6rem; width: 30rem; height: 16.25rem; background: oklch(0.76 0.19 58 / .08); filter: blur(100px); }
.centered-heading { text-align: center; }
.eyebrow-pill { display: inline-flex; align-items: center; border: 1px solid oklch(0.64 0.22 38 / .3); border-radius: 999px; background: oklch(0.64 0.22 38 / .1); padding: .375rem 1rem; font-size: .75rem; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: var(--flame); }
.centered-heading h2 { margin-top: 1.5rem; font: 900 clamp(3rem, 7vw, 6rem)/.95 var(--font-display); letter-spacing: -.025em; text-transform: uppercase; }
.flame-text { background: var(--gradient-flame); background-clip: text; -webkit-background-clip: text; color: transparent; }
.centered-heading > p { max-width: 42rem; margin: 1.5rem auto 0; font-size: 1.125rem; line-height: 1.625; color: oklch(0.97 0.005 70 / .75); }
.stats-grid { margin-top: 4rem; display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem; }
.stat-card { position: relative; overflow: hidden; border: 1px solid oklch(1 0 0 / .05); border-radius: 1.5rem; background: var(--card); padding: 2rem; transition: .5s; }
.stat-card::after { content: ""; position: absolute; right: -1.5rem; bottom: -1.5rem; width: 8rem; height: 8rem; border-radius: 50%; background: oklch(0.64 0.22 38 / .1); filter: blur(48px); transition: .5s; }
.stat-card:hover { border-color: oklch(0.64 0.22 38 / .3); background: oklch(0.18 0.014 42 / .8); }
.stat-card:hover::after { background: oklch(0.64 0.22 38 / .2); }
.stat-card > * { position: relative; z-index: 1; }
.stat-value { font: 900 3rem/1 var(--font-display); letter-spacing: -.05em; color: var(--ember); transition: .5s; transform-origin: left; }
.stat-card:hover .stat-value { transform: scale(1.1); }
.stat-card h3 { margin-top: .75rem; font: 600 1.125rem/1.3 var(--font-display); }
.stat-card p { margin-top: .5rem; font-size: .875rem; line-height: 1.625; color: var(--muted-foreground); }
.closing-line { position: absolute; inset: auto 0 0; height: 1px; background: linear-gradient(90deg, transparent, var(--border), transparent); }

.capabilities-stage { position: relative; overflow: hidden; background: color-mix(in oklab, #100a08 91%, transparent); }
.capabilities-ambient { position: absolute; inset: 0; background: radial-gradient(circle at 44% 54%, color-mix(in oklab, #f15a24 13%, transparent), transparent 30%), linear-gradient(180deg, transparent, color-mix(in oklab, #24100a 72%, transparent), transparent); pointer-events: none; }
.section-heading { text-align: center; }
.mono-eyebrow { font: 400 .75rem/1 var(--font-mono); letter-spacing: .24em; text-transform: uppercase; color: var(--primary); }
.section-heading h2 { margin-top: 1rem; font: 800 clamp(2.25rem, 5vw, 3.75rem)/1 var(--font-display); text-transform: uppercase; }
.section-heading h2 span { color: var(--primary); }
.heading-rule { width: 6rem; height: 1px; margin: 1.5rem auto 0; background: var(--primary); }
.capabilities-grid { margin-top: 4rem; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: center; gap: 1.25rem; }
.capability-detail { text-align: right; font-family: var(--font-capabilities); animation: rise .35s ease-out both; }
.capability-counter { margin-bottom: 1.25rem; display: flex; justify-content: flex-end; align-items: center; gap: .75rem; font: .75rem/1 var(--font-mono); color: var(--primary); }
.capability-counter::after { content: ""; width: 3rem; height: 1px; background: oklch(0.7 0.2 45 / .5); }
.capability-detail .tag { font: 700 .875rem/1 var(--font-display); letter-spacing: .2em; color: var(--primary); }
.capability-detail h3 { margin-top: .75rem; white-space: pre-line; font: 700 clamp(1.5rem, 2.4vw, 1.875rem)/1.25 var(--font-display); text-transform: uppercase; }
.capability-detail .copy { margin-top: 1.25rem; font-size: 1rem; line-height: 1.625; color: oklch(0.97 0.005 70 / .6); }
@media (min-width: 1024px) {
.capability-detail-1 .copy, .capability-detail-3 .copy { max-width: 30rem; margin-left: auto; font-size: .9375rem; line-height: 1.5; }
  html[lang="es"] .capability-detail-1 .copy, html[lang="es"] .capability-detail-3 .copy { white-space: pre-line; }
}
.orbit-column { display: flex; justify-content: center; }
.capabilities-orbit { position: relative; aspect-ratio: 1; width: min(100%, 20rem); }
.capabilities-glow { position: absolute; inset: 12%; border-radius: 50%; background: #f15a24; filter: blur(72px); opacity: .2; animation: breathe 4.5s ease-in-out infinite; }
.capabilities-ring { position: absolute; border-radius: 50%; border: 1px solid oklch(0.7 0.2 45 / .2); transform-origin: center; }
.ring-slow { inset: 0; animation: spin 24s linear infinite; }
.ring-reverse { inset: 7%; border-color: oklch(0.7 0.2 45 / .4); animation: spin-reverse 18s linear infinite; }
.ring-fast { inset: 15%; border-style: dashed; border-color: oklch(0.7 0.2 45 / .5); animation: spin 13s linear infinite; }
.capabilities-node { --angle: 0deg; position: absolute; z-index: 20; left: 50%; top: 50%; width: 1.75rem; height: 1.75rem; display: grid; place-items: center; border: 1px solid oklch(0.7 0.2 45 / .4); border-radius: 50%; background: var(--background); font: .5625rem/1 var(--font-mono); color: oklch(0.97 0.005 70 / .6); transform: translate(-50%, -50%) rotate(var(--angle)) translateY(-142px) rotate(calc(var(--angle) * -1)); transition: .2s; }
.capabilities-node.active { border-color: var(--primary); background: var(--primary); color: var(--primary-foreground); }
.orbit-core { position: absolute; inset: 27%; z-index: 10; display: grid; place-items: center; border: 2px solid var(--primary); border-radius: 50%; background: var(--card); box-shadow: var(--shadow-ember); }
.orbit-core > div { width: 4rem; height: 4rem; display: grid; place-items: center; border: 1px solid oklch(0.7 0.2 45 / .7); border-radius: 50%; }
.orbit-core span { width: 1rem; height: 1rem; border-radius: 50%; background: var(--primary); }
.capability-menu { display: flex; flex-direction: column; gap: .75rem; }
.capability-menu li:nth-child(2) { margin-left: 1rem; }
.capability-menu li:nth-child(3) { margin-left: 2rem; }
.capability-menu li:nth-child(4) { margin-left: 3rem; }
@media (min-width: 1024px) {
  .capability-detail { justify-self: end; width: 100%; max-width: 24rem; }
  .capability-menu { justify-self: start; width: 100%; max-width: 24rem; }
}
.capability-button { width: 100%; min-height: 5rem; cursor: pointer; display: flex; align-items: center; justify-content: space-between; gap: 1rem; border: 0; border-left: 2px solid oklch(0.7 0.2 45 / .25); border-radius: 0; background: oklch(0.18 0.014 42 / .4); padding: 1rem 1.25rem; text-align: left; color: oklch(0.97 0.005 70 / .5); transition: .3s; }
.capability-button:hover { transform: translateY(-.25rem); border-color: oklch(0.7 0.2 45 / .7); background: oklch(0.18 0.014 42 / .8); color: var(--foreground); }
.capability-button.active { border-color: var(--primary); background: var(--card); color: var(--foreground); }
.capability-button small { display: block; font: .625rem/1 var(--font-mono); color: oklch(0.7 0.2 45 / .8); }
.capability-button strong { display: block; margin-top: .25rem; white-space: normal; font: 700 1.25rem/1.25 var(--font-display); text-transform: uppercase; }
.capability-button .arrow { flex: 0 0 auto; font-size: 1.25rem; color: var(--primary); transition: .3s; }
.capability-button:hover .arrow { transform: translate(.25rem, -.25rem); }

.industries { position: relative; }
.industries-eyebrow { text-align: center; font-size: .75rem; font-weight: 600; letter-spacing: .3em; text-transform: uppercase; color: var(--amber-line); }
.industries h2 { max-width: 42rem; margin: 1rem auto 0; text-align: center; font: 900 clamp(2.25rem, 4vw, 3rem)/1.25 var(--font-display); }
.industry-tabs { margin-top: 3rem; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: .75rem 2rem; border-bottom: 1px solid var(--border); }
.industry-tabs button { position: relative; margin-bottom: -1px; cursor: pointer; border: 0; background: transparent; padding: 0 0 1rem; font-size: .875rem; color: var(--muted-foreground); transition: .2s; }
.industry-tabs button:hover { color: oklch(0.97 0.005 70 / .8); }
.industry-tabs button.active { font-weight: 600; color: var(--foreground); }
.industry-tabs button.active::after { content: ""; position: absolute; inset: auto 0 0; height: 2px; border-radius: 999px; background: var(--gradient-flame); }
.industry-showcase { margin-top: 3rem; display: grid; grid-template-columns: 1fr 2fr 1fr; align-items: stretch; gap: 1rem; }
.industry-card { position: relative; min-height: 26rem; overflow: hidden; border: 1px solid var(--border); border-radius: 1.5rem; }
.industry-card::before { content: ""; position: absolute; inset: 0; background: var(--gradient-molten); }
.industry-card::after { content: ""; position: absolute; inset: 0; background: radial-gradient(90% 70% at 50% 0%, oklch(0.14 0.012 40 / .75), transparent); }
.industry-card.side { opacity: .4; }
.side-name { position: absolute; z-index: 1; inset: auto 1.5rem 1.5rem; font: 900 1.25rem/1 var(--font-display); color: oklch(0.97 0.005 70 / .6); }
.industry-center-content { position: relative; z-index: 1; height: 100%; display: flex; flex-direction: column; justify-content: space-between; padding: 2rem; }
.industry-center-content h3 { font: 900 1.875rem/1.2 var(--font-display); }
.industry-copy { max-width: 28rem; margin-top: .75rem; font-size: .875rem; line-height: 1.625; color: oklch(0.97 0.005 70 / .7); }
.industry-copy strong { display: block; width: fit-content; font-size: 1.5rem; line-height: 1.25; text-decoration: underline; color: var(--amber-line); }
.industry-copy span { display: block; margin-top: .75rem; white-space: pre-line; }
.industry-image { width: 100%; max-width: 28rem; margin: 2.5rem auto 0; overflow: hidden; border: 1px solid var(--border); border-radius: 1rem; background: var(--gradient-molten); box-shadow: var(--shadow-card); }
.industry-image img { width: 100%; height: 100%; aspect-ratio: 4/3; object-fit: cover; }
.industry-image img.asset-missing { opacity: 0; }

.testimonials { position: relative; overflow: hidden; }
.testimonial-glow { position: absolute; top: 0; width: 26rem; height: 26rem; border-radius: 50%; filter: blur(130px); }
.testimonial-glow-left { left: -8rem; top: 2.5rem; background: oklch(0.64 0.22 38 / .2); }
.testimonial-glow-right { right: -8rem; background: oklch(0.76 0.19 58 / .15); }
.testimonial-title { max-width: 42rem; margin: auto; text-align: center; font: 900 clamp(1.875rem, 4vw, 3rem)/.95 var(--font-display); letter-spacing: -.025em; text-transform: uppercase; }
.testimonial-main-title { display: inline-block; white-space: nowrap; font: inherit; letter-spacing: inherit; color: inherit; text-decoration: none; }
.testimonial-title > .testimonial-tagline { font-size: .65em; color: #f97316; text-decoration: underline; }
.testimonial-subtitle { max-width: 28rem; margin: 1.5rem auto 0; text-align: center; font-size: 1.125rem; white-space: pre-line; color: oklch(0.97 0.005 70 / .7); }
.testimonial-subtitle .testimonial-badge { display: inline-flex; font-size: .75rem; line-height: 1; text-decoration: none; color: var(--flame); }
.client-marquee { margin-top: 3rem; overflow: hidden; border-block: 1px solid oklch(0.3 0.018 45 / .5); padding-block: 1.75rem; mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.client-marquee-track { display: flex; width: max-content; align-items: center; gap: 4rem; padding-right: 4rem; animation: client-marquee 28s linear infinite; will-change: transform; }
.client-marquee-track:hover { animation-play-state: paused; }
.client-marquee-track li { display: flex; min-width: 10rem; align-items: center; justify-content: center; }
.client-marquee-track img { width: auto; height: 2.5rem; max-width: 9rem; object-fit: contain; opacity: .6; }
.client-marquee-track img[src*="logo-campanario"] { height: 6rem; max-width: 18rem; }
.client-marquee-track img[src*="logo-cuprum"], .client-marquee-track img[src*="logo-hitec"] { height: 5rem; max-width: 15rem; }
.client-marquee-track img[src*="logo-cuprum"] { height: 7rem; max-width: 21rem; opacity: .9; }
.client-marquee-track img.asset-missing { display: none; }
.kelly-logo { font: 700 1.875rem/1 var(--font-display); color: oklch(0.97 0.005 70 / .6); }
.case-studies { margin-top: 4rem; }
.case-study { display: grid; grid-template-columns: minmax(0, 18rem) 1fr; align-items: center; gap: 2rem; border-top: 1px solid oklch(0.3 0.018 45 / .6); padding-block: 3rem; }
.case-study:first-child { border-top: 0; }
.case-metric { font: 900 clamp(3.75rem, 6vw, 4.5rem)/1 var(--font-display); background: var(--gradient-flame); background-clip: text; -webkit-background-clip: text; color: transparent; }
.metric-label { max-width: 16rem; margin-top: .75rem; font-size: .875rem; color: var(--muted-foreground); }
.case-study blockquote { font-size: 1.25rem; line-height: 1.625; color: oklch(0.97 0.005 70 / .85); }
.case-person { margin-top: 1.5rem; display: flex; flex-wrap: wrap; align-items: center; gap: .75rem 1.5rem; }
.case-person strong { display: block; font-size: .875rem; }
.case-person small { display: block; margin-top: .125rem; font-size: .75rem; color: var(--muted-foreground); }
.case-tags { display: flex; flex-wrap: wrap; gap: .5rem; }
.case-tags span { border: 1px solid oklch(0.78 0.16 62 / .5); border-radius: 999px; padding: .25rem .75rem; font-size: .6875rem; color: var(--amber-line); }

.faq-content { width: min(100% - 3rem, 48rem); margin: auto; }
.faq h2 { text-align: center; font: 900 clamp(2.25rem, 5vw, 3rem)/.95 var(--font-display); letter-spacing: -.025em; text-transform: uppercase; }
.faq ul { margin-top: 3rem; }
.faq li { border-bottom: 1px solid var(--border); }
.faq button { width: 100%; cursor: pointer; display: flex; justify-content: space-between; align-items: center; gap: 1.5rem; border: 0; background: transparent; padding-block: 1.25rem; text-align: left; font: 700 1.125rem/1.3 var(--font-display); transition: .2s; }
.faq button:hover { color: var(--amber-line); }
.faq .plus { flex: 0 0 auto; font: 400 1.25rem/1 var(--font-sans); color: var(--amber-line); transition: .2s; }
.faq button[aria-expanded="true"] .plus { transform: rotate(45deg); }
.faq-answer { display: none; padding: 0 2.5rem 1.5rem 0; font-size: 1rem; line-height: 1.625; color: oklch(0.97 0.005 70 / .7); }
.faq button[aria-expanded="true"] + .faq-answer { display: block; animation: rise .35s ease-out both; }

.demo-cta { position: relative; overflow: hidden; }
.cta-video, .cta-dimmer { mask-image: linear-gradient(to bottom, transparent 0%, #000 20%, #000 85%, transparent 100%); -webkit-mask-image: linear-gradient(to bottom, transparent 0%, #000 20%, #000 85%, transparent 100%); }
.cta-dimmer { background: oklch(0.14 0.012 40 / .5); }
.cta-inner { position: relative; max-width: 48rem; margin: auto; padding: 9rem 1.5rem; text-align: center; display: flex; flex-direction: column; align-items: center; }
.cta-inner h2 { font: 900 clamp(3rem, 7vw, 4.5rem)/.95 var(--font-display); letter-spacing: -.025em; }
.cta-inner h2 span { color: var(--primary); }
.cta-inner a { margin-top: 3rem; display: inline-flex; align-items: center; gap: .75rem; border-radius: 999px; background: var(--primary); padding: 1.25rem 3rem; font: 700 .875rem/1 var(--font-mono); letter-spacing: .12em; text-transform: uppercase; color: var(--primary-foreground); box-shadow: var(--shadow-ember); transition: .2s; }
.cta-inner a:hover { transform: scale(1.03); }
.cta-inner p { margin-top: 1.25rem; font: .75rem/1.4 var(--font-mono); color: oklch(0.97 0.005 70 / .5); }

.footer-inner { width: min(100% - 3rem, 80rem); margin: auto; padding-block: 2.5rem; display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.footer-wordmark { font-size: .875rem; }
.social-links { display: flex; align-items: center; gap: 1.5rem; }
.social-links a { opacity: .7; transition: .2s; }
.social-links a:hover { opacity: 1; }
.social-links img { width: auto; height: 1.5rem; object-fit: contain; }
.social-links img.asset-missing { width: 1.5rem; opacity: 0; }
.footer-inner > p { font-size: .75rem; color: var(--muted-foreground); }

.mesh-bg { position: fixed; inset: -20vmax; z-index: -1; overflow: hidden; pointer-events: none; background: var(--background); transform: translate3d(0, var(--mesh-parallax, 0), 0); will-change: transform; contain: strict; }
.mesh-blob { position: absolute; border-radius: 50%; filter: blur(110px); opacity: .4; will-change: transform; }
.mesh-blob-1 { top: 4%; left: 2%; width: 62vmax; height: 58vmax; background: radial-gradient(circle, oklch(0.52 0.2 42 / .7), transparent 68%); animation: drift-a 47s ease-in-out infinite alternate; }
.mesh-blob-2 { top: -6%; right: 0; width: 55vmax; height: 52vmax; background: radial-gradient(circle, oklch(0.5 0.16 68 / .6), transparent 68%); animation: drift-b 61s ease-in-out infinite alternate; }
.mesh-blob-3 { bottom: 2%; left: 22%; width: 68vmax; height: 60vmax; background: radial-gradient(circle, oklch(0.45 0.19 32 / .6), transparent 70%); animation: drift-c 73s ease-in-out infinite alternate; }
.mesh-blob-4 { right: 8%; bottom: -10%; width: 50vmax; height: 50vmax; background: radial-gradient(circle, oklch(0.48 0.13 80 / .5), transparent 68%); animation: drift-d 89s ease-in-out infinite alternate; }
.mesh-blob-5 { top: 30%; left: 38%; width: 46vmax; height: 44vmax; background: radial-gradient(circle, oklch(0.4 0.12 50 / .5), transparent 70%); animation: drift-e 103s ease-in-out infinite alternate; }
@keyframes pulse-glow { 0%,100% { opacity: .55; } 50% { opacity: 1; } }
@keyframes message-in { from { opacity: 0; transform: translateY(.75rem) scale(.85); } }
@keyframes typing-dot { 0%, 60%, 100% { transform: none; opacity: .35; } 30% { transform: translateY(-.25rem); opacity: 1; } }
@keyframes action-shimmer { from { background-position: 150% 0; } to { background-position: -50% 0; } }
@keyframes action-ping { from { box-shadow: 0 0 0 0 oklch(0.78 0.16 62 / .6); } to { box-shadow: 0 0 0 .4rem oklch(0.78 0.16 62 / 0); } }
@keyframes chat-clear { to { opacity: 0; transform: translateY(-.625rem); } }
@keyframes rise { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
@keyframes spin { to { transform: rotate(360deg); } }
@keyframes spin-reverse { to { transform: rotate(-360deg); } }
@keyframes breathe { 50% { opacity: .38; transform: scale(1.08); } }
@keyframes drift-a { 50% { transform: translate3d(8vmax,6vmax,0) scale(1.12); } 100% { transform: translate3d(-5vmax,10vmax,0) scale(.95); } }
@keyframes drift-b { 0% { transform: scale(1.05); } 50% { transform: translate3d(-9vmax,8vmax,0) scale(.92); } 100% { transform: translate3d(-4vmax,-6vmax,0) scale(1.1); } }
@keyframes drift-c { 0% { transform: scale(.98); } 50% { transform: translate3d(10vmax,-7vmax,0) scale(1.1); } 100% { transform: translate3d(-7vmax,-3vmax,0); } }
@keyframes drift-d { 50% { transform: translate3d(-11vmax,-9vmax,0) scale(1.15); } 100% { transform: translate3d(6vmax,-4vmax,0) scale(.94); } }
@keyframes drift-e { 0% { transform: scale(1.08); } 50% { transform: translate3d(7vmax,9vmax,0) scale(.9); } 100% { transform: translate3d(-8vmax,5vmax,0) scale(1.06); } }
@keyframes client-marquee { from { transform: translate3d(0, 0, 0); } to { transform: translate3d(-33.333333%, 0, 0); } }

@media (max-width: 1023px) {
  .desktop-note { display: none; }
  .mobile-notes { display: grid; }
  .capabilities-grid { grid-template-columns: 1fr; gap: 3rem; }
  .orbit-column { order: 1; }
  .capability-detail { order: 2; text-align: left; }
  .capability-counter { justify-content: flex-start; }
  .capability-menu { order: 3; }
  .capability-menu li { margin-left: 0 !important; }
  .industry-showcase { grid-template-columns: 1fr; }
  .industry-card.side { display: none; }
}
@media (max-width: 767px) {
  .nav-shell { position: relative; width: calc(100% - 2rem); display: flex; justify-content: space-between; gap: .5rem; }
  .nav-toggle { display: block; }
  .nav-links { position: absolute; top: calc(100% - .75rem); left: 0; right: 0; flex-direction: column; align-items: stretch; gap: .125rem; border-color: oklch(0.97 0.005 70 / .12); border-radius: 1.25rem; background: oklch(0.14 0.012 40 / .92); padding: .5rem; box-shadow: var(--shadow-card); opacity: 0; visibility: hidden; transform: translateY(-.5rem); transition: opacity .2s ease, transform .2s ease, visibility 0s linear .2s; }
  .site-header.is-menu-open .nav-links { opacity: 1; visibility: visible; transform: none; transition: opacity .2s ease, transform .2s ease; }
  .nav-links a { padding: .9rem 1rem; font-size: .8125rem; }
  .nav-actions { gap: .4rem; }
  .nav-cta { padding-inline: .8rem; font-size: .65rem; }
  .language-toggle button { padding-inline: .55rem; }
  .stats-grid { grid-template-columns: 1fr; }
  .capabilities-node { transform: translate(-50%, -50%) rotate(var(--angle)) translateY(-114px) rotate(calc(var(--angle) * -1)); }
  .case-study { grid-template-columns: 1fr; }
  .footer-inner { flex-direction: column; gap: 1.5rem; text-align: center; }
}
@media (max-width: 420px) {
  .wordmark { font-size: 1rem; }
  .nav-actions { gap: .3rem; }
  .nav-cta { padding-inline: .7rem; letter-spacing: .06em; }
}
@media (max-width: 639px) {
  .section-pad { padding-block: 7rem; }
  .hero-inner { padding-top: 8rem; }
  .hero-inner h1 { font-size: 2.25rem; }
  .hero-subtitle { font-size: .875rem; }
  .phone-wrap { width: min(380px, 92vw); }
  .phone-screen { height: min(680px, 80vh); }
  .centered-heading h2 { max-width: 100%; font-size: clamp(1.75rem, 9vw, 2.75rem); overflow-wrap: anywhere; }
  .testimonial-title { font-size: clamp(1.25rem, 5.5vw, 2rem); }
  .testimonial-main-title { display: block; width: 100%; white-space: normal; }
  .industry-center-content { padding: 1.5rem; }
  .client-marquee-track { gap: 2rem; padding-right: 2rem; animation-duration: 24s; }
  .client-marquee-track li { min-width: 8rem; }
  .client-marquee-track img { height: 2rem; }
  .client-marquee-track img[src*="logo-campanario"] { height: 4.75rem; max-width: 14rem; }
  .client-marquee-track img[src*="logo-cuprum"], .client-marquee-track img[src*="logo-hitec"] { height: 4rem; max-width: 12rem; }
  .client-marquee-track img[src*="logo-cuprum"] { height: 5.5rem; max-width: 16rem; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; }
  .mesh-bg { transform: none !important; }
  .client-marquee-track { animation: none; transform: none; }
}

/* Animated line field behind the capabilities section. */
.capabilities-stage .capabilities-ambient { z-index: 0; }
.fx-waves { position: absolute; inset: 0; z-index: 1; overflow: hidden; pointer-events: none; -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 14%, #000 86%, transparent 100%); mask-image: linear-gradient(180deg, transparent 0%, #000 14%, #000 86%, transparent 100%); }
.fx-waves-svg { display: block; width: 100%; height: 100%; overflow: visible; }
.fx-waves-svg path { fill: none; stroke: #f15a24; stroke-width: 1; stroke-opacity: .2; stroke-linecap: round; vector-effect: non-scaling-stroke; }
.capabilities-stage .content { z-index: 2; }
@media (max-width: 767px) {
  .fx-waves-svg path { stroke-opacity: .16; }
}
@media (prefers-reduced-motion: reduce) {
  .fx-waves-svg path { stroke-opacity: .14; }
}

/* Floating WhatsApp button. */
.whatsapp-float { position: fixed; right: max(1.5rem, env(safe-area-inset-right)); bottom: max(1.5rem, env(safe-area-inset-bottom)); z-index: 60; display: flex; align-items: center; gap: 0; height: 3.5rem; padding: .375rem; border: 1px solid oklch(0.78 0.16 62 / .6); border-radius: 999px; background: color-mix(in oklab, var(--card) 70%, transparent); color: var(--foreground); box-shadow: var(--shadow-ember), var(--shadow-card); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); transition: gap .3s ease, border-color .2s ease, transform .2s ease; animation: whatsapp-in .5s ease-out .8s both; }
.whatsapp-float::before { content: ""; position: absolute; left: .375rem; top: .375rem; width: 2.75rem; height: 2.75rem; border-radius: 50%; background: var(--ember); opacity: .5; z-index: -1; animation: whatsapp-ping 2.6s ease-out infinite; }
.whatsapp-icon { display: grid; place-items: center; width: 2.75rem; height: 2.75rem; flex: 0 0 auto; border-radius: 50%; background: var(--gradient-flame); color: var(--primary-foreground); }
.whatsapp-icon svg { width: 1.5rem; height: 1.5rem; }
.whatsapp-label { max-width: 0; overflow: hidden; white-space: nowrap; font-size: .75rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; transition: max-width .35s ease, padding .35s ease; }
.whatsapp-float:hover, .whatsapp-float:focus-visible { gap: .25rem; border-color: var(--amber-line); transform: translateY(-2px); }
.whatsapp-float:hover .whatsapp-label, .whatsapp-float:focus-visible .whatsapp-label { max-width: 12rem; padding-inline: .5rem .875rem; }
.whatsapp-float:focus-visible { outline: 2px solid var(--flame); outline-offset: 3px; }
@keyframes whatsapp-ping { 0% { transform: scale(1); opacity: .5; } 70%, 100% { transform: scale(1.7); opacity: 0; } }
@keyframes whatsapp-in { from { opacity: 0; transform: translateY(1rem) scale(.9); } to { opacity: 1; transform: none; } }
@media (max-width: 767px) {
  .whatsapp-float { right: max(1rem, env(safe-area-inset-right)); bottom: max(1rem, env(safe-area-inset-bottom)); }
}
@media (prefers-reduced-motion: reduce) {
  .whatsapp-float::before { animation: none; opacity: 0; }
}