@font-face {
  font-family: Onest;
  src: url('assets/onest-latin.woff2') format('woff2');
  font-weight: 100 900;
  font-display: swap;
}
:root {
  color-scheme: dark;
  --base: #07051f;
  --ink: #f6f4fb;
  --muted: #c9c4dc;
  --blue: #2f6fef;
  --violet: #6a3ef2;
  --magenta: #c43bc7;
  --brand: linear-gradient(150deg, var(--blue), var(--violet) 49%, var(--magenta));
  --secondary: linear-gradient(125deg, var(--blue), var(--violet));
  --glass: rgba(192, 182, 255, .09);
  --line: rgba(209, 195, 255, .18);
  --header-height: 64px;
}
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: calc(var(--header-height) + 12px); }
body {
  margin: 0;
  background: var(--base);
  color: var(--ink);
  font: 400 1rem/1.6 Onest, sans-serif;
}
h1, h2, h3, p, figure, blockquote { margin: 0; }
a { color: inherit; text-decoration: none; }
button, summary { font: inherit; color: inherit; cursor: pointer; }
img { display: block; max-width: 100%; }
:focus-visible { outline: 2px solid #a5bcff; outline-offset: 4px; }
.container { width: min(100% - 72px, 1140px); margin-inline: auto; }
.icon-library { position: absolute; width: 0; height: 0; overflow: hidden; pointer-events: none; }
.icon {
  width: 1.15em;
  height: 1.15em;
  flex: none;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.skip-link {
  position: fixed;
  z-index: 10;
  left: 12px;
  top: 12px;
  transform: translateY(-180%);
  padding: 8px 14px;
  border-radius: 6px;
  background: var(--ink);
  color: var(--base);
}
.skip-link:focus { transform: translateY(0); }

.site-header {
  position: sticky;
  z-index: 5;
  top: 0;
  border-bottom: 1px solid #272342;
  background: #0f0c2c;
  isolation: isolate;
}
.header-inner {
  position: relative;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  min-height: var(--header-height);
  align-items: center;
  gap: 16px;
}
.brand { display: inline-flex; width: max-content; align-items: center; gap: 10px; }
.brand-mark, .brand-word { object-fit: contain; }
.brand-word-header { position: relative; display: block; width: 111px; height: 12px; background: url('assets/wordmark.webp') center / contain no-repeat; }
.brand-word-header::after { content: ""; position: absolute; inset: 0; background: linear-gradient(120deg, #6a3ef2 5%, #c43bc7 70%); -webkit-mask: url('assets/wordmark.webp') center / contain no-repeat; mask: url('assets/wordmark.webp') center / contain no-repeat; clip-path: inset(0 0 0 82%); }
.navigation { display: flex; gap: 27px; align-items: center; font-size: .88rem; font-weight: 550; }
.navigation a, .footer-contact { transition: color .18s ease; }
.navigation a:hover, .footer-contact:hover { color: #b3c8ff; }
.header-contact { justify-self: end; }
.menu-toggle, .mobile-contact { display: none; }

.glass {
  border: 1px solid var(--line);
  background: var(--glass);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .14);
  backdrop-filter: blur(14px);
}
.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .65em;
  min-height: 48px;
  padding: 0 23px;
  border-radius: 10px;
  font-weight: 650;
  font-size: .88rem;
  text-align: center;
  transition: box-shadow .2s ease, background-color .2s ease, border-color .2s ease;
}
.button:hover { border-color: rgba(191, 183, 255, .57); }
.button.primary, .header-contact {
  background: linear-gradient(rgba(9, 7, 45, .26), rgba(9, 7, 45, .26)), var(--secondary);
}
.button.primary {
  border-color: rgba(173, 178, 255, .68);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.31), 0 0 20px rgba(106, 62, 242, .35);
}
.button.primary:hover { box-shadow: inset 0 1px 0 rgba(255,255,255,.39), 0 0 28px rgba(106, 62, 242, .62); }
.button.secondary:hover { background-color: rgba(179, 163, 255, .15); }
.button.header-contact { min-height: 38px; padding-inline: 17px; border-radius: 999px; }

main { overflow: clip; }
.brand-stage { position: relative; isolation: isolate; overflow: clip; }
.ambient, .ribbon { position: absolute; inset: 0; z-index: -1; pointer-events: none; }
.ambient {
  background:
    radial-gradient(ellipse 69% 23% at 99% 1%, rgba(47, 111, 239, .26), transparent 82%),
    radial-gradient(ellipse 55% 25% at 59% 17%, rgba(106, 62, 242, .18), transparent 82%),
    radial-gradient(ellipse 46% 15% at 72% 54%, rgba(196, 59, 199, .075), transparent 88%);
}
.ribbon { width: 100%; height: 100%; }
.ribbon use { fill: none; stroke: url(#ribbon-colors); stroke-linecap: round; }
.ribbon-halo { stroke-width: 48; opacity: .39; filter: blur(19px); }
.ribbon-line { stroke-width: 2; opacity: .39; }
.ribbon-glint { stroke-width: 4; opacity: .76; stroke-dasharray: 20 980; animation: ribbon-travel 14s linear infinite; }
.motion-ready .ribbon-line, .motion-ready .ribbon-halo { stroke-dasharray: 1000; stroke-dashoffset: var(--ribbon-offset, 690); }

.hero { padding-block: 130px 83px; min-height: 740px; display: grid; align-items: center; }
.hero-layout { display: grid; align-items: center; grid-template-columns: 1.03fr .97fr; gap: 30px; }
.hero-content { position: relative; z-index: 1; }
.hero h1 {
  width: max-content;
  max-width: 100%;
  font-size: clamp(3.4rem, 5.5vw, 5rem);
  font-weight: 770;
  letter-spacing: -.057em;
  line-height: 1.12;
}
.hero h1 span {
  display: block;
  background: linear-gradient(180deg, var(--blue) 0%, var(--violet) 30%, var(--magenta) 100%);
  background-size: 100% 300%;
  color: transparent;
  background-clip: text;
}
.hero h1 span:nth-child(2) { background-position: 0 50%; }
.hero h1 span:nth-child(3) { background-position: 0 100%; }
.hero-copy { margin-top: 25px; }
.hero h2 { font-size: clamp(1.52rem, 2.4vw, 1.95rem); line-height: 1.37; letter-spacing: -.031em; font-weight: 690; }
.hero p { max-width: 495px; margin-top: 17px; color: var(--muted); font-size: 1.06rem; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 24px; }
.hero-actions .button { min-width: 185px; }
.mobile-label,
.mobile-copy { display: none; }
.hero-art { position: relative; display: grid; place-items: center; align-self: stretch; }
.hero-art::before {
  position: absolute;
  inset: 17% 2%;
  content: "";
  background: var(--brand);
  border-radius: 50%;
  filter: blur(88px);
  opacity: .18;
}
.hero-art img {
  position: relative;
  width: min(78%, 365px);
  height: auto;
  filter: drop-shadow(0 0 35px rgba(106, 62, 242, .33));
}
.motion-ready .hero h1 span { animation: word-in .68s cubic-bezier(.19,.8,.23,1) both; }
.motion-ready .hero h1 span:nth-child(2) { animation-delay: .12s; }
.motion-ready .hero h1 span:nth-child(3) { animation-delay: .24s; }
.motion-ready .hero-copy { animation: mist-in .86s .41s ease both; }
.motion-ready .hero-art img { animation: mark-in 1.15s .19s ease both; }

.section { padding-block: 94px; }
.section-head h2, .cta h2 {
  font-size: clamp(1.97rem, 3.45vw, 2.55rem);
  letter-spacing: -.043em;
  line-height: 1.23;
  font-weight: 735;
}
.section-head .label + h2 { margin-top: 25px; }
.centered { text-align: center; }
.label {
  display: inline-flex;
  align-items: center;
  min-height: 33px;
  padding: 4px 15px;
  border-radius: 999px;
  background: linear-gradient(110deg, rgba(47,111,239,.27), rgba(106,62,242,.31));
  font-size: .69rem;
  font-weight: 800;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.services, .testimonials, .process { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 26px; }
.services { margin-top: 39px; text-align: center; }
.services img { margin: 0 auto 22px; width: min(100%, 185px); height: auto; }
.services h3 { margin-bottom: 8px; font-size: clamp(1.04rem, 1.55vw, 1.3rem); line-height: 1.3; letter-spacing: -.025em; }
.services p { max-width: 310px; margin-inline: auto; color: var(--muted); }

.benefits-layout { display: grid; grid-template-columns: 1fr 1.03fr; gap: 72px; align-items: center; }
.benefits-intro { margin-top: 23px; max-width: 500px; color: var(--muted); }
.benefits-intro span { color: #e9ccff; }
.benefits-list, .industry-scene, .process { margin: 0; padding: 0; list-style: none; }
.benefits-list { display: grid; gap: 14px; }
.benefit {
  display: flex;
  align-items: center;
  gap: 18px;
  min-height: 94px;
  padding: 14px 20px;
  border: 1px solid rgba(157, 147, 234, .13);
  border-right-color: transparent;
  border-radius: 13px;
  background: linear-gradient(105deg, rgba(47,111,239,.17), rgba(106,62,242,.11) 70%, transparent);
}
.benefit-icon {
  display: grid;
  width: 48px;
  height: 48px;
  flex: none;
  place-items: center;
  border-radius: 13px;
  border: 1px solid rgba(171,168,255,.22);
  background: rgba(109, 94, 251, .19);
  color: #a9bcff;
  font-size: 1.55rem;
}
.benefit:nth-child(2) .benefit-icon { color: #c0abff; }
.benefit:nth-child(3) .benefit-icon { color: #e5aaff; }
.benefit p { line-height: 1.4; }
.benefit strong, .benefit p span { display: block; }
.benefit p span { margin-top: 5px; color: var(--muted); font-size: .91rem; }

.industry-scene {
  position: relative;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px 105px;
  width: min(100%, 650px);
  margin: 28px auto 0;
}
.industry {
  display: grid;
  justify-items: center;
  text-align: center;
  min-width: 0;
  align-content: start;
  --reveal-x: -35px;
}
.industry:nth-child(even) { translate: 0 38px; --reveal-x: 35px; }
.industry img { width: 139px; height: 139px; object-fit: contain; }
.industry span {
  z-index: 1;
  margin-top: -15px;
  padding: 8px 17px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: rgba(30, 24, 58, .95);
  font-size: .87rem;
  font-weight: 620;
}
#sectores { padding-bottom: 125px; }

.example-note { margin-top: 13px; color: var(--muted); font-size: .69rem; font-weight: 680; letter-spacing: .1em; text-transform: uppercase; }
.testimonials { margin-top: 24px; }
.testimonial {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 22px;
  min-height: 188px;
  padding: 23px;
  border: 1px solid rgba(209, 195, 255, .12);
  border-radius: 12px;
  background: var(--glass);
}
.testimonial figcaption { display: flex; align-items: center; gap: 12px; font-size: .89rem; }
.testimonial small { display: block; font-size: .81rem; color: var(--muted); }
.avatar {
  display: grid;
  flex: none;
  width: 41px;
  height: 41px;
  overflow: hidden;
  place-items: center;
  border: 1px solid rgba(209, 195, 255, .42);
  border-radius: 50%;
  background: var(--secondary);
  box-shadow: 0 0 12px rgba(106, 62, 242, .28);
  font-size: 1.25rem;
}
.avatar img { width: 100%; height: 100%; object-fit: cover; }

.process { position: relative; margin-top: 44px; }
.process::before {
  position: absolute;
  top: 53px;
  left: 16.6%;
  right: 16.6%;
  height: 1px;
  content: "";
  background: var(--brand);
  opacity: .35;
}
.step { position: relative; text-align: center; }
.step-number {
  display: inline-grid;
  width: 83px;
  height: 83px;
  place-items: center;
  margin-top: 11px;
  border: 1px solid rgba(149, 135, 250, .25);
  border-radius: 23px;
  background: #141039;
  color: #aa96ff;
  font-size: 2.65rem;
  line-height: 1;
  font-weight: 700;
}
.step:nth-child(2) .step-number { color: #be9bff; }
.step:nth-child(3) .step-number { color: #dca0f1; }
.step h3 { margin: 15px 0 7px; font-weight: 650; font-size: 1.45rem; letter-spacing: -.035em; }
.step p { max-width: 285px; margin-inline: auto; color: var(--muted); font-size: .94rem; }

.faq-container { max-width: 720px; }
.faq-list { display: grid; gap: 12px; margin-top: 43px; }
details { border: 1px solid var(--line); border-radius: 12px; background: var(--glass); }
details[open] { border-color: rgba(166,151,255,.36); }
summary {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  min-height: 54px;
  padding: 13px 19px;
  list-style: none;
  font-size: .94rem;
  font-weight: 590;
  border-radius: inherit;
}
summary::-webkit-details-marker { display: none; }
summary .icon { transition: transform .2s ease; }
details[open] summary .icon { transform: rotate(180deg); }
details p { padding: 0 19px 17px; color: var(--muted); font-size: .93rem; }

.cta p { max-width: 635px; margin: 17px auto 25px; color: var(--muted); }
.cta .button { min-width: 216px; }
.site-footer { border-top: 1px solid var(--line); }
.footer-inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 16px;
  min-height: 116px;
  padding-block: 20px;
}
.footer-channels { display: flex; flex-wrap: wrap; gap: 8px 21px; }
.footer-contact { display: flex; align-items: center; gap: .45em; font-size: .88rem; color: var(--muted); }
.site-footer small { font-size: .75rem; color: var(--muted); }

/* Desktop: the contact row shares the CTA button's exact horizontal edges. */
@media (min-width: 881px) {
  .cta .button { width: 284px; }
  .footer-inner {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 284px minmax(0, 1fr);
  }
  .footer-inner > .brand { justify-self: start; }
  .footer-channels {
    width: max-content;
    justify-self: center;
    flex-wrap: nowrap;
    justify-content: center;
    gap: 16px;
  }
  .site-footer small { justify-self: end; }
}

.reveal { --reveal-x: 0px; --reveal-scale: 1; }
.from-right { --reveal-x: 40px; }
.pop { --reveal-scale: .965; }
.motion-ready .reveal {
  opacity: 0;
  filter: blur(6px);
  transform: translate(var(--reveal-x), 13px) scale(var(--reveal-scale));
  transition: opacity .62s ease, transform .68s cubic-bezier(.16,.78,.28,1), filter .64s ease;
}
.motion-ready .reveal.is-visible { opacity: 1; filter: none; transform: none; }
.motion-ready .reveal-group .reveal:nth-child(2) { transition-delay: 120ms; }
.motion-ready .reveal-group .reveal:nth-child(3) { transition-delay: 240ms; }

@keyframes word-in { from { opacity: 0; transform: translateX(-36px); } to { opacity: 1; transform: translateX(0); } }
@keyframes mist-in { from { opacity: 0; filter: blur(8px); transform: translateY(10px); } to { opacity: 1; filter: none; transform: translateY(0); } }
@keyframes mark-in { from { opacity: 0; translate: 0 12px; scale: .95; } to { opacity: 1; translate: 0; scale: 1; } }
@keyframes ribbon-travel { from { stroke-dashoffset: 20; } to { stroke-dashoffset: -980; } }

@media (max-width: 880px) {
  .hero { min-height: 650px; padding-block: 103px 72px; }
  .hero-layout { gap: 21px; }
  .hero-art img { width: 89%; }
  .benefits-layout { gap: 35px; }
  .section { padding-block: 76px; }
  .testimonials { gap: 14px; }
  .testimonial { padding: 17px; }
}
@media (max-width: 660px) {
  :root { --header-height: 58px; }
  .container { width: calc(100% - 36px); }
  .header-inner { grid-template-columns: 1fr auto; }
  .header-contact { display: none; }
  .menu-toggle { display: inline-grid; place-items: center; width: 38px; height: 38px; padding: 0; border-radius: 9px; font-size: 1.15rem; }
  .navigation {
    position: absolute;
    z-index: 6;
    top: calc(100% + 1px);
    right: 0;
    display: none;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    min-width: 175px;
    padding: 8px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: #171236;
    box-shadow: 0 12px 30px rgba(0,0,0,.28);
  }
  .navigation.is-open { display: flex; }
  .navigation a { display: block; padding: 8px 12px; }
  .hero { padding-block: 58px 55px; min-height: auto; }
  .hero-layout { grid-template-columns: 1fr; gap: 25px; }
  .hero h1 { font-size: clamp(2.8rem, 10.6vw, 4rem); }
  .hero p { font-size: 1rem; }
  .hero-actions { gap: 9px; }
  .hero-actions .button { flex: 1 1 138px; min-width: 0; padding-inline: 9px; font-size: .8rem; }
  .hero-art { min-height: 168px; }
  .hero-art::before { inset: 10% 22%; filter: blur(50px); }
  .hero-art img { width: min(43%, 190px); }
  .section { padding-block: 62px; }
  .section-head .label + h2 { margin-top: 19px; }
  .services, .benefits-layout, .process { grid-template-columns: 1fr; }
  .services { gap: 27px; margin-top: 21px; }
  .services img { width: 139px; margin-bottom: 7px; }
  .services p { font-size: .94rem; }
  .benefits-layout { gap: 24px; }
  .benefits-intro { margin-top: 17px; }
  .benefits-list { gap: 11px; }
  .benefit { gap: 13px; min-height: 81px; padding: 11px 12px; }
  .from-right { --reveal-x: 20px; }
  .industry-scene { gap: 10px 9px; width: min(100%, 425px); margin-top: 25px; }
  .industry img { width: min(100%, 117px); height: 117px; }
  .industry span { margin-top: -9px; padding: 6px 9px; font-size: .75rem; }
  .industry:nth-child(even) { translate: 0 27px; --reveal-x: 15px; }
  .industry:nth-child(odd) { --reveal-x: -15px; }
  #sectores { padding-bottom: 82px; }
  .testimonials {
    grid-template-columns: none;
    grid-auto-columns: min(88%, 325px);
    grid-auto-flow: column;
    gap: 12px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    padding: 2px 1px 9px;
  }
  .testimonial { min-height: 174px; scroll-snap-align: start; }
  .process { gap: 20px; margin-top: 28px; }
  .process::before { top: 24px; bottom: 27px; left: 27px; right: auto; height: auto; width: 1px; }
  .step { display: grid; grid-template-columns: 55px 1fr; align-items: start; column-gap: 16px; text-align: left; }
  .step-number { width: 55px; height: 55px; grid-row: span 2; margin: 0; border-radius: 15px; font-size: 1.8rem; }
  .step h3 { margin: 0 0 2px; font-size: 1.2rem; }
  .step p { max-width: 100%; margin: 0; }
  .faq-list { margin-top: 27px; }
  .footer-inner { align-items: flex-start; flex-direction: column; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation: none !important; transition: none !important; }
  .motion-ready .reveal { opacity: 1; filter: none; transform: none; }
  .ribbon-glint { display: none; }
}

/* Refined brand accents and frosted controls */
.brand-word-header::after { background: linear-gradient(to bottom, #a44be8 0%, #c43bc7 34%, #df45ce 70%, #f27cde 100%); }
.brand-word-footer { width: 103px; height: 11px; }
.button.primary, .button.header-contact, .cta .button { background: linear-gradient(145deg, rgba(255,255,255,.25), rgba(196,59,199,.62) 45%, rgba(118,35,155,.62)); border: 1px solid rgba(255,221,255,.55); box-shadow: inset 0 1px 2px rgba(255,255,255,.4), 0 0 14px rgba(106,62,242,.5); backdrop-filter: blur(18px) saturate(150%); animation: violet-glow 5s ease-in-out infinite alternate; }
.label.glass { background: linear-gradient(145deg, rgba(255,255,255,.2), rgba(106,62,242,.48)); border-color: rgba(245,237,255,.52); box-shadow: inset 0 1px 2px rgba(255,255,255,.33), 0 0 5px rgba(255,255,255,.35); backdrop-filter: blur(18px); }
@keyframes violet-glow { from { box-shadow: inset 0 1px 2px rgba(255,255,255,.4), -3px 0 12px rgba(106,62,242,.35); } to { box-shadow: inset 0 1px 2px rgba(255,255,255,.4), 4px 0 22px rgba(106,62,242,.7); } }
.motion-ready .benefits-list .reveal { transition-duration: 800ms; }
.motion-ready .benefits-list .reveal:nth-child(2) { transition-delay: 200ms; }
.motion-ready .benefits-list .reveal:nth-child(3) { transition-delay: 400ms; }
.hero-art img { filter: saturate(.72) hue-rotate(5deg) drop-shadow(0 0 35px rgba(106,62,242,.3)); transition: opacity .8s, filter .8s, transform .8s; }
.motion-ready .hero-art img { animation: logo-emerge 2s ease-out both; }
.motion-ready.scrolled-away .hero-art img { opacity: .15; filter: blur(24px) saturate(.6); transform: scale(1.15); }
@keyframes logo-emerge { 0% { opacity: 0; filter: blur(38px) saturate(.7); transform: scale(.8); } 55% { opacity: .75; filter: blur(16px) saturate(.7); } 100% { opacity: 1; filter: blur(0) saturate(.72) hue-rotate(5deg) drop-shadow(0 0 35px rgba(106,62,242,.3)); transform: scale(1); } }
.ambient-blob { position: fixed; z-index: 0; width: 40vw; height: 40vw; min-width: 300px; min-height: 300px; left: 32%; top: 25%; pointer-events: none; opacity: 0; border-radius: 45% 55% 65% 35%; background: radial-gradient(ellipse at 30% 30%, #182766, transparent 60%), radial-gradient(ellipse at 75% 30%, #301959, transparent 58%), radial-gradient(ellipse at 55% 75%, #43183f, transparent 60%); filter: blur(65px); transition: opacity 1.2s; animation: blob-drift 18s ease-in-out infinite alternate; }
.scrolled-away .ambient-blob { opacity: .45; }
main, .site-header, .site-footer { position: relative; } main { z-index: 1; } .site-header { z-index: 5; } .site-footer { z-index: 1; }
@keyframes blob-drift { 0% { transform: translate(-14vw,-8vh) rotate(0deg) scale(.9); border-radius: 40% 60% 35% 65%; } 50% { transform: translate(12vw,10vh) rotate(80deg) scale(1.15); border-radius: 65% 35% 58% 42%; } 100% { transform: translate(-8vw,18vh) rotate(160deg) scale(.95); border-radius: 35% 65% 45% 55%; } }
@media (prefers-reduced-motion: reduce) { .button.primary, .button.header-contact, .cta .button, .ambient-blob { animation: none; } .ambient-blob { display: none; } }

/* Contact glow and moving magenta meeting-button halo */
.site-footer { border-top: 0; }
.button.header-contact, .button.header-contact:hover { animation: none; box-shadow: inset 0 1px 2px rgba(255,255,255,.4), 0 0 10px 2px rgba(246,244,251,.65); }
.hero-actions .button.primary, .cta .button.primary { animation: magenta-orbit 6s linear infinite; }
@keyframes magenta-orbit {
  0%, 100% { box-shadow: inset 0 1px 2px rgba(255,255,255,.4), 5px 0 15px rgba(196,59,199,.8); }
  25% { box-shadow: inset 0 1px 2px rgba(255,255,255,.4), 0 5px 15px rgba(196,59,199,.8); }
  50% { box-shadow: inset 0 1px 2px rgba(255,255,255,.4), -5px 0 15px rgba(196,59,199,.8); }
  75% { box-shadow: inset 0 1px 2px rgba(255,255,255,.4), 0 -5px 15px rgba(196,59,199,.8); }
}
@media (prefers-reduced-motion: reduce) { .hero-actions .button.primary, .cta .button.primary { animation: none; box-shadow: 0 0 15px rgba(196,59,199,.65); } }

.hero-actions .button, .cta .button { font-size: 1rem; }
.industry:nth-child(odd) img { width: 139px; height: 139px; object-fit: contain; }
@media (max-width: 700px) { .industry:nth-child(odd) img { width: min(100%, 117px); height: 117px; } }

.services img { width: min(100%, 185px); height: 185px; object-fit: contain; }
.label.glass { box-shadow: inset 0 1px 2px rgba(255,255,255,.33), 0 0 8px 2px rgba(196,59,199,.7); }
.cta .button { font-size: 1.12rem; }

/* The hero symbol becomes a dark, drifting background form on scroll. */
.ribbon, .ambient-blob { display: none !important; }
.lava-layer { position: fixed; inset: 0; z-index: 0; pointer-events: none; visibility: hidden; }
.lava-layer.is-active { visibility: visible; }
.lava-layer img { position: absolute; object-fit: contain; opacity: 0; filter: blur(0) brightness(1); transition: left 1s ease-in-out, top 1s ease-in-out, width 1s ease-in-out, height 1s ease-in-out, filter 1s ease-in-out, opacity 1s ease-in-out, border-radius 1s ease-in-out; }
.lava-layer.is-floating img { left: 27vw !important; top: 17vh !important; width: 52vw !important; height: 65vh !important; opacity: .38; filter: blur(58px) brightness(.28) saturate(.9); border-radius: 48% 52% 63% 37%; }
.lava-layer.is-drifting img { animation: lava-float 23s ease-in-out infinite alternate; }
@keyframes lava-float { 0% { transform: translate(-18vw,-9vh) rotate(-16deg) scale(.9); border-radius: 42% 58% 68% 32%; } 33% { transform: translate(13vw,13vh) rotate(24deg) scale(1.13); border-radius: 60% 40% 37% 63%; } 67% { transform: translate(-11vw,24vh) rotate(-11deg) scale(1.05); border-radius: 35% 65% 55% 45%; } 100% { transform: translate(17vw,-5vh) rotate(19deg) scale(.95); border-radius: 62% 38% 41% 59%; } }
.motion-ready.scrolled-away .hero-art img { opacity: 0; filter: blur(34px) brightness(.3); transition: opacity 1s, filter 1s; }
@media (prefers-reduced-motion: reduce) { .lava-layer { display: none; } }

.motion-ready.scrolled-away .hero-art img { animation: none; }
.lava-layer.is-floating.is-drifting img { animation: lava-wander 23s ease-in-out infinite alternate; }
@keyframes lava-wander { 0% { transform: translate(0,0) rotate(0) scale(1); } 33% { transform: translate(13vw,13vh) rotate(24deg) scale(1.13); } 67% { transform: translate(-11vw,24vh) rotate(-11deg) scale(1.05); } 100% { transform: translate(17vw,-5vh) rotate(19deg) scale(.95); } }

/* Slow overlapping colour cells create the lava-lamp flow behind the page. */
.lava-layer.is-floating img { opacity: .3; filter: blur(62px) brightness(.32) saturate(.9); }
.lava-wave { position: absolute; width: 34vw; height: 38vw; min-width: 290px; min-height: 310px; opacity: 0; filter: blur(55px); border-radius: 48% 52% 63% 37% / 58% 36% 64% 42%; transition: opacity 1.2s ease; }
.lava-blue { left: 12vw; top: 23vh; background: radial-gradient(ellipse at 45% 45%, rgba(47,111,239,.32), rgba(22,41,107,.19) 45%, transparent 73%); }
.lava-violet { left: 37vw; top: 7vh; background: radial-gradient(ellipse at 55% 45%, rgba(106,62,242,.31), rgba(45,27,110,.18) 45%, transparent 73%); }
.lava-magenta { left: 52vw; top: 37vh; background: radial-gradient(ellipse at 45% 45%, rgba(196,60,183,.25), rgba(89,29,89,.16) 45%, transparent 73%); }
.lava-layer.is-drifting .lava-wave { opacity: 1; }
.lava-layer.is-drifting .lava-blue { animation: lava-blue-flow 20s ease-in-out infinite alternate; }
.lava-layer.is-drifting .lava-violet { animation: lava-violet-flow 27s ease-in-out infinite alternate; }
.lava-layer.is-drifting .lava-magenta { animation: lava-magenta-flow 24s ease-in-out infinite alternate; }
@keyframes lava-blue-flow { 0% { transform: translate(-10vw,-9vh) rotate(0deg) scale(.8); border-radius: 45% 55% 65% 35%; } 50% { transform: translate(30vw,16vh) rotate(80deg) scale(1.25); border-radius: 68% 32% 42% 58%; } 100% { transform: translate(-4vw,35vh) rotate(160deg) scale(.9); border-radius: 34% 66% 58% 42%; } }
@keyframes lava-violet-flow { 0% { transform: translate(20vw,23vh) rotate(0deg) scale(1.05); border-radius: 62% 38% 34% 66%; } 50% { transform: translate(-24vw,8vh) rotate(-75deg) scale(.85); border-radius: 38% 62% 67% 33%; } 100% { transform: translate(12vw,-20vh) rotate(-150deg) scale(1.23); border-radius: 56% 44% 39% 61%; } }
@keyframes lava-magenta-flow { 0% { transform: translate(-12vw,16vh) rotate(0deg) scale(.8); border-radius: 37% 63% 54% 46%; } 50% { transform: translate(-33vw,-26vh) rotate(55deg) scale(1.18); border-radius: 64% 36% 35% 65%; } 100% { transform: translate(9vw,6vh) rotate(125deg) scale(.92); border-radius: 43% 57% 64% 36%; } }
@media (prefers-reduced-motion: reduce) { .lava-wave { animation: none !important; } }

/* Continuous lava motion, tucked beneath the crisp S at the top. */
.lava-layer img { transition-duration: 2s; }
.lava-layer.is-floating img { opacity: .27; filter: blur(72px) brightness(.28) saturate(.9); }
.motion-ready.scrolled-away .hero-art img { opacity: 0; filter: blur(40px) brightness(.3); transition: opacity 2s ease, filter 2s ease; animation: none; }
.lava-layer .lava-wave { left: var(--logo-x, 75vw); top: var(--logo-y, 50vh); width: 50vw; height: 54vw; min-width: 380px; min-height: 400px; opacity: 0; transform: translate(-50%,-50%) scale(.12); animation: none !important; transition: left 2s ease, top 2s ease, width 2s ease, height 2s ease, opacity 2s ease, transform 2s ease; }
.lava-layer.is-drifting .lava-wave { opacity: 0; }
.lava-layer.is-floating.is-drifting .lava-wave { opacity: 1; transform: translate(-50%,-50%) scale(1); }
.lava-layer.is-floating .lava-blue { left: 30vw; top: 44vh; width: 60vw; height: 70vh; }
.lava-layer.is-floating .lava-violet { left: 60vw; top: 39vh; width: 65vw; height: 74vh; }
.lava-layer.is-floating .lava-magenta { left: 48vw; top: 70vh; width: 58vw; height: 65vh; }
.lava-wave::before { content: ''; display: block; width: 100%; height: 100%; border-radius: 45% 55% 65% 35%; animation: lava-pulse 17s ease-in-out infinite alternate; }
.lava-blue::before { background: radial-gradient(ellipse, rgba(28,61,137,.25), rgba(16,30,75,.13) 48%, transparent 72%); animation-duration: 8.67s; }
.lava-violet::before { background: radial-gradient(ellipse, rgba(69,39,139,.24), rgba(35,22,79,.13) 48%, transparent 72%); animation-duration: 12s; animation-delay: -6.67s; }
.lava-magenta::before { background: radial-gradient(ellipse, rgba(112,39,105,.21), rgba(61,24,69,.11) 48%, transparent 72%); animation-duration: 10s; animation-delay: -4s; }
@keyframes lava-pulse { 0% { transform: translate(-13vw,-7vh) scale(.64,1.15) rotate(-15deg); border-radius: 40% 60% 34% 66%; } 50% { transform: translate(15vw,12vh) scale(1.3,.72) rotate(35deg); border-radius: 65% 35% 62% 38%; } 100% { transform: translate(-7vw,20vh) scale(.78,1.25) rotate(-25deg); border-radius: 35% 65% 45% 55%; } }
@media (prefers-reduced-motion: reduce) { .lava-wave::before { animation: none; } }

.lava-layer.is-drifting img, .lava-layer.is-floating.is-drifting img { animation: none; }

/* The logo's exit starts from its current visible frame, even during entrance. */
.motion-ready.scrolled-away .hero-art img { transition: opacity 1s ease, filter 1s ease; }

/* Ambient colour starts two seconds after load and spans the full viewport. */
.lava-layer.ambient-on.is-drifting .lava-wave { opacity: .95; transform: translate(-50%,-50%) scale(1); }
.lava-layer.ambient-on .lava-blue { left: 22vw; top: 48vh; width: 68vw; height: 85vh; }
.lava-layer.ambient-on .lava-violet { left: 70vw; top: 33vh; width: 75vw; height: 90vh; }
.lava-layer.ambient-on .lava-magenta { left: 55vw; top: 77vh; width: 70vw; height: 82vh; }
.lava-layer.ambient-on .lava-wave::before { animation-name: lava-screen-flow; }
@keyframes lava-screen-flow {
  0% { transform: translate(-22vw,-20vh) scale(.65,1.15) rotate(-18deg); border-radius: 40% 60% 34% 66%; }
  25% { transform: translate(15vw,19vh) scale(1.35,.8) rotate(26deg); border-radius: 65% 35% 62% 38%; }
  50% { transform: translate(28vw,-13vh) scale(.8,1.3) rotate(-28deg); border-radius: 35% 65% 45% 55%; }
  75% { transform: translate(-17vw,23vh) scale(1.25,.7) rotate(38deg); border-radius: 60% 40% 68% 32%; }
  100% { transform: translate(8vw,-24vh) scale(.72,1.2) rotate(-12deg); border-radius: 43% 57% 39% 61%; }
}
@media (prefers-reduced-motion: reduce) { .lava-layer.ambient-on .lava-wave::before { animation: none; } }

/* Scroll controls only the original hero logo; the ambient waves stay separate. */
.hero-art img { transition: none; }


/* Version 3: interactive tool previews in place of the large hero symbol. */
.hero-showcase { position: relative; width: 100%; max-width: 535px; justify-self: end; align-self: center; display: grid; gap: 11px; transform: translateY(12px); }
.showcase-screen { position: relative; overflow: hidden; aspect-ratio: 16 / 9; border: 1px solid rgba(206,181,255,.44); border-radius: 19px; background: #0d0b2b; box-shadow: 0 20px 60px rgba(2,1,15,.35), 0 0 35px rgba(106,62,242,.22), inset 0 1px rgba(255,255,255,.13); }
.showcase-screen::after { content: ''; position: absolute; inset: 0; pointer-events: none; border-radius: inherit; background: linear-gradient(180deg, rgba(7,5,31,.38), transparent 26%, transparent 74%, rgba(7,5,31,.35)); }
.showcase-video { display: block; width: 100%; height: 100%; object-fit: cover; background: #080622; }
.showcase-video[hidden] { display: none; }
.showcase-label { position: absolute; z-index: 2; top: 13px; right: 13px; padding: 6px 11px; border: 1px solid rgba(196,59,199,.58); border-radius: 999px; background: rgba(15,12,44,.72); color: #cd9af1; box-shadow: 0 0 13px rgba(196,59,199,.24), inset 0 1px rgba(255,255,255,.15); backdrop-filter: blur(12px); font-size: .68rem; font-weight: 750; letter-spacing: .11em; line-height: 1; text-transform: uppercase; pointer-events: none; }
.showcase-options { display: grid; gap: 8px; }
.showcase-option { display: grid; gap: 2px; width: 100%; padding: 8px 13px; text-align: left; border: 1px solid rgba(196,185,247,.18); border-radius: 11px; background: rgba(29,23,67,.68); transition: border-color .2s, background-color .2s, transform .2s; }
.showcase-option:hover { border-color: rgba(196,59,199,.56); transform: translateX(3px); }
.showcase-option.is-selected { border-color: rgba(196,59,199,.75); background: linear-gradient(100deg, rgba(106,62,242,.25), rgba(196,59,199,.13)); box-shadow: inset 3px 0 #c43bc7, 0 0 14px rgba(196,59,199,.13); }
.showcase-option strong { color: #cd9af1; font-size: .84rem; line-height: 1.2; }
.showcase-option small { color: var(--muted); font-size: .73rem; line-height: 1.35; }
@media (max-width: 700px) { .hero-showcase { justify-self: stretch; max-width: none; transform: none; } .showcase-option { padding: 10px 12px; } }
@media (prefers-reduced-motion: reduce) { .showcase-option { transition: none; } }

/* Keep both hero columns aligned while giving the copy more vertical breathing room. */
@media (min-width: 701px) {
  .hero-layout { align-items: stretch; }
  .hero-content { display: flex; flex-direction: column; justify-content: space-between; transform: translateY(12px); }
  .hero-copy { margin-top: auto; padding-top: 42px; }
  .hero-showcase { align-self: stretch; }
}

/* Desktop: one-time, staggered mist entrance for the three headline words. */
@media (min-width: 661px) {
  .motion-ready .hero h1 span {
    animation: desktop-title-emerge .64s ease-out both;
  }
  .motion-ready .hero h1 span:nth-child(2) { animation-delay: .18s; }
  .motion-ready .hero h1 span:nth-child(3) { animation-delay: .36s; }
}

/* Version 4: mobile-only spacing, scale and testimonial scroll feedback. */
@media (max-width: 660px) {
  .desktop-label { display: none; }
  .mobile-label { display: inline; }
  .desktop-copy { display: none; }
  .mobile-copy { display: inline; }

  .hero { padding-block: 58px 51px; }
  .hero-layout { gap: 44px; }
  .section { padding-block: 51px; }
  #sectores { padding-bottom: 51px; }

  .services img { width: 125px; height: 125px; }
  .industry img,
  .industry:nth-child(odd) img { width: 100px; height: 100px; }
  .industry span { margin-top: -6px; }

  .testimonials {
    scrollbar-width: none;
    -ms-overflow-style: none;
  }
  .testimonials::-webkit-scrollbar { width: 0; height: 0; display: none; }
  .motion-ready .hero h1 span {
    animation: mobile-title-emerge .64s ease-out both;
  }
  .motion-ready .hero h1 span:nth-child(2) { animation-delay: .18s; }
  .motion-ready .hero h1 span:nth-child(3) { animation-delay: .36s; }

  .hero-copy > p {
    width: 100%;
    max-width: none;
    font-size: 1rem;
    text-align: left;
    text-align-last: left;
    text-justify: inter-word;
    text-wrap: pretty;
    hyphens: none;
    -webkit-hyphens: none;
    overflow-wrap: normal;
    word-spacing: normal;
    letter-spacing: normal;
  }

  .menu-toggle {
    color: #6a3ef2;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    backdrop-filter: none;
  }
  .menu-toggle .icon { width: 1.48em; height: 1.48em; stroke-width: 2.6; }

  .example-note { display: block; font-size: .65rem; line-height: 1.5; }

  .footer-inner {
    width: min(calc(100% - 36px), 314px);
    margin-inline: auto;
    align-items: stretch;
    gap: 18px;
  }
  .footer-inner > .brand { align-self: flex-start; }
  .footer-channels {
    width: 100%;
    flex-wrap: nowrap;
    justify-content: space-between;
    gap: 20px;
  }
  .site-footer small {
    width: 100%;
    text-align: justify;
    text-align-last: justify;
    font-size: .76rem;
    letter-spacing: -.005em;
    white-space: nowrap;
  }
}

@keyframes mobile-title-emerge {
  from { opacity: 0; filter: blur(18px); }
  to { opacity: 1; filter: blur(0); }
}

@keyframes desktop-title-emerge {
  from { opacity: 0; filter: blur(18px); }
  to { opacity: 1; filter: blur(0); }
}

@media (max-width: 660px) and (prefers-reduced-motion: reduce) {
  .motion-ready .hero h1 span { animation: none; opacity: 1; filter: none; }
}