/* ==========================================================================
   OctronX® - Home executiva (Fase 1). So a Home carrega este arquivo, depois do CSS base.
   Secoes: hero · ciclo (4 etapas) · casos · matriz de valor · plataforma · credibilidade · CTA final.
   Classes prefixadas com .hm- para nao colidir com o CSS base. Tokens (--bg, --ink, --line...) vem do base.
   ========================================================================== */
.section.hm{min-height:auto;justify-content:flex-start;padding-block:clamp(56px,7vw,104px);scroll-margin-top:0}
.hm .s-head h2{max-width:28ch}
.hm .s-head .hm-sub{margin-top:0;max-width:64ch;color:var(--ink-dim);font-size:var(--t-1);line-height:1.62}
.hm-link{display:inline-flex;align-items:center;gap:.4em;color:var(--accent-2);font-weight:600;font-size:.95rem}
button.hm-link{background:none;border:0;padding:0;cursor:pointer;font-family:inherit}
.hm-link:hover{text-decoration:underline;text-underline-offset:4px}
.hm-link .arw{transition:transform .18s var(--ease)}
.hm-link:hover .arw{transform:translateX(3px)}
.hm-chips{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:0;padding:0}
.hm-chip{display:inline-flex;align-items:center;padding:5px 11px;border:1px solid var(--line-2);border-radius:999px;
  font-family:var(--mono);font-size:.7rem;letter-spacing:.02em;line-height:1.3;color:var(--ink-dim);background:transparent}
.hm-card{position:relative;background:var(--bg-2);border:1px solid var(--line);border-radius:var(--radius);padding:24px}
.section.alt .hm-card{background:var(--bg)}
.hm-ic{width:30px;height:30px;color:var(--accent-2);flex:none}

/* ---------- 1. HERO ---------- */
.hm-hero{padding-block:clamp(48px,8vh,96px) clamp(48px,6vw,88px)}
.hm-hero .wrap{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(28px,4.5vw,72px);align-items:center}
.hm-hero h1{font-size:clamp(2rem,1.2rem + 3.4vw,3.5rem);font-weight:600;letter-spacing:-.032em;line-height:1.08;max-width:17ch;margin:16px 0 0}
.hm-hero .hm-lead{margin-top:22px;max-width:56ch;font-size:var(--t-1);line-height:1.62;color:var(--ink-dim)}
.hm-hero .hm-chips{margin-top:22px}
.hm-cta{display:flex;flex-wrap:wrap;align-items:center;gap:14px 18px;margin-top:30px}
.hm-cta .btn{white-space:nowrap}
.hm-stack{display:flex;flex-direction:column;gap:10px}
.hm-layer{position:relative;display:flex;flex-direction:column;gap:4px;padding:16px 18px;border:1px solid var(--line);border-radius:14px;background:var(--bg-2)}
.hm-layer .k{font-family:var(--mono);font-size:.68rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-faint)}
.hm-layer h3{font-size:1rem;font-weight:700;letter-spacing:-.01em}
.hm-layer p{font-size:.86rem;line-height:1.5;color:var(--ink-dim)}
.hm-layer.exe{background:var(--surface);border-color:transparent;padding:20px 18px}
.hm-layer.exe::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1.4px;background:var(--spec);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none}
.hm-layer.exe .k{color:var(--accent-2)}
.hm-layer.exe p{color:var(--ink-2)}
@media (max-width:960px){
  .hm-hero .wrap{grid-template-columns:1fr}
  .hm-hero h1{max-width:20ch}
}

