/* v87 — leafs */
.leaf-sec{position:relative;padding-block:clamp(110px,11vw,150px) clamp(64px,7vw,104px)}
.leaf{position:relative;max-width:calc(var(--wrap,1240px) + 96px);margin:0 auto;background:#F4F2FB;color:#15122A;
  --text:#15122A;--muted:#55516E;--line:rgba(21,18,42,.12);border-radius:0 44px 44px 44px;padding:clamp(40px,5vw,72px) clamp(20px,4.5vw,64px) clamp(36px,4.5vw,64px)}
.leaf.r{border-radius:44px 0 44px 44px}
.leaf-tab{position:absolute;top:-46px;left:0;height:47px;display:flex;align-items:center;gap:10px;padding:0 26px 0 22px;
  background:#F4F2FB;border-radius:22px 22px 0 0;font:600 14px/1 var(--body,Inter,sans-serif);color:#4C2DB0}
.leaf.r .leaf-tab{left:auto;right:0}
.leaf-tab::after{content:"";position:absolute;bottom:0;right:-22px;width:22px;height:22px;background:radial-gradient(circle at 100% 0,transparent 21.5px,#F4F2FB 22px)}
.leaf.r .leaf-tab::after{right:auto;left:-22px;background:radial-gradient(circle at 0 0,transparent 21.5px,#F4F2FB 22px)}
.leaf-tab svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.7}
.leaf h2{color:#15122A;max-width:15ch}
.leaf .lede{color:#55516E;max-width:46ch}
.leaf-head{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:40px;align-items:end;margin-bottom:clamp(30px,4vw,52px)}
.leaf-bleed{position:relative;width:clamp(150px,15vw,210px);aspect-ratio:3/4;align-self:start;margin-top:calc(-1 * (clamp(40px,5vw,72px) + 70px));border-radius:26px;overflow:hidden;
  box-shadow:0 30px 60px -20px rgba(10,9,19,.55);transform:rotate(2.5deg);border:6px solid #F4F2FB}
.leaf-bleed img{width:100%;height:100%;object-fit:cover;display:block}
.leaf-bleed figcaption{position:absolute;left:10px;right:10px;bottom:10px;font:500 11.5px/1.3 var(--body,Inter,sans-serif);color:#fff;text-shadow:0 1px 6px rgba(0,0,0,.8)}
.svc87{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(18px,2.2vw,30px);list-style:none;margin:0;padding:0}
.svc87 li a{display:flex;flex-direction:column;height:100%;color:inherit;text-decoration:none}
.svc87 .ph{position:relative;aspect-ratio:16/11;border-radius:22px;overflow:hidden;background:#DCD7EE;
  -webkit-mask:radial-gradient(circle 34px at calc(100% - 34px) calc(100% - 2px),transparent 33px,#000 34px);mask:radial-gradient(circle 34px at calc(100% - 34px) calc(100% - 2px),transparent 33px,#000 34px)}
.svc87 .ph img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .7s var(--e-out,ease)}
.svc87 .ph small{position:absolute;left:12px;bottom:10px;font:500 11.5px/1.2 var(--body,Inter,sans-serif);color:#fff;background:rgba(15,13,30,.55);backdrop-filter:blur(6px);padding:5px 9px;border-radius:99px}
.svc87 .ic{position:relative;align-self:flex-end;margin:-50px 8px 0 0;width:52px;height:52px;border-radius:50%;background:#15122A;color:#C9B8FF;display:grid;place-items:center;transition:background .3s,transform .3s}
.svc87 .ic svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.svc87 h3{font-size:clamp(19px,1.5vw,22px);margin:6px 0 6px;color:#15122A;letter-spacing:-.01em}
.svc87 p{margin:0 0 10px;color:#55516E;font-size:15px;line-height:1.5}
.svc87 .steps{display:block!important;margin-top:auto;padding:0!important;border:0!important;font-size:13px;color:#6B6786;grid-template-columns:none}
.svc87 .steps i{display:inline!important;padding:0!important;border:0!important;background:none!important}
.svc87 .steps i{font-style:normal}
.svc87 .steps i + i::before{content:" / ";color:#B7B1D3}
.svc87 a:hover .ph img,.svc87 a:focus-visible .ph img{transform:scale(1.05)}
.svc87 a:hover .ic,.svc87 a:focus-visible .ic{background:#6D3FE0;color:#fff;transform:translateY(-3px)}
.svc87 a:focus-visible{outline:2px solid #6D3FE0;outline-offset:6px;border-radius:22px}
/* notes as a mirrored leaf */
.notes87 .ng{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.notes87 .n{position:relative;background:#fff;border:0;border-radius:18px;padding:22px 20px 20px;display:flex;flex-direction:column;gap:8px;color:#15122A;text-decoration:none;
  -webkit-mask:radial-gradient(circle 9px at 50% 0,transparent 8.5px,#000 9px);mask:radial-gradient(circle 9px at 50% 0,transparent 8.5px,#000 9px);box-shadow:0 1px 0 rgba(21,18,42,.06)}
.notes87 .n .mono{font:500 12px/1.3 var(--body,Inter,sans-serif);color:#6D3FE0;letter-spacing:0;text-transform:none}
.notes87 .n b{font-size:17px;line-height:1.3}
.notes87 .n span:last-child{color:#55516E;font-size:14px}
.notes87 .n .cov{margin:-22px -20px 6px;aspect-ratio:3/2;overflow:hidden;border-radius:18px 18px 0 0}
.notes87 .n .cov img{width:100%;height:100%;object-fit:cover;display:block}
.notes87 .n, .notes87 .n *{letter-spacing:normal}
.notes87 .n .big{display:block;margin:-22px -20px 6px;padding:26px 20px 18px;border-radius:18px 18px 0 0;background:#15122A;color:#fff;font:800 clamp(34px,3.2vw,46px)/1 var(--display,Archivo,sans-serif);letter-spacing:-.02em}
.notes87 .n .big small{display:block;margin-top:8px;font:500 13px/1.3 var(--body,Inter,sans-serif);color:#C9B8FF;letter-spacing:0}
.notes87 .n:hover{box-shadow:0 18px 40px -18px rgba(76,45,176,.45)}

/* service visuals: dark "screens" inside the light leaf */
.svc87 .ph{background:#14111F}
.vis{position:absolute;inset:0;color:#ECE8FF;font-family:var(--body,Inter,sans-serif)}
.vis .chip{position:absolute;z-index:2;font:600 11.5px/1 var(--body,Inter,sans-serif);padding:7px 10px;border-radius:99px;background:rgba(255,255,255,.95);color:#15122A;box-shadow:0 8px 20px -6px rgba(0,0,0,.5)}
.vis .c1{left:12px;top:12px;animation:chipf 6s ease-in-out infinite}
.vis .c2{right:12px;top:46px;background:#8B5CF6;color:#fff;animation:chipf 6s ease-in-out -3s infinite}
@keyframes chipf{50%{transform:translateY(-5px)}}
.vis-gap{padding:18px 18px 14px;background:radial-gradient(120% 80% at 100% 0,rgba(139,92,246,.25),transparent 60%),#14111F}
.vis-gap p{margin:0 0 10px;font-size:11.5px;color:#A9A5C2;display:flex;align-items:center;gap:6px}
.vis-gap p s{display:inline-block;width:18px;height:6px;border-radius:3px;background:#8B5CF6}
.vis-gap p u{text-decoration:none;display:inline-flex;align-items:center;gap:6px}
.vis-gap p u::before{content:"";width:2px;height:10px;background:#5EEAD4}
.vis-gap ol{list-style:none;margin:0;padding:0;display:grid;gap:9px}
.vis-gap li{display:grid;grid-template-columns:78px 1fr;align-items:center;gap:10px;font-size:11.5px;color:#C9C4E4}
.vis-gap li i{position:relative;height:10px;border-radius:6px;background:rgba(236,232,255,.08)}
.vis-gap li b{position:absolute;inset:0 auto 0 0;width:var(--now);border-radius:6px;background:linear-gradient(90deg,#6D3FE0,#8B5CF6)}
.vis-gap li em{position:absolute;top:-4px;bottom:-4px;left:var(--goal);width:2px;background:#5EEAD4}
.vis-feed{display:grid;place-items:center;background:radial-gradient(90% 70% at 0 100%,rgba(60,147,150,.35),transparent 60%),#14111F}
.phone{position:relative;width:46%;aspect-ratio:9/15;border-radius:18px;background:#0B0A12;border:3px solid #2A2540;overflow:hidden;box-shadow:0 20px 40px -12px rgba(0,0,0,.7);transform:rotate(-4deg) translateY(10%)}
.ph-top{display:flex;justify-content:space-between;align-items:center;padding:7px 8px 5px;font-size:9px;color:#C9C4E4}
.ph-top b{font-size:10px;color:#fff}
.grid9{display:grid;grid-template-columns:repeat(3,1fr);gap:2px}
.grid9 img{width:100%;aspect-ratio:1;object-fit:cover;display:block}
.vis-reel{display:flex;align-items:center;gap:16px;padding:0 18px;background:radial-gradient(80% 90% at 20% 100%,rgba(139,92,246,.35),transparent 60%),#14111F}
.phone.tall{width:34%;aspect-ratio:9/16;transform:rotate(-3deg) translateY(6%)}
.phone.tall img,.phone.tall video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.rec{position:absolute;top:8px;left:8px;font:700 9px/1 var(--body,Inter,sans-serif);color:#fff;display:flex;align-items:center;gap:4px}
.rec::before{content:"";width:7px;height:7px;border-radius:50%;background:#F43F5E;animation:blink 1.2s steps(2,start) infinite}
@keyframes blink{50%{opacity:0}}
.tc{position:absolute;right:8px;top:8px;font:600 9px/1 var(--mono,monospace);color:#fff}
.vis-side{display:grid;gap:6px;font-size:12px;color:#A9A5C2}.vis-side b{font-size:15px;color:#fff}
.vis-pod{background:radial-gradient(60% 70% at 25% 40%,rgba(139,92,246,.42),transparent 70%),#14111F}
.vis.vis-pod img.mic{position:absolute;left:6%;top:12%;width:34%!important;height:auto!important;object-fit:contain;opacity:1;filter:drop-shadow(0 22px 24px rgba(0,0,0,.7));transform:rotate(-8deg)}
.vis-pod .air{position:absolute;right:14px;top:14px;font:700 11px/1 var(--mono,monospace);letter-spacing:.12em;color:#fff;background:#E5484D;padding:6px 9px;border-radius:6px;box-shadow:0 0 18px rgba(229,72,77,.6)}
.vis-pod .trk{position:absolute;right:14px;top:52px;width:46%;list-style:none;margin:0;padding:0;display:grid;gap:9px}
.vis-pod .trk li{display:grid;gap:4px;font:500 11px/1 var(--body,Inter,sans-serif);color:#C9C4E4}
.vis-pod .trk i{display:block;height:6px;border-radius:3px;background:linear-gradient(90deg,#22C55E 0 60%,#EAB308 60% 85%,#E5484D 85%);clip-path:inset(0 calc(100% - var(--l)) 0 0 round 3px);animation:lvl 1.1s ease-in-out var(--d) infinite alternate}
@keyframes lvl{from{clip-path:inset(0 calc(100% - var(--l) + 30%) 0 0 round 3px)}}
.vis-pod .wave{position:absolute;left:14px;right:14px;bottom:14px;height:42px;display:flex;align-items:flex-end;gap:4px}
.vis-pod .wave i{flex:1;height:var(--h);border-radius:3px;background:linear-gradient(#fff,#8B5CF6);transform-origin:bottom;animation:wv 1.4s ease-in-out var(--d) infinite alternate}
@keyframes wv{from{transform:scaleY(.35)}to{transform:scaleY(1)}}
.vis-ad{display:grid;place-items:center;background:radial-gradient(90% 80% at 100% 100%,rgba(60,147,150,.4),transparent 60%),#14111F}
.post{width:52%;background:#fff;border-radius:12px;overflow:hidden;transform:rotate(3deg) translateY(12%);box-shadow:0 22px 44px -12px rgba(0,0,0,.7)}
.post-h{display:flex;align-items:center;gap:6px;padding:6px 8px;font-size:9px;color:#55516E}
.post-h i{width:14px;height:14px;border-radius:50%;background:#3C9396}.post-h b{color:#15122A;font-size:9.5px}.post-h span{margin-left:auto}
.post img{width:100%;display:block}
.post-cta{padding:7px 8px;font:600 10px/1 var(--body,Inter,sans-serif);color:#fff;background:#3C9396}
.vis-web{background:radial-gradient(90% 80% at 0 0,rgba(139,92,246,.3),transparent 60%),#14111F}
.vis-web .bframe{position:absolute;left:9%;right:-6%;top:22%;bottom:-8%;border-radius:12px 0 0 0;overflow:hidden;background:#fff;box-shadow:0 22px 44px -12px rgba(0,0,0,.7)}
.vis-web .bbar{display:flex;align-items:center;gap:5px;padding:6px 9px;background:#EDEAF7;font-size:9.5px;color:#55516E}
.vis-web .bbar i{width:7px;height:7px;border-radius:50%;background:#C9C4E4}.vis-web .bbar span{margin-left:8px}
.vis-web .bframe{display:block}.vis-web .bbar{width:auto;height:auto;margin:0}.vis-web .bframe img{width:100%!important;height:auto;max-width:none;display:block;margin:0;border-radius:0}
.vis-web .c1{top:12px;left:12px}.vis-web .c2{top:12px;right:12px;left:auto}
.svc87 a:hover .phone,.svc87 a:hover .post{transform:rotate(0) translateY(4%)}
.phone,.post,.vis-web .bframe{transition:transform .6s var(--e-out,ease)}
/* motion: the leaf opens as it arrives, the clip on the edge drifts */
@supports (animation-timeline: view()){
  @media (prefers-reduced-motion:no-preference){
    .leaf{animation:leafin linear both;animation-timeline:view();animation-range:entry 0% entry 55%}
    @keyframes leafin{from{transform:translateY(48px) scale(.965);opacity:.35}to{transform:none;opacity:1}}
    .leaf-bleed{animation:bleedp linear both;animation-timeline:view();animation-range:cover 0% cover 100%}
    @keyframes bleedp{from{transform:rotate(6deg) translateY(40px)}to{transform:rotate(-2deg) translateY(-30px)}}
    .vis-gap li b{animation:grow linear both;animation-timeline:view();animation-range:entry 20% cover 40%}
    @keyframes grow{from{width:0}}
  }
}
.leaf-bleed video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
/* the kit: our own gear, as a moving wall of names */
.kit87{position:relative;margin-top:clamp(56px,7vw,96px);padding:clamp(28px,4vw,48px) 0;border-radius:32px;overflow:hidden;background:linear-gradient(135deg,#191530,#0F0D1A);border:1px solid rgba(255,255,255,.08)}
.kit87-type{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;gap:6px;pointer-events:none;opacity:.9}
.kit87-type div{display:flex;gap:40px;white-space:nowrap;width:max-content;font:800 clamp(44px,6vw,86px)/1 var(--display,Archivo,sans-serif);letter-spacing:-.02em;color:transparent;-webkit-text-stroke:1.2px rgba(201,184,255,.32);animation:kitmq 60s linear infinite}
.kit87-type div:nth-child(2){animation-direction:reverse;animation-duration:75s}
@keyframes kitmq{to{transform:translateX(-50%)}}
.kit87-in{position:relative;display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,2fr);gap:clamp(20px,4vw,56px);align-items:center;padding-inline:clamp(20px,4vw,48px)}
.kit87-in h3{font:800 clamp(28px,3vw,40px)/1.05 var(--display,Archivo,sans-serif);margin:0 0 10px;color:#fff;letter-spacing:-.02em}
.kit87-in p{margin:0;color:#A9A5C2;max-width:32ch}
.kit87 ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}
.kit87 li{display:grid;gap:12px;align-content:start;padding:16px;border-radius:18px;background:rgba(20,17,31,.72);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.09);color:#ECE8FF;font-size:13.5px;line-height:1.35}
.kit87 li svg{width:40px;height:40px;fill:none;stroke:#C9B8FF;stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:120;stroke-dashoffset:0}
@supports (animation-timeline: view()){@media (prefers-reduced-motion:no-preference){.kit87 li svg{animation:draw linear both;animation-timeline:view();animation-range:entry 10% cover 35%}@keyframes draw{from{stroke-dashoffset:120}}}}
@media (prefers-reduced-motion:reduce){.kit87-type div,.vis .chip,.vis-pod .wave i,.vis-pod .trk i,.rec::before{animation:none}}
.kit87-in{grid-template-columns:minmax(0,.62fr) minmax(0,2fr)}
.kit87 ul{grid-template-columns:repeat(5,minmax(0,1fr))}
.kit87 li{position:relative;transition:transform .5s var(--e-out,ease),border-color .3s}
.kit87 li:hover{transform:translateY(-4px);border-color:rgba(201,184,255,.35)}
.kit87 li.g img{width:100%;height:96px;object-fit:contain;filter:drop-shadow(0 16px 18px rgba(0,0,0,.6));transition:transform .6s var(--e-out,ease);margin:4px 0 2px}
.kit87 li.g:hover img{transform:scale(1.08) rotate(-2deg)}
.kit87 li.big{grid-column:span 2;grid-row:span 2;align-content:end;padding:20px;background:radial-gradient(70% 60% at 50% 40%,rgba(139,92,246,.45),transparent 70%),rgba(20,17,31,.8);font-size:16px;font-weight:600}
.kit87 .g2{position:relative;display:block;height:clamp(190px,17vw,250px);margin-bottom:14px}
.kit87 .g2 .a{position:absolute;inset:-4% 6% 14% 6%;width:88%;height:100%;object-fit:contain;filter:drop-shadow(0 26px 30px rgba(0,0,0,.65))}
.kit87 .g2 .c{position:absolute;left:-3%;bottom:0;width:42%;height:auto;filter:drop-shadow(0 16px 18px rgba(0,0,0,.7));transform:rotate(5deg)}
.kit87 .g2 .b{position:absolute;right:-2%;bottom:2%;width:36%;height:auto;filter:drop-shadow(0 16px 18px rgba(0,0,0,.7));transform:rotate(-6deg)}
@supports (animation-timeline: view()){@media (prefers-reduced-motion:no-preference){.kit87 .g2 .a{animation:camin linear both;animation-timeline:view();animation-range:entry 0% cover 40%}@keyframes camin{from{transform:translateY(30px) scale(.92) rotate(4deg)}}}}
@media (max-width:1100px){.kit87 ul{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:760px){.kit87 li.big{grid-row:auto}.kit87 li.g img{height:80px}.kit87-in{grid-template-columns:1fr}.kit87 ul{grid-template-columns:1fr 1fr}}
/* studio: real screens for BuildDesk and Eduport */
.st .st-shot{display:block;width:100%;aspect-ratio:16/10;border-radius:12px;overflow:hidden;border:1px solid rgba(255,255,255,.1);margin-bottom:6px;background:#fff}
.st .st-shot img{width:100%!important;height:100%!important;object-fit:cover;object-position:top;display:block;border-radius:0!important;margin:0!important}
.st > img{width:100%!important;height:auto!important;aspect-ratio:16/10;object-fit:cover;border-radius:12px!important}
/* notes: a photo behind the number */
.notes87 .n .big{position:relative;overflow:hidden;background:#15122A}
.notes87 .n .big img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.55}
.notes87 .n .big b,.notes87 .n .big small{position:relative}
.notes87 .n .big b{display:block;font:inherit;color:#fff}
.notes87 .n .big{min-height:0;aspect-ratio:3/2;display:flex;flex-direction:column;justify-content:flex-end}

@media (max-width:980px){.svc87{grid-template-columns:1fr 1fr}.notes87 .ng{grid-template-columns:1fr 1fr}}
@media (max-width:640px){
  .leaf,.leaf.r{border-radius:0 28px 28px 28px;margin-inline:10px;padding-inline:18px}
  .leaf.r{border-radius:28px 0 28px 28px}
  .leaf-head{grid-template-columns:1fr}.leaf-bleed{display:none}
  .svc87{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:14px;margin-inline:-18px!important;padding:0 18px 8px!important;scroll-padding-inline:18px;scrollbar-width:none}
  .svc87::-webkit-scrollbar{display:none}
  .svc87 li{flex:0 0 82%;scroll-snap-align:start}
  .notes87 .ng{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){.svc87 .ph img,.svc87 .ic{transition:none}}