/* 111Cloud — the core. Indigo → blue → cyan on white; a living network at the centre. */
.cloud-body {
  --lx-rgb:79,91,255;
  --lx-accent:#4f5bff;
  --lx-accent-2:#14b8d4;
  --lx-grad:linear-gradient(100deg,#6a4dff 0%,#3b6bff 45%,#14b8d4 100%);
  --lx-dark:#07091a;
}
.cloud-page .lx-orb--a {background:#dcd6ff}
.cloud-page .lx-orb--b {background:#c9f0fb}
.cloud-page .lx-orb--c {background:#d9e4ff}

/* Hero */
.cloud-hero {position:relative;padding:clamp(8rem,13vw,10.5rem) 0 clamp(4rem,7vw,6rem);isolation:isolate;overflow:hidden;background:linear-gradient(180deg,#fff 0%,#f6f7fe 70%,#fff 100%)}
.cloud-hero__bg {position:absolute;inset:0;z-index:-1;pointer-events:none}
.cloud-hero__copy {display:flex;flex-direction:column;align-items:center;text-align:center}
.cloud-page .cloud-hero__title {margin:2rem 0 1.8rem;font-size:clamp(3.2rem,7vw,7rem);line-height:1;letter-spacing:-.06em}
.cloud-hero__lead {max-width:42rem;margin-bottom:2.4rem;font-size:clamp(1.02rem,1.5vw,1.2rem);line-height:1.7;color:var(--lx-muted)}
.cloud-hero .lx-actions {justify-content:center}

/* Stage: the network */
.cloud-stage {position:relative;margin:clamp(3.5rem,7vw,5.5rem) auto 0;padding:.6rem;border-radius:2rem;background:rgba(255,255,255,.6);border:1px solid rgba(255,255,255,.9);box-shadow:0 40px 100px -30px rgba(40,50,140,.28),0 0 0 1px var(--lx-line),inset 0 1px 0 #fff;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)}
.cloud-stage__canvas {position:relative;aspect-ratio:1200/560;border-radius:1.5rem;overflow:hidden;background:radial-gradient(circle at 50% 45%,#fff 0,#f3f4ff 45%,#eef2fb 100%)}
.cloud-stage__canvas:before {content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(var(--lx-rgb),.07) 1px,transparent 1px),linear-gradient(90deg,rgba(var(--lx-rgb),.07) 1px,transparent 1px);background-size:40px 40px;mask-image:radial-gradient(circle at 50% 45%,#000 20%,transparent 75%);-webkit-mask-image:radial-gradient(circle at 50% 45%,#000 20%,transparent 75%)}
.cloud-links {position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.cloud-links__path {fill:none;stroke:url(#cloud-link-gradient);stroke-width:2.5;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:0}
.cloud-links__flow {fill:none;stroke:#fff;stroke-width:2.5;stroke-linecap:round;stroke-dasharray:.04 .12;animation:cloud-flow 2.8s linear infinite}
.cloud-links__packet {fill:#fff;stroke:var(--lx-accent);stroke-width:3;filter:drop-shadow(0 0 6px rgba(var(--lx-rgb),.8))}
.cloud-links__packet--back {fill:var(--lx-accent-2);stroke:#fff;stroke-width:2}

.cloud-core {position:absolute;left:50%;top:44.6%;width:clamp(7rem,13vw,10.5rem);aspect-ratio:1;transform:translate(-50%,-50%)}
.cloud-core__orb {position:absolute;inset:14%;display:flex;flex-direction:column;align-items:center;justify-content:center;border-radius:50%;color:#fff;background:radial-gradient(circle at 32% 28%,#a79bff 0,#5b5bff 38%,#2f55e6 62%,#0f9fc4 100%);box-shadow:inset 0 -10px 30px rgba(0,20,80,.35),inset 0 8px 20px rgba(255,255,255,.35),0 20px 50px -10px rgba(var(--lx-rgb),.6),0 0 0 8px rgba(var(--lx-rgb),.08);animation:cloud-breathe 5s ease-in-out infinite}
.cloud-core__orb b {font-size:clamp(1.3rem,2.4vw,2rem);font-weight:650;letter-spacing:-.06em;line-height:1}
.cloud-core__orb small {margin-top:.25rem;font-family:var(--lx-mono);font-size:clamp(.5rem,.8vw,.62rem);font-weight:600;letter-spacing:.3em;text-indent:.3em;text-transform:uppercase;opacity:.9}
.cloud-core__ring {position:absolute;inset:0;border-radius:50%;border:1.5px dashed rgba(var(--lx-rgb),.35);animation:lx-spin 22s linear infinite}
.cloud-core__ring--inner {inset:7%;border-style:solid;border-color:transparent;border-top-color:rgba(20,184,212,.7);border-right-color:rgba(20,184,212,.25);animation-duration:6s;animation-direction:reverse}
.cloud-core__wave {position:absolute;inset:14%;border-radius:50%;border:1.5px solid rgba(var(--lx-rgb),.45);animation:lx-pulse 3.2s ease-out infinite}
.cloud-core__wave--late {animation-delay:1.6s}

.cloud-node {position:absolute;z-index:2;display:flex;align-items:center;gap:.75rem;padding:.6rem 1rem .6rem .6rem;border-radius:1.2rem;background:rgba(255,255,255,.9);border:1px solid rgba(255,255,255,.95);box-shadow:0 18px 40px -18px rgba(30,40,120,.35),0 0 0 1px var(--lx-line);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);transform:translate(-50%,-50%);translate:var(--tx,0) var(--ty,0);transition:translate .8s var(--lx-ease),box-shadow .4s,border-color .4s}
.cloud-node:hover {box-shadow:0 24px 50px -18px rgba(var(--lx-rgb),.5),0 0 0 1px rgba(var(--lx-rgb),.3)}
.cloud-node:focus-visible {outline:3px solid var(--lx-accent);outline-offset:4px}
.cloud-node--robotics {left:15.8%;top:22.9%}
.cloud-node--kiuu {left:84.2%;top:22.9%}
.cloud-node--seekers {left:50%;top:87.9%}
.cloud-node__icon {display:grid;place-items:center;width:2.6rem;height:2.6rem;border-radius:.85rem;color:#fff;background:var(--lx-grad)}
.cloud-node--kiuu .cloud-node__icon {background:linear-gradient(135deg,#7c3aed,#936bf8)}
.cloud-node--robotics .cloud-node__icon {background:linear-gradient(135deg,#0b6cff,#00a6c7)}
.cloud-node--seekers .cloud-node__icon {background:linear-gradient(135deg,#1f2937,#476173)}
.cloud-node__icon svg {width:1.3rem;height:1.3rem;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.cloud-node__text {display:flex;flex-direction:column;line-height:1.2}
.cloud-node__text strong {font-size:.95rem;letter-spacing:-.02em}
.cloud-node__text small {font-size:.72rem;color:var(--lx-muted);white-space:nowrap}
.cloud-node__status {display:flex;align-items:center;gap:.35rem;margin-left:.4rem;padding:.25rem .5rem;border-radius:1rem;background:rgba(18,194,138,.1);font-family:var(--lx-mono);font-size:.55rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:#0b8f66}
.cloud-node__status i {width:.4rem;height:.4rem;border-radius:50%;background:#12c28a;animation:lx-blink 1.6s steps(2,jump-none) infinite}

.cloud-feed {position:absolute;z-index:3;left:2%;bottom:4%;width:min(19rem,30%);padding:.9rem;border-radius:1.2rem;background:rgba(255,255,255,.88);box-shadow:0 24px 60px -24px rgba(30,40,120,.35),0 0 0 1px var(--lx-line);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.cloud-feed__head {display:flex;justify-content:space-between;margin-bottom:.6rem;font-family:var(--lx-mono);font-size:.56rem;font-weight:600;letter-spacing:.14em;color:var(--lx-soft)}
.cloud-feed__head span:first-child {display:flex;align-items:center;gap:.4rem;color:var(--lx-accent)}
.cloud-feed__head i {width:.4rem;height:.4rem;border-radius:50%;background:var(--lx-accent);animation:lx-blink 1.2s steps(2,jump-none) infinite}
.cloud-feed ol {display:grid;gap:.35rem;margin:0;padding:0;list-style:none}
.cloud-feed li {display:grid;grid-template-columns:auto 1fr;align-items:baseline;gap:.1rem .5rem;padding:.5rem .6rem;border-radius:.7rem;background:var(--lx-surface);font-size:.72rem;line-height:1.35}
.cloud-feed li:nth-child(n+4) {display:none}
.cloud-feed li.is-new {animation:cloud-feed-in .7s var(--lx-ease)}
.cloud-feed b {font-family:var(--lx-mono);font-size:.56rem;letter-spacing:.06em;color:var(--lx-accent)}
.cloud-feed li[data-source="Kiuu"] b {color:#7c3aed}
.cloud-feed li[data-source="111Robotics"] b {color:#0b6cff}
.cloud-feed li[data-source="Seekers"] b {color:#476173}
.cloud-feed span {grid-column:1/-1;color:var(--lx-ink);font-weight:500}
.cloud-feed small {grid-row:1;grid-column:2;justify-self:end;font-size:.6rem;color:var(--lx-soft)}

/* What it is */
.cloud-what {padding-block:clamp(6rem,11vw,9.5rem)}
.cloud-what__statement {max-width:62rem;margin:0 auto clamp(3.5rem,6vw,5rem);text-align:center}
.cloud-pillars {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.1rem;margin:0;padding:0;list-style:none;perspective:1200px}
.cloud-pillar {display:flex;flex-direction:column;align-items:flex-start;gap:.3rem;min-height:24rem}
.cloud-pillar .lx-tag {margin-top:auto;padding-top:1.4rem}
.cloud-pillar__visual {position:absolute;right:1.4rem;top:1.4rem;width:7rem;height:5rem;pointer-events:none}
.cloud-pillar__visual span {position:absolute;border-radius:50%;background:var(--lx-grad);opacity:.85}
.cloud-pillar--1 .cloud-pillar__visual span {width:.7rem;height:.7rem;animation:cloud-converge 3.6s var(--lx-ease) infinite}
.cloud-pillar--1 .cloud-pillar__visual span:nth-child(1) {--fx:0;--fy:0}
.cloud-pillar--1 .cloud-pillar__visual span:nth-child(2) {--fx:6.3rem;--fy:0;animation-delay:-.4s}
.cloud-pillar--1 .cloud-pillar__visual span:nth-child(3) {--fx:3.1rem;--fy:4.3rem;animation-delay:-.8s}
.cloud-pillar--2 .cloud-pillar__visual {display:flex;align-items:flex-end;gap:.4rem}
.cloud-pillar--2 .cloud-pillar__visual span {position:static;flex:1;height:100%;border-radius:.4rem .4rem .15rem .15rem;transform-origin:50% 100%;animation:cloud-bars 2.4s ease-in-out infinite}
.cloud-pillar--2 .cloud-pillar__visual span:nth-child(2) {animation-delay:-.8s}
.cloud-pillar--2 .cloud-pillar__visual span:nth-child(3) {animation-delay:-1.6s}
.cloud-pillar--3 .cloud-pillar__visual span {right:0;top:.5rem;width:4rem;height:4rem;background:none;border:2px solid rgba(var(--lx-rgb),.4);animation:lx-pulse 2.8s ease-out infinite}
.cloud-pillar--3 .cloud-pillar__visual span:nth-child(2) {animation-delay:-.93s}
.cloud-pillar--3 .cloud-pillar__visual span:nth-child(3) {animation-delay:-1.86s}

/* How it works: sticky stack + spied layers */
.cloud-how {padding-block:clamp(5rem,9vw,8rem);background:linear-gradient(180deg,#fff,#f5f6fe 25%,#f5f6fe 75%,#fff)}
.cloud-how__grid {display:grid;grid-template-columns:1fr 1fr;gap:clamp(3rem,7vw,7rem)}
.cloud-stack {position:sticky;top:7rem;align-self:start;display:grid;place-items:center;height:min(34rem,70vh)}
.cloud-stack__scene {position:relative;width:min(100%,26rem);aspect-ratio:1;transform:rotateX(58deg) rotateZ(-40deg);transform-style:preserve-3d}
.cloud-stack__layer {position:absolute;inset:12%;border-radius:1.6rem;background:rgba(255,255,255,.85);border:1px solid rgba(var(--lx-rgb),.18);box-shadow:0 20px 40px -20px rgba(30,40,120,.35);transform:translateZ(calc((3 - var(--i)) * 3.4rem));transition:transform .8s var(--lx-ease),background .6s,border-color .6s,box-shadow .6s}
.cloud-stack__grid {position:absolute;inset:0;border-radius:inherit;background-image:linear-gradient(rgba(var(--lx-rgb),.12) 1px,transparent 1px),linear-gradient(90deg,rgba(var(--lx-rgb),.12) 1px,transparent 1px);background-size:22px 22px;opacity:.6}
.cloud-stack__label {position:absolute;left:1rem;bottom:.8rem;display:flex;align-items:center;gap:.5rem;font-size:.9rem;font-weight:650;letter-spacing:-.01em;color:var(--lx-ink)}
.cloud-stack__label b {font-family:var(--lx-mono);font-size:.62rem;color:var(--lx-accent)}
.cloud-stack__layer.is-active {background:linear-gradient(135deg,rgba(106,77,255,.92),rgba(59,107,255,.92) 50%,rgba(20,184,212,.92));border-color:transparent;box-shadow:0 40px 60px -20px rgba(var(--lx-rgb),.6);transform:translateZ(calc((3 - var(--i)) * 3.4rem + 1.4rem))}
.cloud-stack__layer.is-active .cloud-stack__grid {background-image:linear-gradient(rgba(255,255,255,.2) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.2) 1px,transparent 1px)}
.cloud-stack__layer.is-active .cloud-stack__label,.cloud-stack__layer.is-active .cloud-stack__label b {color:#fff}
.cloud-stack__beam {position:absolute;left:50%;top:50%;width:.5rem;height:.5rem;margin:-.25rem;border-radius:50%;background:#fff;box-shadow:0 0 0 4px rgba(var(--lx-rgb),.3),0 0 20px 6px rgba(20,184,212,.6);animation:cloud-beam 3.6s var(--lx-ease) infinite}
.cloud-layers {margin:0;padding:0;list-style:none}
.cloud-layers__item {display:flex;flex-direction:column;justify-content:center;min-height:min(30rem,62vh);padding:2rem 0;border-top:1px solid var(--lx-line);opacity:.35;transition:opacity .6s}
.cloud-layers__item.is-active {opacity:1}
.cloud-layers__item h3 {margin-top:1rem;font-size:clamp(2.4rem,4.5vw,4rem);line-height:1}
.cloud-layers__item h3 span {color:var(--lx-accent)}
.cloud-layers__sub {margin-top:1rem;font-size:1.15rem;font-weight:600;color:var(--lx-ink)}
.cloud-layers__item p:last-child {max-width:30rem;margin-top:.8rem;font-size:1.04rem;line-height:1.7;color:var(--lx-muted)}

/* Connected products */
.cloud-connected {padding-block:clamp(6rem,10vw,9rem)}
.cloud-products {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.1rem;perspective:1200px}
.cloud-product {--c:#0b6cff;position:relative;display:flex;flex-direction:column;padding:1.8rem;border-radius:1.8rem;background:#fff;border:1px solid var(--lx-line);box-shadow:0 30px 80px -45px rgba(30,40,120,.35);overflow:hidden;transform:rotateX(var(--rx,0)) rotateY(var(--ry,0));transition:transform .5s var(--lx-ease),box-shadow .5s,border-color .4s}
.cloud-product:before {content:"";position:absolute;inset:0;background:radial-gradient(420px circle at var(--px,50%) var(--py,0%),color-mix(in srgb,var(--c) 14%,transparent),transparent 50%);pointer-events:none}
.cloud-product:hover {border-color:color-mix(in srgb,var(--c) 30%,transparent);box-shadow:0 40px 90px -40px color-mix(in srgb,var(--c) 55%,transparent)}
.cloud-product--kiuu {--c:#7c3aed}
.cloud-product--seekers {--c:#476173}
.cloud-product__top {display:flex;align-items:center;gap:.7rem}
.cloud-product__number {font-family:var(--lx-mono);font-size:.72rem;font-weight:600;color:var(--c)}
.cloud-product__link-line {position:relative;flex:1;height:2px;border-radius:2px;background:repeating-linear-gradient(90deg,var(--lx-line) 0 6px,transparent 6px 11px);overflow:hidden}
.cloud-product__link-line i {position:absolute;top:0;left:0;width:30%;height:100%;background:linear-gradient(90deg,transparent,var(--c));animation:cloud-link 2.4s linear infinite}
.cloud-product__chip {padding:.3rem .65rem;border-radius:2rem;background:var(--lx-grad);color:#fff;font-family:var(--lx-mono);font-size:.6rem;font-weight:600;letter-spacing:.08em}
.cloud-product h3 {margin-top:2.6rem;font-size:clamp(2.2rem,3.4vw,3.2rem);line-height:1}
.cloud-product__claim {margin-top:.6rem;font-size:1.1rem;font-weight:600;color:var(--c)}
.cloud-product ul {display:grid;gap:.6rem;margin:1.8rem 0 2rem;padding:0;list-style:none}
.cloud-product li {position:relative;padding-left:1.6rem;color:var(--lx-muted);line-height:1.5}
.cloud-product li:before {content:"";position:absolute;left:0;top:.45em;width:.7rem;height:.7rem;border-radius:50%;border:2px solid var(--c);box-shadow:0 0 0 3px color-mix(in srgb,var(--c) 14%,transparent)}
.cloud-product__cta {display:inline-flex;align-items:center;justify-content:space-between;gap:1rem;min-height:44px;margin-top:auto;padding-top:1rem;border-top:1px solid var(--lx-line);font-weight:600;color:var(--lx-ink)}
.cloud-product__cta span {transition:transform .4s var(--lx-ease)}
.cloud-product__cta:hover {color:var(--c)}
.cloud-product__cta:hover span {transform:translate(3px,-3px)}

/* Principles */
.cloud-principles {padding-block:clamp(5rem,9vw,8rem);background:linear-gradient(180deg,#fff,#f5f6fe 40%,#fff)}
.cloud-principles__grid {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem;margin:clamp(3rem,5vw,4rem) 0 0;padding:0;list-style:none}
.cloud-principle {padding:1.8rem 1.6rem;border-radius:1.5rem;background:#fff;border:1px solid var(--lx-line);transition:border-color .4s,box-shadow .4s,transform .5s var(--lx-ease)}
.cloud-principle:hover {border-color:rgba(var(--lx-rgb),.25);box-shadow:0 30px 60px -30px rgba(var(--lx-rgb),.4);transform:translateY(-4px)}
.cloud-principle:hover .lx-icon {background:var(--lx-accent);color:#fff}
.cloud-principle h3 {margin:1.6rem 0 .6rem;font-size:1.3rem;line-height:1.2}
.cloud-principle p {color:var(--lx-muted);line-height:1.65}

@media(prefers-reduced-motion:no-preference) {
  .lx-js .cloud-stage .cloud-links__path {stroke-dashoffset:1}
  .lx-js .cloud-stage.is-in .cloud-links__path {stroke-dashoffset:0;transition:stroke-dashoffset 2s var(--lx-ease) .6s}
  .lx-js .cloud-stage .cloud-node {opacity:0;scale:.9}
  .lx-js .cloud-stage.is-in .cloud-node {opacity:1;scale:1;transition:opacity .7s,scale .9s var(--lx-ease),translate .8s var(--lx-ease),box-shadow .4s}
  .lx-js .cloud-stage.is-in .cloud-node--robotics {transition-delay:1.1s}
  .lx-js .cloud-stage.is-in .cloud-node--kiuu {transition-delay:1.35s}
  .lx-js .cloud-stage.is-in .cloud-node--seekers {transition-delay:1.6s}
  .lx-js .cloud-stage .cloud-core {opacity:0;scale:.6}
  .lx-js .cloud-stage.is-in .cloud-core {opacity:1;scale:1;transition:opacity .8s .3s,scale 1.2s var(--lx-ease) .3s}
}

@keyframes cloud-flow {to{stroke-dashoffset:-.32}}
@keyframes cloud-breathe {0%,100%{transform:scale(1)}50%{transform:scale(1.04)}}
@keyframes cloud-feed-in {from{opacity:0;transform:translateY(-10px) scale(.97)}to{opacity:1;transform:none}}
@keyframes cloud-converge {0%,100%{transform:translate(var(--fx),var(--fy));opacity:.4}50%{transform:translate(3.1rem,1.8rem) scale(1.3);opacity:1}}
@keyframes cloud-bars {0%,100%{transform:scaleY(.35)}50%{transform:scaleY(1)}}
@keyframes cloud-beam {0%{transform:translateZ(0);opacity:0}15%{opacity:1}85%{opacity:1}100%{transform:translateZ(12rem);opacity:0}}
@keyframes cloud-link {from{transform:translateX(-100%)}to{transform:translateX(340%)}}

@media(max-width:1050px) {
  .cloud-pillars,.cloud-products {grid-template-columns:1fr}
  .cloud-pillar {min-height:0}
  .cloud-principles__grid {grid-template-columns:1fr 1fr}
  .cloud-how__grid {grid-template-columns:1fr}
  .cloud-stack {display:none}
  .cloud-layers {display:grid;gap:1rem}
  .cloud-layers__item {min-height:0;padding:2rem 1.6rem;border:1px solid var(--lx-line);border-radius:1.4rem;background:#fff;opacity:1}
  .cloud-node__status {display:none}
}
@media(max-width:760px) {
  .cloud-hero {padding-top:7.5rem}
  .cloud-stage {border-radius:1.4rem;padding:.4rem}
  .cloud-stage__canvas {display:flex;flex-direction:column;align-items:stretch;gap:.6rem;aspect-ratio:auto;padding:1.4rem 1rem 1rem;border-radius:1.1rem}
  .cloud-links {display:none}
  .cloud-core {position:relative;left:auto;top:auto;width:8rem;margin:0 auto 1rem;transform:none}
  .cloud-node {position:relative;left:auto!important;top:auto!important;transform:none;translate:none}
  .cloud-node:before {content:"";position:absolute;left:1.9rem;top:-.65rem;width:2px;height:.65rem;background:linear-gradient(var(--lx-accent),var(--lx-accent-2))}
  .cloud-node__status {display:flex;margin-left:auto}
  .cloud-feed {position:relative;left:auto;bottom:auto;width:auto;margin-top:.4rem}
  .cloud-principles__grid {grid-template-columns:1fr}
}
@media(prefers-reduced-motion:reduce) {
  .cloud-links__packet,.cloud-links__flow,.cloud-core__wave,.cloud-stack__beam {display:none}
}