/* ---------- 2. CICLO EM 4 ETAPAS ---------- */
.hm-cycle{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:34px;list-style:none;padding:0}
.hm-step{display:flex;flex-direction:column;gap:12px;padding-top:26px}
.hm-step::before{content:"";position:absolute;left:24px;right:24px;top:0;height:3px;border-radius:0 0 3px 3px;background:var(--exec-grad)}
.hm-step .n{font-family:var(--mono);font-size:.78rem;font-weight:600;letter-spacing:.08em;color:var(--accent-2)}
.hm-step h3{font-size:1.08rem;font-weight:700;line-height:1.22}
.hm-step p{font-size:.92rem;line-height:1.55;color:var(--ink-dim)}
.hm-step .out{margin-top:auto;padding-top:14px;border-top:1px solid var(--line);font-size:.82rem;line-height:1.45;color:var(--ink-2)}
.hm-step .out b{display:block;margin-bottom:2px;font-family:var(--mono);font-size:.66rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-faint)}
.hm-cycle-cap{margin-top:22px;font-family:var(--mono);font-size:.8rem;letter-spacing:.03em;color:var(--ink-dim)}
@media (max-width:1040px){.hm-cycle{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:620px){.hm-cycle{grid-template-columns:1fr}}

/* ---------- 3. CENARIOS DE ARQUITETURA & INTEGRACAO ---------- */
.hm-cases{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:34px;align-items:stretch;grid-auto-rows:1fr}
.hm-case{display:flex;flex-direction:column;gap:14px}
.hm-case .tag{font-family:var(--mono);font-size:.68rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--accent-2)}
.hm-case h3{font-size:1.18rem;font-weight:700;line-height:1.2}
.hm-case{min-width:0}
.hm-case dl{display:grid;flex:1;grid-template-rows:auto 1fr auto;gap:12px;margin:0}
.hm-case dt{margin-bottom:5px;font-family:var(--mono);font-size:.66rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-faint)}
.hm-case dd{margin:0;font-size:.92rem;line-height:1.55;color:var(--ink-dim)}
.hm-case dd.hitl{color:var(--ink-2)}
.hm-note{margin-top:20px;font-size:.8rem;line-height:1.5;color:var(--ink-faint);max-width:78ch}
/* grade 3x2 no desktop; 2 colunas no tablet; 1 no mobile */
@media (max-width:1020px){.hm-cases{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){.hm-cases{grid-template-columns:1fr;grid-auto-rows:auto}}

/* ---------- 4. MATRIZ DE VALOR ---------- */
.hm-cmp-wrap{margin-top:34px;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;background:var(--bg)}
.hm-cmp{width:100%;border-collapse:collapse;table-layout:fixed}
.hm-cmp th,.hm-cmp td{padding:16px 22px;text-align:left;vertical-align:top;font-size:.94rem;line-height:1.5;border-top:1px solid var(--line)}
.hm-cmp thead th{border-top:0;font-family:var(--mono);font-size:.72rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-faint);background:var(--bg-3)}
.hm-cmp thead th.ox{color:var(--accent-2);background:var(--surface)}
.hm-cmp tbody th{width:22%;font-family:var(--display);font-size:.94rem;font-weight:700;color:var(--ink)}
.hm-cmp td{color:var(--ink-dim)}
.hm-cmp td.ox{color:var(--ink);background:color-mix(in srgb,var(--surface) 55%,transparent)}
.hm-cmp td.ox::before{content:"";display:inline-block;width:.9em;height:.5em;margin-right:.55em;border-left:2px solid var(--good);border-bottom:2px solid var(--good);transform:translateY(-.15em) rotate(-45deg)}
/* "sistema quadrado": o modelo tradicional e engessado, em silos. Quadrado de cantos retos, ardosia discreta, contraponto do visto da OctronX(R) */
.hm-cmp td.bad::before,.hm-cmp td.bad .hm-lab::before{content:"";display:inline-block;box-sizing:border-box;width:.8em;height:.8em;margin-right:.55em;
  border:2px solid #7e90a8;border-radius:0;background:rgba(126,144,168,.16);vertical-align:-.03em}
.hm-lab{display:none}
@media (max-width:760px){
  .hm-cmp,.hm-cmp tbody,.hm-cmp tr,.hm-cmp th,.hm-cmp td{display:block;width:auto}
  .hm-cmp thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
  .hm-cmp tbody tr{border-top:1px solid var(--line)}
  .hm-cmp tbody tr:first-child{border-top:0}
  .hm-cmp tbody th{width:auto;padding:16px 18px 6px;border-top:0}
  .hm-cmp td{padding:6px 18px;border-top:0}
  .hm-cmp td:last-child{padding-bottom:16px}
  .hm-lab{display:block;margin-bottom:2px;font-family:var(--mono);font-size:.64rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-faint)}
  .hm-cmp td.ox .hm-lab{color:var(--accent-2)}
  .hm-cmp td.ox{background:transparent;border-left:2px solid var(--good);margin-left:18px;padding-left:12px;padding-right:18px}
  .hm-cmp td.ox::before,.hm-cmp td.bad::before{display:none}
  .hm-cmp td.bad .hm-lab::before{width:.9em;height:.9em;margin-right:.5em;vertical-align:-.08em}
}

