/* ===== 01 — Abertura: hero + Inovação formam um "slide" que fecha com borda arredondada ===== */
.opening{position:relative;z-index:1;overflow:hidden;background:#07050c;border-radius:0 0 clamp(28px,4vw,56px) clamp(28px,4vw,56px);
  box-shadow:0 30px 60px #0009;border-bottom:1px solid rgba(255,255,255,.08)}

/* ===== 02 — Parceiros: seção branca que passa por baixo da borda arredondada da abertura ===== */
.opening .marquee{border:0;border-top:1px solid rgba(255,255,255,.08);background:#0b0811}
/* Letreiro infinito: dois grupos idênticos, o trilho anda exatamente a largura de um grupo */
.marquee>.mq-track{display:flex;width:max-content;gap:0;animation:marquee 40s linear infinite}
.mq-group{display:flex;align-items:center;flex:none;gap:38px;padding-right:38px}
.marquee:hover>.mq-track{animation-play-state:paused}
@media(max-width:760px){.mq-group{gap:22px;padding-right:22px}.marquee>.mq-track{animation-duration:28s}}
@media(prefers-reduced-motion:reduce){.marquee>.mq-track{animation:none}}
.pc{--r:clamp(28px,4vw,56px);position:relative;z-index:0;overflow:hidden;isolation:isolate;background:#f4f3f7;color:#15111d;
  margin-top:calc(var(--r) * -1);padding:calc(var(--r) + clamp(64px,8vw,120px)) var(--gutter) clamp(80px,9vw,130px)}
.pc-inner{position:relative;max-width:1240px;margin:0 auto}
.pc-word{position:absolute;left:50%;top:clamp(150px,17vw,300px);z-index:-1;transform:translateX(-50%);font-family:Bullish,Open Sans,sans-serif;
  font-size:clamp(110px,21vw,380px);line-height:1;color:#e7e4ee;white-space:nowrap;pointer-events:none;user-select:none}
.pc-top{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,5vw,80px);align-items:center}
.pc-top h2{font-size:clamp(44px,5.4vw,88px);line-height:.98;font-weight:600;letter-spacing:-.055em;color:#15111d}
.pc-top h2 em{display:block;margin-top:.08em;font-family:"Instrument Serif",Georgia,serif;font-style:italic;font-weight:400;letter-spacing:-.02em;color:var(--purple);font-size:1.08em}
.pc-pill{display:inline-block;padding:4px 13px;border:1px solid rgba(21,17,29,.18);border-radius:100px;background:#fff;font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:#6b6577}
.pc-lead{margin:16px 0 26px;max-width:520px;font-size:clamp(18px,1.55vw,24px);line-height:1.3;font-weight:600;letter-spacing:-.02em;color:#15111d}
.pc-lead b{color:var(--purple);font-weight:600}
.pc-logos{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:0;padding:0;list-style:none}
.pc-logos li{display:flex;align-items:center;justify-content:center;aspect-ratio:1.45;padding:14% 12%;border-radius:14px;background:#fff;
  box-shadow:0 1px 0 rgba(21,17,29,.04),0 10px 24px -14px rgba(21,17,29,.25);transition:transform .35s cubic-bezier(.16,1,.3,1),box-shadow .35s}
.pc-logos li:hover{transform:translateY(-4px);box-shadow:0 18px 30px -16px rgba(103,90,166,.45)}
.pc-logos img{width:100%;height:100%;object-fit:contain}

.pc-mid{max-width:860px;margin:clamp(90px,11vw,160px) auto clamp(44px,5vw,64px);text-align:center}
.pc-mid h3{margin-top:16px;font-size:clamp(24px,2.5vw,38px);line-height:1.18;font-weight:600;letter-spacing:-.035em;color:#15111d}
.pc-mid h3 em{font-family:"Instrument Serif",Georgia,serif;font-style:italic;font-weight:400;letter-spacing:-.01em;color:var(--purple);font-size:1.1em}

.pc-proof{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,.7fr);gap:clamp(32px,5vw,80px);align-items:center}
.pc-chats{display:grid}
.pc-chat{margin:0;padding:16px 20px 18px;border:1px solid rgba(255,255,255,.07);border-radius:12px;background:#15111d;color:#fff;
  box-shadow:0 26px 44px -18px rgba(21,17,29,.55)}
.pc-chat+.pc-chat{margin-top:-14px}
.pc-chat:nth-child(1){margin-right:24%}
.pc-chat:nth-child(2){margin-left:26%;position:relative}
.pc-chat:nth-child(3){margin-left:8%;margin-right:16%;position:relative}
.pc-chat:nth-child(4){margin-left:34%;position:relative}
.pc-chat figcaption{display:flex;align-items:center;gap:10px}
.pc-av{display:grid;place-items:center;flex:none;width:28px;height:28px;border-radius:50%;background:var(--purple);font-size:12px;font-weight:700;color:#fff}
.pc-chat figcaption b{display:block;font-size:13px;font-weight:600;line-height:1.2}
.pc-chat figcaption small{display:block;font-size:11px;color:#8f88a0;line-height:1.3}
.pc-chat blockquote{margin:10px 0 0;font-size:14px;line-height:1.55;color:#bdb7ca}
.pc-chat blockquote strong{font-weight:600;color:var(--lilac)}

.pc-stats{position:relative;display:grid;gap:clamp(22px,2.6vw,36px)}
.pc-stat strong{display:block;font-size:clamp(46px,4.6vw,72px);line-height:.95;font-weight:700;letter-spacing:-.055em;color:#15111d}
.pc-stat span{display:block;margin-top:8px;font-size:13px;line-height:1.35;color:#6b6577}
.pc-doodle{position:absolute;right:4%;top:22px;width:30px;fill:none;stroke:#15111d;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;opacity:.7}

@media(max-width:900px){
  .pc-top,.pc-proof{grid-template-columns:1fr}
  .pc-word{top:auto;bottom:38%}
  .pc-stats{grid-template-columns:1fr 1fr;gap:28px 20px;justify-items:center;text-align:center;max-width:420px;width:100%;margin:0 auto}
  .pc-doodle{display:none}
}
@media(max-width:560px){
  .pc-top h2{font-size:clamp(40px,11.5vw,56px)}
  .pc-logos{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pc-logos li{aspect-ratio:1.9;padding:10% 14%}
  .pc-word{display:none}
  .pc-chat{padding:14px 16px 16px}
  .pc-chat:nth-child(n){margin-left:0;margin-right:0}
  .pc-chat:nth-child(odd){margin-right:7%}
  .pc-chat:nth-child(even){margin-left:7%}
  .pc-chat blockquote{font-size:13px}
}

/* ===== 03 — Seção clara: cases, autoridade e Academy ===== */
.lt{position:relative;overflow:hidden;background:#fbfaff;color:#15111d;padding:105px var(--gutter);isolation:isolate}
.lt-word{position:absolute;left:50%;bottom:-.06em;z-index:-1;transform:translateX(-50%);font-family:Bullish,Open Sans,sans-serif;font-size:clamp(140px,30vw,520px);line-height:1;color:#675aa6;white-space:nowrap;pointer-events:none;user-select:none}
.lt-inner{position:relative;max-width:1800px;margin:0 auto}
.lt .section-kicker{color:#6b6577;border-top-color:rgba(21,17,29,.12)}
.lt-stage{position:relative}
.lt-top{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.25fr);gap:20px}
.lt-text{display:flex;flex-direction:column;justify-content:center;padding:clamp(28px,4vw,56px);border-radius:24px;background:#efeaff}
.lt-eyebrow{font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:#675aa6}
.lt-text h2{margin:18px 0 16px;font-size:clamp(34px,4vw,64px);line-height:1.02;font-weight:500;letter-spacing:-.045em;color:#15111d}
.lt-text h2 em{font-style:normal;color:#675aa6}
.lt-text p{max-width:440px;font-size:15px;line-height:1.65;color:#5b5566}
.lt-facts{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px}
.lt-facts span{display:flex;flex-direction:column;padding:12px 16px;border-radius:14px;background:#fff;font-size:12px;line-height:1.4;color:#6b6577}
.lt-facts b{font-size:18px;font-weight:600;letter-spacing:-.02em;color:#15111d}
.lt-facts span:first-child b{color:#675aa6}
.lt-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;margin-top:20px}
/* Molduras fixas: as imagens não vivem nelas, só usam a posição delas */
.lt-slot{border-radius:24px;background:#ece7f8;min-height:clamp(220px,20vw,300px)}
.lt-slot-hero{min-height:clamp(320px,34vw,520px)}

/* Esteira: cada imagem entra no card grande e desce card a card até sair depois do quinto */
.lt-deck{position:absolute;inset:0;pointer-events:none}
.lt-card{--ease:cubic-bezier(.65,0,.25,1);position:absolute;left:0;top:0;display:block;overflow:hidden;border-radius:24px;color:#fff;opacity:0;pointer-events:none;
  box-shadow:0 18px 40px #15111d2e;will-change:transform,width,height,opacity;
  transition:transform 1s var(--ease),width 1s var(--ease),height 1s var(--ease),opacity .7s ease}
.lt-card.is-in{opacity:1;pointer-events:auto}
.lt-card.no-anim{transition:none}
.lt-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 0;transition:transform .8s cubic-bezier(.16,1,.3,1)}
.lt-card:hover img{transform:scale(1.04)}
.lt-card::after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 45%,#0b0910d9)}
.lt-tag{position:absolute;z-index:1;left:16px;top:16px;padding:5px 11px;border-radius:100px;background:#fff;color:#15111d;font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.lt-cap{position:absolute;z-index:1;left:18px;right:18px;bottom:16px;font-size:12px;line-height:1.4;color:#e6e1f0}
.lt-cap b{display:block;font-size:17px;font-weight:600;color:#fff}
.lt-card.is-hero .lt-cap b{font-size:22px}
@media(max-width:900px){
  .lt{padding:70px 24px 90px}
  .lt-top{grid-template-columns:1fr}
  .lt-row{grid-template-columns:1fr 1fr;gap:14px}
  .lt-slot-hero{min-height:260px}
  .lt-slot{min-height:200px}
}
@media(max-width:520px){.lt-row{gap:12px}.lt-slot{min-height:150px}.lt-cap{left:12px;right:12px;bottom:10px;font-size:10px}.lt-cap b{font-size:13px}.lt-tag{left:10px;top:10px;font-size:8px;padding:4px 8px}}

/* ===== 04 — Método: logo no centro e conexões ===== */
/* Começa com os cantos de cima arredondados, subindo sobre o fim da seção clara (espelho do fim da abertura) */
.mx-section{--r:clamp(28px,4vw,56px);z-index:1;max-width:none;margin-top:calc(var(--r) * -1);background:var(--bg);
  border-radius:var(--r) var(--r) 0 0;box-shadow:0 -30px 60px rgba(21,17,29,.18);border-top:1px solid rgba(255,255,255,.08)}
.mx-section>*{max-width:1576px;margin-left:auto;margin-right:auto}
.lt{padding-bottom:calc(105px + clamp(28px,4vw,56px))}
@media(max-width:900px){.lt{padding-bottom:calc(90px + 28px)}}
.mx-section .ecl-head{margin:0 auto}
.mx{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(160px,220px) minmax(0,1fr);grid-template-areas:"n0 core n2" "n1 core n3" "n4 n4 n4";
  gap:28px clamp(40px,6vw,96px);align-items:center;max-width:1200px;margin:64px auto 0;padding:40px 0}
.mx::before{content:"";position:absolute;inset:-40px -20px;z-index:-1;pointer-events:none;
  background:radial-gradient(circle,rgba(185,168,241,.22) 1px,transparent 1.4px) 0 0/18px 18px;
  -webkit-mask:radial-gradient(ellipse 55% 60% at 50% 45%,#000,transparent 75%);mask:radial-gradient(ellipse 55% 60% at 50% 45%,#000,transparent 75%)}
.mx-lines{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none;z-index:0}
.mx-lines path{fill:none;stroke:rgba(138,127,196,.45);stroke-width:1.4}
.mx-lines path.flow{stroke:#c9c2ef;stroke-width:1.6;stroke-dasharray:4 22;animation:mx-flow 2.6s linear infinite}
@keyframes mx-flow{to{stroke-dashoffset:-104}}
.mx-core{grid-area:core;position:relative;z-index:1;justify-self:center;display:grid;place-items:center;width:clamp(130px,13vw,180px);aspect-ratio:1;border-radius:30%;
  background:linear-gradient(155deg,#ffffff14,#ffffff03 55%),#120c1f;border:1px solid #c9b6ff70;box-shadow:0 0 0 1px #675aa640,0 0 60px #675aa680,0 0 140px #675aa640,inset 0 0 30px #675aa630}
.mx-core img{width:56%;height:auto;filter:drop-shadow(0 0 16px #8b6cf0aa)}
.mx-core-ring{position:absolute;inset:-14px;border-radius:34%;border:1px solid #b9a8f155;animation:mx-pulse 3.2s ease-out infinite}
@keyframes mx-pulse{from{opacity:.9;transform:scale(.92)}to{opacity:0;transform:scale(1.18)}}
/* Card fechado mostra só o título; ao passar o mouse (ou focar/tocar) abre para baixo por cima do layout */
.mx-node{position:relative;z-index:1;width:min(100%,320px);height:64px}
.mx-node:hover,.mx-node:focus-within,.mx-node.is-open{z-index:5}
.mx-card{position:absolute;left:0;right:0;top:0;border-radius:18px;background:linear-gradient(160deg,#17141f,#0b0a10);border:1px solid rgba(255,255,255,.12);
  box-shadow:0 18px 40px #0008;transition:border-color .4s,box-shadow .4s,transform .5s cubic-bezier(.16,1,.3,1)}
.mx-head{position:relative;display:flex;align-items:center;gap:12px;height:62px;padding:0 16px 0 12px}
.mx-head h3{flex:1;margin:0;font-size:16px;font-weight:600;letter-spacing:-.01em;color:#fff}
.mx-head button{padding:0;color:inherit;font:inherit;text-align:left;cursor:pointer}
.mx-head button::after{content:"";position:absolute;inset:0}
.mx-head button:focus-visible{outline:none}
.mx-node:has(button:focus-visible) .mx-card{outline:2px solid var(--lilac);outline-offset:3px}
.mx-plus{position:relative;flex:none;width:22px;height:22px;border:1px solid rgba(255,255,255,.2);border-radius:50%;transition:background .3s,border-color .3s,transform .4s}
.mx-plus::before,.mx-plus::after{content:"";position:absolute;left:50%;top:50%;width:8px;height:1px;background:#fff;transform:translate(-50%,-50%)}
.mx-plus::after{transform:translate(-50%,-50%) rotate(90deg);transition:transform .4s}
.mx-more{display:grid;grid-template-rows:0fr;transition:grid-template-rows .5s cubic-bezier(.16,1,.3,1)}
.mx-more>div{overflow:hidden;padding:0 18px 0 66px;opacity:0;transition:opacity .35s,padding .5s cubic-bezier(.16,1,.3,1)}
.mx-node.is-open .mx-card{border-color:rgba(185,168,241,.45);box-shadow:0 26px 60px #000a,0 0 40px #675aa640}
.mx-node.is-open .mx-more{grid-template-rows:1fr}
.mx-node.is-open .mx-more>div{opacity:1;padding-bottom:18px}
.mx-node.is-open .mx-plus{background:var(--purple);border-color:var(--purple)}
.mx-node.is-open .mx-plus::after{transform:translate(-50%,-50%) rotate(0)}
@media(hover:hover){
  .mx-node:hover .mx-card{border-color:rgba(185,168,241,.45);box-shadow:0 26px 60px #000a,0 0 40px #675aa640;transform:translateY(-2px)}
  .mx-node:hover .mx-more{grid-template-rows:1fr}
  .mx-node:hover .mx-more>div{opacity:1;padding-bottom:18px}
  .mx-node:hover .mx-plus{background:var(--purple);border-color:var(--purple)}
  .mx-node:hover .mx-plus::after{transform:translate(-50%,-50%) rotate(0)}
}
.mx-node[data-node="0"]{grid-area:n0;justify-self:end}
.mx-node[data-node="1"]{grid-area:n1;justify-self:end}
.mx-node[data-node="2"]{grid-area:n2;justify-self:start}
.mx-node[data-node="3"]{grid-area:n3;justify-self:start}
.mx-node[data-node="4"]{grid-area:n4;justify-self:center;margin-top:24px}
.mx-icon{flex:0 0 38px;display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:linear-gradient(160deg,#8a7fc4,#675aa6 60%,#4b4180);box-shadow:0 0 24px #675aa699}
.mx-icon svg{width:19px;height:19px;fill:none;stroke:#fff;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.mx-more p{margin:0;font-size:13px;line-height:1.55;color:#b9b3c7}
.mx-more ul{list-style:none;margin:10px 0 0;padding:0;font-size:12px;line-height:1.6;color:#cfc8de}
.mx-more li::before{content:"";margin-right:7px;color:#8a7fc4;font-size:9px}
.mx-track{display:none}

/* Celular e tablet: linha do tempo. A barra lateral enche conforme a rolagem e cada pilar abre quando ela chega nele */
@media(max-width:900px){
  .mx{grid-template-columns:1fr;grid-template-areas:none;gap:14px;margin-top:40px;padding:0 0 0 38px}
  .mx-lines{display:none}
  .mx-core{grid-area:auto;justify-self:start;margin:0 0 22px -38px;width:110px}
  .mx-node,.mx-node[data-node]{grid-area:auto;justify-self:stretch;width:auto;height:auto;margin-top:0}
  .mx-card{position:relative;opacity:.55;transition:opacity .5s,border-color .4s,box-shadow .4s}
  .mx-node.is-on .mx-card{opacity:1}
  .mx-track{display:block;position:absolute;left:14px;width:2px;border-radius:2px;background:rgba(185,168,241,.16)}
  .mx-track i{display:block;width:100%;height:var(--fill,0px);border-radius:inherit;background:linear-gradient(#b9a8f1,#8a7fc4);box-shadow:0 0 12px #8b6cf0}
  .mx-node::before{content:"";position:absolute;z-index:2;left:-29px;top:26px;width:12px;height:12px;border-radius:50%;
    background:#0b0a10;border:2px solid rgba(185,168,241,.35);transition:background .35s,border-color .35s,box-shadow .35s,transform .35s}
  .mx-node.is-on::before{background:#b9a8f1;border-color:#b9a8f1;box-shadow:0 0 0 5px rgba(139,108,240,.18),0 0 16px #8b6cf0;transform:scale(1.1)}
}
@media(prefers-reduced-motion:reduce){.mx-lines path.flow,.mx-core-ring{animation:none}.mx-more,.mx-more>div,.mx-card{transition:none}}

/* ===== 05 — Ecossistema: acesso à Status Media ===== */
/* Frentes à esquerda ligadas por linhas a um arco que abraça o S da Status, à direita */
.ec-stage{position:relative;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);align-items:center;gap:clamp(40px,6vw,110px);
  max-width:1240px;margin:0 auto;text-align:left}
.ec-lines{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none;z-index:0}
.ec-lines .arc{fill:none;stroke:rgba(185,168,241,.45);stroke-width:1.4}
.ec-lines .link{fill:none;stroke:rgba(185,168,241,.4);stroke-width:1.4}
.ec-lines .dot{fill:#fff;stroke:#675aa6;stroke-width:5;paint-order:stroke}
.ec-lines .dot.end{fill:#b9a8f1;stroke:none}

/* Cards: vidro com borda em degradê, ícone em ladrilho, número vazado ao fundo e um "conector" de onde sai a linha */
.ec-list{position:relative;z-index:1;display:grid;gap:clamp(18px,2vw,26px);margin:0;padding:0;list-style:none}
.ec-item{display:flex}
.ec-item:nth-child(odd){padding-left:clamp(24px,4vw,64px)}   /* o do meio avança para a esquerda: os cards acompanham a curva do arco */
.ec-card{--glow:139,108,240;position:relative;flex:1;display:flex;gap:20px;align-items:flex-start;padding:24px 30px 24px 24px;border-radius:26px;isolation:isolate;overflow:hidden;
  background:radial-gradient(120% 140% at 0% 0%,rgba(var(--glow),.22),transparent 55%),linear-gradient(160deg,#16121f,#0b0a11);
  border:1px solid transparent;background-clip:padding-box;box-shadow:0 24px 50px -20px #000,inset 0 1px 0 rgba(255,255,255,.06);
  transition:transform .6s cubic-bezier(.16,1,.3,1),box-shadow .6s}
.ec-card::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;padding:1px;pointer-events:none;
  background:linear-gradient(130deg,rgba(185,168,241,.65),rgba(185,168,241,.08) 40%,rgba(185,168,241,.05) 70%,rgba(185,168,241,.4));
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude}
.ec-item:nth-child(2) .ec-card{--glow:120,96,230}
.ec-item:nth-child(3) .ec-card{--glow:165,130,255}
.ec-card:hover{transform:translateY(-4px);box-shadow:0 30px 60px -18px #000,0 0 50px -10px rgba(var(--glow),.55),inset 0 1px 0 rgba(255,255,255,.08)}
.ec-icon{flex:none;display:grid;place-items:center;width:54px;height:54px;border-radius:16px;
  background:linear-gradient(150deg,#9284d4,#675aa6 55%,#43397a);box-shadow:0 10px 26px -6px rgba(103,90,166,.9),inset 0 1px 0 rgba(255,255,255,.3)}
.ec-icon svg{width:26px;height:26px;fill:none;stroke:#fff;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.ec-body{min-width:0}
.ec-kicker{font-size:10px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--lilac)}
.ec-card h3{margin:4px 0 8px;font-size:clamp(20px,1.7vw,26px);font-weight:600;letter-spacing:-.025em;color:#fff}
.ec-card p{margin:0;max-width:440px;font-size:13.5px;line-height:1.6;color:#b9b3c7}
.ec-tags{display:flex;flex-wrap:wrap;gap:6px;margin:14px 0 0;padding:0;list-style:none}
.ec-tags li{padding:4px 11px;border-radius:100px;border:1px solid rgba(185,168,241,.22);background:rgba(185,168,241,.06);font-size:11px;color:#d7cff7}
.ec-port{position:absolute;right:-1px;top:50%;width:10px;height:22px;border-radius:12px 0 0 12px;transform:translateY(-50%);background:#b9a8f1;box-shadow:0 0 14px #8b6cf0}

.ec-hub{position:relative;z-index:1;justify-self:center;display:grid;place-items:center;align-content:center;gap:14px;width:clamp(240px,26vw,380px);aspect-ratio:1;border-radius:50%;
  background:radial-gradient(circle at 50% 42%,rgba(139,108,240,.32),rgba(103,90,166,.08) 60%,transparent 72%),rgba(255,255,255,.02);
  border:1px solid rgba(185,168,241,.28);box-shadow:inset 0 0 60px rgba(103,90,166,.25),0 0 90px rgba(103,90,166,.25)}
.ec-hub img{width:40%;height:auto;filter:drop-shadow(0 0 22px #8b6cf0aa)}
.ec-hub-name{font-size:11px;font-weight:600;letter-spacing:.32em;text-transform:uppercase;color:#d7cff7}
.ec-hub-ring{position:absolute;inset:-10px;border-radius:50%;border:1px solid rgba(185,168,241,.3);animation:mx-pulse 3.4s ease-out infinite}

@media(max-width:900px){
  .ec-stage{grid-template-columns:1fr;gap:44px}
  .ec-lines{display:none}
  .ec-hub{order:-1;width:200px}
  .ec-item:nth-child(odd){padding-left:0}
  .ec-port{display:none}
}
@media(max-width:520px){
  .ec-card{flex-direction:column;gap:14px;padding:22px 20px}
  .ec-icon{width:46px;height:46px;border-radius:14px}
  .ec-icon svg{width:22px;height:22px}
}
@media(prefers-reduced-motion:reduce){.ec-hub-ring{animation:none}}
.eco3-media{display:inline-flex;align-items:center;gap:10px;margin-top:30px;padding:12px 22px;border-radius:100px;border:1px solid rgba(255,255,255,.3);color:#fff;font-size:13px;font-weight:600;transition:background .3s,border-color .3s,gap .3s}
.eco3-media:hover{background:var(--purple);border-color:var(--purple);gap:14px}

/* ===== 06 — Cases: cards lado a lado, o ativo abre e mostra o card de informações ===== */
.cv-head{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;margin-bottom:36px}
.cv-head h2{font-size:clamp(34px,3.8vw,58px);line-height:1.04;font-weight:400;letter-spacing:-.04em}
.cv-head h2 em{font-family:"Instrument Serif",Georgia,serif;font-style:italic;color:var(--lilac);font-size:1.08em;letter-spacing:-.01em}
.cv-head p{max-width:340px;font-size:14px;line-height:1.65;color:#b9b3c7}
.cv-list{display:flex;gap:12px;height:clamp(420px,40vw,560px)}
.cv-item{position:relative;flex:1 1 0;min-width:0;overflow:hidden;border-radius:22px;cursor:pointer;outline:none;
  border:1px solid rgba(255,255,255,.1);transition:flex .7s cubic-bezier(.16,1,.3,1),border-color .4s}
.cv-item img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 0;filter:brightness(.5) saturate(.75);transition:filter .6s,transform .8s cubic-bezier(.16,1,.3,1)}
.cv-item.is-active{flex:3.2 1 0;border-color:rgba(255,255,255,.28)}
.cv-item.is-active img{filter:none}
.cv-item:focus-visible{border-color:var(--lilac);box-shadow:0 0 0 2px var(--lilac)}
.cv-card{position:absolute;left:18px;bottom:18px;width:min(320px,calc(100% - 36px));padding:16px 18px;border-radius:16px;
  background:rgba(14,12,20,.74);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.22);
  opacity:0;transform:translateY(12px);transition:opacity .45s .1s,transform .6s cubic-bezier(.16,1,.3,1) .1s;pointer-events:none}
.cv-item.is-active .cv-card{opacity:1;transform:none;pointer-events:auto}
.cv-kind{font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:#9e98ad}
.cv-card h3{margin:4px 0 12px;font-size:20px;font-weight:500;letter-spacing:-.02em;color:#fff}
.cv-link,.cv-play{display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border:0;border-radius:100px;background:#f4f2f8;color:#14111b;font:inherit;font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;cursor:pointer;transition:gap .3s}
.cv-link:hover,.cv-play:hover{gap:12px}
.cv-play{margin-right:8px;background:var(--purple);color:#fff}
.cv-dialog{width:min(420px,92vw);max-height:92vh;padding:0;overflow:hidden;background:#000;border:1px solid rgba(255,255,255,.2);border-radius:20px}
.cv-dialog::backdrop{background:#000c}
.cv-dialog video{display:block;width:100%;max-height:92vh;background:#000}
.cv-close{position:absolute;z-index:1;right:10px;top:10px;width:36px;height:36px;border-radius:50%;border:0;background:rgba(0,0,0,.6);color:#fff;font-size:22px;line-height:1;cursor:pointer}
@media(max-width:900px){
  .cv-head{display:block}
  .cv-head p{margin-top:16px;max-width:none}
  .cv-list{height:auto;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;margin:0 -24px;padding:0 24px 6px}
  .cv-list::-webkit-scrollbar{display:none}
  .cv-item,.cv-item.is-active{flex:0 0 84%;height:440px;scroll-snap-align:center}
  .cv-item img{filter:none}
  .cv-card{opacity:1;transform:none;pointer-events:auto}
}
@media(prefers-reduced-motion:reduce){.cv-item,.cv-item img,.cv-card{transition:none}}

/* ===== 07 — Serviços: "Saiba mais" aparece ao passar o mouse ou focar (sempre visível no toque) ===== */
@media(hover:hover) and (pointer:fine){
  .svc-cta{opacity:0;transform:translateY(8px);transition:opacity .35s,transform .45s cubic-bezier(.16,1,.3,1),gap .3s,background .3s}
  .svc-card:hover .svc-cta,.svc-card:focus-within .svc-cta,.svc-card.is-active .svc-cta{opacity:1;transform:none}
}

/* ===== 07 a 10 — bloco claro: sobe sobre a seção escura anterior com cantos arredondados; o contato (escuro) sobe sobre ele ===== */
.light-zone{--r:clamp(28px,4vw,56px);position:relative;z-index:1;margin-top:calc(var(--r) * -1);padding:var(--r) 0 calc(var(--r) + 10px);
  background:#f4f3f7;color:#15111d;border-radius:var(--r) var(--r) 0 0;box-shadow:0 -30px 60px rgba(0,0,0,.35)}
.cv{padding-bottom:calc(105px + clamp(28px,4vw,56px))}
.contact-section{--r:clamp(28px,4vw,56px);z-index:2;margin-top:calc(var(--r) * -1);padding-top:calc(60px + var(--r));border-radius:var(--r) var(--r) 0 0;
  background:radial-gradient(ellipse at 50% 120%,#675aa686,transparent 65%),var(--bg);box-shadow:0 -30px 60px rgba(21,17,29,.18)}
@media(max-width:760px){.contact-section{padding-top:calc(35px + var(--r))}}

/* texto base no claro */
.light-zone h2,.light-zone h3{color:#15111d}
.light-zone em{color:#675aa6}
.light-zone p{color:#5b5566}
.light-zone .section-kicker{color:#6b6577;border-top-color:rgba(21,17,29,.12)}
.light-zone .eyebrow{color:#675aa6}

/* 07 serviços: os cards continuam escuros, como peças sobre o papel */
.light-zone .svc-chip{background:#fff;box-shadow:0 1px 0 rgba(21,17,29,.06)}
.light-zone .svc-intro>p{color:#5b5566}
.light-zone .svc-prev{background:#fff;color:#15111d;border:1px solid rgba(21,17,29,.15)}
.light-zone .svc-next{background:#15111d;color:#fff}
.light-zone .svc-card h3{color:#fff}
.light-zone .svc-card p{color:#9e98ad}
.light-zone .svc-card.is-active{box-shadow:inset 0 1px 0 rgba(255,255,255,.3),0 30px 60px -20px rgba(21,17,29,.55),0 0 0 1px #675aa640}

/* 08 portfólio */
.light-zone .project-filters button{border-color:rgba(21,17,29,.15);color:#5b5566}
.light-zone .project-filters button.active{background:#15111d;border-color:#15111d;color:#fff}
.light-zone .project-filters button:hover{border-color:#675aa6}
.light-zone .project-caption p{color:#6b6577}
.light-zone .project-caption>span{color:#8a8396}
.light-zone .project-image{box-shadow:0 24px 50px -24px rgba(21,17,29,.45)}
.light-zone .project-typography{color:#fff;box-shadow:0 24px 50px -24px rgba(21,17,29,.5)}
.light-zone .project-typography em{color:var(--lilac)}
.light-zone .project-typography .eyebrow{color:var(--lilac)}
.light-zone .project-typography.light{background:#fff;color:#191421;border-color:rgba(21,17,29,.08)}
.light-zone .project-typography.light em,.light-zone .project-typography.light .eyebrow{color:#675aa6}

/* 09 depoimentos */
.light-zone blockquote{color:#3a3346}
.light-zone .author-mark{color:#fff}
.light-zone .quote-author p{color:#6b6577}
.light-zone .relationship-note{background:radial-gradient(ellipse at 90% 100%,#675aa61f,transparent 70%),#fff;border-color:rgba(21,17,29,.08);box-shadow:0 24px 50px -28px rgba(21,17,29,.35)}
.light-zone .relationship-values span{color:#675aa6;border-color:rgba(103,90,166,.35)}

/* 10 fundadores: os dois cards seguem escuros */
.light-zone .team-card{color:#fff;border-color:transparent;box-shadow:0 24px 50px -24px rgba(21,17,29,.55)}
.light-zone .team-card h3{color:#fff}
.light-zone .team-card em{color:var(--lilac)}
.light-zone .team-card p{color:#b9b3c7}
.light-zone .team-card .eyebrow{color:var(--lilac)}
/* no claro, card inativo não fica transparente (viraria cinza): o card segue escuro e só o conteúdo esmaece */
.light-zone .svc-card{opacity:1;box-shadow:inset 0 1px 0 rgba(255,255,255,.22),0 24px 50px -24px rgba(21,17,29,.5)}
.light-zone .svc-card>*{transition:opacity .6s}
.light-zone .svc-card:not(.is-active)>*{opacity:.5}
@media(max-width:900px){.light-zone .svc-card:not(.is-active)>*{opacity:1}}

/* Estrela "✳" desenhada em vetor: o caractere vira emoji verde no celular; assim fica igual em qualquer aparelho e herda a cor do texto */
:root{--ast:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.2' stroke-linecap='round'%3E%3Cpath d='M12 3v18M3 12h18M5.6 5.6l12.8 12.8M18.4 5.6 5.6 18.4'/%3E%3C/svg%3E")}
.ast,.mx-more li::before,.svc-card li::before,.hx6-call li::before,.hx6-center li::before{display:inline-block;width:.9em;height:.9em;vertical-align:-.08em;background:currentColor;
  -webkit-mask:var(--ast) center/contain no-repeat;mask:var(--ast) center/contain no-repeat}
.marquee .ast{width:.75em;height:.75em;vertical-align:middle}
.team-monogram .ast{width:1em;height:1em}