/* ---------- 5. PLATAFORMA ---------- */
.hm-pillars{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:34px}
.hm-pillar{display:flex;flex-direction:column;gap:12px}
.hm-pillar h3{font-size:1.15rem;font-weight:700;line-height:1.2}
.hm-pillar p{font-size:.94rem;line-height:1.58;color:var(--ink-dim)}
.hm-pillar ul{margin:auto 0 0;padding:14px 0 0;border-top:1px solid var(--line);list-style:none;display:grid;gap:6px;font-size:.86rem;color:var(--ink-2)}
.hm-pillar li{position:relative;padding-left:16px}
.hm-pillar li::before{content:"";position:absolute;left:0;top:.62em;width:6px;height:6px;border-radius:50%;background:var(--accent-2)}
.hm-surface{display:flex;flex-wrap:wrap;align-items:center;gap:12px 18px;margin-top:16px;padding:18px 22px;border:1px dashed var(--line-2);border-radius:var(--radius)}
.hm-surface .k{font-family:var(--mono);font-size:.7rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-faint)}
.hm-plat-more{margin-top:22px}
@media (max-width:900px){.hm-pillars{grid-template-columns:1fr}}

/* ---------- 6. CREDIBILIDADE ---------- */
.hm-seals{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:34px}
.hm-seal{display:flex;flex-direction:column;gap:10px}
.hm-seal .fig{font-family:var(--display);font-size:clamp(2rem,1.4rem + 2vw,2.8rem);font-weight:800;letter-spacing:-.03em;line-height:1;
  background:var(--exec-grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.hm-seal .fig small{font-size:.4em;font-weight:700;letter-spacing:0}
.hm-seal h3{font-size:1.08rem;font-weight:700}
.hm-seal p{font-size:.94rem;line-height:1.58;color:var(--ink-dim)}
.hm-seals-more{margin-top:24px}
@media (max-width:900px){.hm-seals{grid-template-columns:1fr}}

/* ---------- 7. CTA FINAL ---------- */
.hm-final{position:relative;display:flex;flex-direction:column;align-items:center;text-align:center;gap:18px;padding:clamp(36px,5vw,64px) clamp(20px,4vw,56px);
  border-radius:calc(var(--radius) + 6px);background:var(--bg-3);overflow:hidden}
.hm-final::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1.4px;background:var(--spec);opacity:.55;
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none}
.hm-final h2{max-width:30ch;font-size:clamp(1.6rem,1.1rem + 2vw,2.4rem);font-weight:700;line-height:1.14}
.hm-final .hm-sub{max-width:56ch;color:var(--ink-dim);font-size:var(--t-1);line-height:1.6}
.hm-final .btn{margin-top:6px;font-size:.9rem;padding:1em 1.8em}
.hm-final-links{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 22px}
.hm-final-note{font-family:var(--mono);font-size:.74rem;letter-spacing:.03em;line-height:1.55;color:var(--ink-faint);max-width:60ch}

/* ==========================================================================
   ACABAMENTO VISUAL (benchmark Sydle): fundo espacial, estrelas, linhas que se desenham, tipografia fina.
   Tudo escopado a body.hm-page (so a Home). Sem JS inline: o canvas das estrelas vive no JS compartilhado.
   ========================================================================== */

/* --- 1. Fundo espacial: vinheta radial fixa (bordas/topo #020408 -> centro azul-marinho) --- */
body.hm-page{background:#020408;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}
.hm-space{position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:
    radial-gradient(ellipse 42% 38% at 82% 18%,rgba(124,92,255,.14),rgba(124,92,255,0) 70%),
    radial-gradient(ellipse 46% 40% at 14% 78%,rgba(42,120,228,.15),rgba(42,120,228,0) 72%),
    radial-gradient(ellipse 95% 75% at 50% 46%,#0d213a 0%,#0a192f 34%,#050d1a 68%,#020408 100%)}
.hm-space canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
/* secoes deixam o fundo aparecer; o ritmo alt/normal vira uma faixa escura translucida */
.hm-page .section{background:transparent}
/* faixa escura que entra e sai suavemente (sem corte seco entre secoes) */
.hm-page .section.alt{background:linear-gradient(180deg,rgba(2,4,8,0),rgba(2,4,8,.24) 12%,rgba(2,4,8,.18) 88%,rgba(2,4,8,0))}
.hm-page .hero{background:none}
.hm-page .hero::before{opacity:.55}
/* header no mesmo tom do fundo (topo #020408), com blur leve ao rolar */
.hm-page .hdr{background:rgba(2,4,8,.35)}
.hm-page .hdr.scrolled{background:rgba(2,4,8,.78);border-bottom-color:rgba(159,176,198,.10)}
/* cartoes semitransparentes sobre as estrelas */
.hm-page .hm-card{background:rgba(9,19,36,.70);border-color:rgba(159,176,198,.12)}
.hm-page .section.alt .hm-card{background:rgba(9,19,36,.62)}
.hm-page .hm-layer{background:rgba(9,19,36,.66);border-color:rgba(159,176,198,.12)}
.hm-page .hm-layer.exe{background:rgba(23,50,74,.62)}
.hm-page .hm-cmp-wrap{background:rgba(5,12,24,.55)}
.hm-page .hm-cmp thead th{background:rgba(2,4,8,.45)}
.hm-page .hm-final{background:rgba(5,12,24,.62)}
.hm-page .ftr{background:rgba(2,4,8,.72)}

/* --- 3. Linhas vetoriais que se desenham ao entrar na viewport (reusa o IntersectionObserver de [data-reveal]) --- */
.hm-hero-vis{position:relative;display:flex;align-items:center}
.hm-hero-vis .hm-stack{position:relative;z-index:1;width:100%}
.hm-orbit{color:var(--accent-2);pointer-events:none}
.hm-orbit svg{width:100%;height:auto;overflow:visible}
.hm-orbit--hero{position:absolute;z-index:0;left:50%;top:50%;width:150%;max-width:760px;transform:translate(-50%,-50%)}
.hm-orbit--hero[data-reveal]{transform:translate(-50%,-46%)}
.hm-orbit--hero[data-reveal].in{transform:translate(-50%,-50%)}
.hm-draw{stroke-dasharray:1;stroke-dashoffset:1;opacity:.22;transition:stroke-dashoffset 2.2s var(--ease)}
.hm-draw--faint{opacity:.15}
.hm-orbit.in .hm-draw{stroke-dashoffset:0}
.hm-orbit .hm-draw:nth-child(2){transition-delay:.15s}.hm-orbit .hm-draw:nth-child(3){transition-delay:.3s}
.hm-orbit .hm-draw:nth-child(4){transition-delay:.45s}.hm-orbit .hm-draw:nth-child(5){transition-delay:.6s}
.hm-orbit .hm-draw:nth-child(6){transition-delay:.75s}
.hm-orbit .hm-draw:nth-child(7){transition-delay:.9s}.hm-orbit .hm-draw:nth-child(8){transition-delay:1.05s}
.hm-dots,.hm-nodes,.hm-nodes-t{opacity:0;transition:opacity 1s ease 1.4s}
.hm-orbit.in .hm-dots{opacity:.38}
.hm-orbit.in .hm-nodes{opacity:.32}
.hm-orbit.in .hm-nodes-t{opacity:.5}
.hm-nodes circle{fill:#050d1a;stroke:currentColor}
.hm-arc{stroke-width:1;opacity:.25}
.hm-cyclehead{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,300px);gap:clamp(20px,4vw,64px);align-items:center}
.hm-orbit--cycle{justify-self:end;width:min(100%,300px)}
/* barra do topo dos cartoes do ciclo: "traca" da esquerda p/ direita */
.hm-step::before{transform:scaleX(0);transform-origin:left;transition:transform 1.2s var(--ease) .25s}
.hm-step.in::before{transform:scaleX(1)}
@media (max-width:760px){
  .hm-cyclehead{grid-template-columns:1fr}
  .hm-orbit--cycle{justify-self:center;width:min(78%,260px);margin-top:6px}
  .hm-orbit--hero{width:130%}
}
@media (prefers-reduced-motion:reduce){
  .hm-draw{stroke-dashoffset:0;transition:none}
  .hm-dots{opacity:.38;transition:none}.hm-nodes{opacity:.32;transition:none}.hm-nodes-t{opacity:.5;transition:none}
  .hm-step::before{transform:none;transition:none}
  .hm-orbit--hero[data-reveal]{transform:translate(-50%,-50%)}
}

/* --- 4. Tipografia mais fina, nitida e menor (so Home) --- */
.hm-hero h1{font-size:clamp(1.9rem,1.1rem + 3vw,3.15rem);font-weight:500;letter-spacing:-.036em;line-height:1.08}
.hm-hero h1 .g{font-weight:600}
.hm-hero .hm-lead,.hm .s-head .hm-sub,.hm-final .hm-sub{font-size:clamp(.94rem,.9rem + .22vw,1.04rem);line-height:1.68;letter-spacing:.004em;font-weight:400}
.hm .s-head h2{font-size:clamp(1.3rem,1.02rem + 1.2vw,1.72rem);font-weight:600;letter-spacing:-.03em;line-height:1.16}
.hm-final h2{font-size:clamp(1.45rem,1.05rem + 1.7vw,2.15rem);font-weight:600;letter-spacing:-.032em}
.hm .eyebrow,.hm-hero .eyebrow{font-size:.68rem;font-weight:600;letter-spacing:.16em}
.hm-chip{font-size:.64rem;letter-spacing:.06em;padding:4px 10px}
.hm-layer .k,.hm-case .tag,.hm-case dt,.hm-step .out b,.hm-lab,.hm-surface .k{font-size:.62rem;letter-spacing:.14em;font-weight:500}
.hm-layer h3,.hm-step h3,.hm-case h3,.hm-pillar h3,.hm-seal h3{font-size:.98rem;font-weight:600;letter-spacing:-.012em;line-height:1.25}
.hm-case h3,.hm-pillar h3{font-size:1.04rem}
.hm-layer p,.hm-step p,.hm-case dd,.hm-pillar p,.hm-seal p{font-size:.86rem;line-height:1.62;letter-spacing:.004em;font-weight:400}
.hm-step .out{font-size:.78rem}
.hm-pillar ul{font-size:.82rem}
.hm-cmp th,.hm-cmp td{font-size:.86rem;line-height:1.55;padding:14px 22px}
.hm-cmp tbody th{font-size:.88rem;font-weight:600}
.hm-cmp thead th{font-size:.64rem;letter-spacing:.14em;font-weight:500}
.hm-seal .fig{font-size:clamp(1.8rem,1.3rem + 1.8vw,2.5rem);font-weight:700;letter-spacing:-.034em}
.hm-note,.hm-final-note,.hm-cycle-cap{font-size:.74rem;letter-spacing:.02em}
.hm-link{font-size:.88rem;font-weight:500;letter-spacing:.005em}
.hm-cta .btn,.hm-final .btn{font-size:.82rem;font-weight:500;letter-spacing:.01em}
.hm-final .btn{font-size:.86rem}
/* tese Gartner (Home) */
.hm-thesis{margin-top:30px;padding:20px 24px 22px;border:1px solid rgba(159,176,198,.14);border-left:3px solid var(--accent-2);border-radius:var(--radius);background:rgba(9,19,36,.58)}
.hm-thesis h3{margin:0 0 8px;font-size:.98rem;font-weight:600;letter-spacing:-.01em;line-height:1.25}
.hm-thesis p{margin:0;max-width:92ch;font-size:.86rem;line-height:1.62;letter-spacing:.004em;color:var(--ink-dim)}
.hm-thesis p+p{margin-top:8px;color:var(--ink-2)}
/* ==========================================================================
   FAQ e paginas internas sobre o fundo cosmico: mesma linguagem das secoes premium da Home
   (cartoes translucidos com borda fria, filetes luminosos, foco com halo, glow sutil no campo de busca).
   ========================================================================== */
.hm-page .faq-hero{position:relative}
.hm-page .faq-hero::before{content:"";position:absolute;z-index:-1;inset:-10% -4% auto -4%;height:70%;pointer-events:none;
  background:radial-gradient(ellipse 52% 60% at 18% 0%,rgba(63,99,217,.20),rgba(63,99,217,0) 72%),
             radial-gradient(ellipse 40% 55% at 86% 8%,rgba(124,92,255,.14),rgba(124,92,255,0) 70%)}
.hm-page .faq-hero-card{position:relative;background:rgba(9,19,36,.70);border:1px solid rgba(159,176,198,.14);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05),0 14px 30px -22px rgba(0,0,0,.8);
  transition:border-color .22s var(--ease),transform .22s var(--ease),box-shadow .22s var(--ease)}
.hm-page .faq-hero-card:hover{border-color:rgba(120,170,255,.34);transform:translateY(-2px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 18px 34px -22px rgba(0,0,0,.85),0 0 24px -12px rgba(110,140,255,.45)}
.hm-page .faq-quicknav{background:rgba(2,4,8,.62);border-block-color:rgba(159,176,198,.12);
  -webkit-backdrop-filter:blur(14px) saturate(1.2);backdrop-filter:blur(14px) saturate(1.2)}
.hm-page .faq-search{background:rgba(9,19,36,.72);border-color:rgba(159,176,198,.18);
  transition:border-color .2s var(--ease),box-shadow .2s var(--ease)}
.hm-page .faq-search:focus-within{border-color:var(--accent-2);box-shadow:0 0 0 3px rgba(96,150,255,.14),0 0 24px -8px rgba(96,150,255,.5)}
.hm-page .faq-group{border-top-color:rgba(159,176,198,.12)}
.hm-page .faq-item{border-bottom-color:rgba(159,176,198,.10);transition:background .2s var(--ease)}
.hm-page .faq-item[open]{background:linear-gradient(90deg,rgba(96,150,255,.06),rgba(96,150,255,0) 70%)}
.hm-page .faq-item .chev,.hm-page .faq-group-head .chev{border-color:rgba(159,176,198,.22);background:rgba(9,19,36,.55)}
.hm-page .faq-cta,.hm-page .faq-no-results{background:rgba(9,19,36,.66);border-color:rgba(159,176,198,.14);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05),0 22px 44px -30px rgba(0,0,0,.85)}
.hm-page .faq-cta{position:relative;overflow:hidden}
.hm-page .faq-cta::before{content:"";position:absolute;inset:0 0 auto 0;height:1px;pointer-events:none;
  background:linear-gradient(90deg,rgba(96,150,255,0),rgba(96,150,255,.7),rgba(124,92,255,.7),rgba(96,150,255,0))}
/* Hero: sem botoes de CTA; cards System of Record/Engagement/Execution mais largos para o texto fechar em ate 2 linhas no desktop */
@media (min-width:961px){
  .hm-page .hm-hero .wrap{grid-template-columns:minmax(0,.78fr) minmax(0,1.12fr);gap:clamp(24px,3.6vw,56px)}
  .hm-hero .hm-chips{flex-wrap:wrap}
  .hm-hero .hm-layer{padding:14px 20px}
  .hm-hero .hm-layer.exe{padding:16px 20px}
  .hm-hero .hm-layer p{font-size:.82rem;line-height:1.5;max-width:none;text-wrap:balance}
}

/* Cenarios de Arquitetura: 4 cards em grid 2x2 (1 coluna no mobile), mais compactos */
.hm-cases{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:28px;grid-auto-rows:auto}
.hm-page .hm-case{gap:10px;padding:18px 22px}
.hm-case dl{gap:9px}
.hm-case dt{margin-bottom:3px}
.hm-page .hm-case h3{font-size:1rem}
.hm-page .hm-case dd{font-size:.84rem;line-height:1.5}
.hm-case dd .hm-chips{gap:5px}
@media (max-width:640px){
  .hm-cases{grid-template-columns:1fr;gap:12px}
  .hm-page .hm-case{padding:16px 18px}
}

/* Cenarios: subtitulo mais longo, area mais larga para fechar em poucas linhas */
#casos .s-head .hm-sub{max-width:92ch}

/* Hero: menos linhas atras dos cards (orbita reduzida e mais suave; cards mais opacos) */
.hm-hero .hm-draw{opacity:.14}
.hm-orbit.in .hm-dots{opacity:.26}
.hm-page .hm-hero .hm-layer{background:rgba(9,19,36,.84);-webkit-backdrop-filter:blur(1.5px);backdrop-filter:blur(1.5px)}
.hm-page .hm-hero .hm-layer.exe{background:rgba(23,50,74,.82)}