/* 261009 — correcoes medidas em 1440/390: colisao com HUD, leitura e grid WP. */

/* O Sobre continua a esquerda, depois da coluna fixa do HS (340 px em 1920). */
:is(body.hs-front,.editor-styles-wrapper) .hs-sobre-ph{
  padding-left:clamp(240px,17.70833333vw,420px);
}
/* O SVG do nome preserva os paths; sobre fundo claro a tinta precisa escurecer. */
html:not([data-modo="roxo"]):not([data-modo="escuro"]) body.hs-front.hs-hud-claro #hs-name-lockup .hs-name-figma{
  filter:brightness(0);
}

@media(max-width:820px){
  /* A variavel deve estar na raiz: o valor do body era sobrescrito pelo case. */
  body.hs-case-page,.hs-case-v2{--margin:20px}
  /* O wrapper do Gutenberg usa display:contents. Selecionar os spans reais. */
  .hsc-grid .span-3,.hsc-grid .span-4,.hsc-grid .span-5,
  .hsc-grid .span-6,.hsc-grid .span-8,.hsc-grid .span-12{grid-column:1/-1!important}
  .hs-case-v2 .hsc-wrap{width:auto;margin-left:20px;margin-right:60px}
  .hs-case-v2 .hsc-title:not(.hsc-title--long){font-size:clamp(38px,11vw,56px)}
  .hs-case-v2 .hsc-head{gap:28px}

  /* HUD compacto no alto; a primeira linha do case nasce abaixo dessa faixa. */
  body #hs-nav{top:24px;left:20px;width:84px;transform:none}
  /* Pequeno fundo sob a marca: texto em movimento nao se mistura com o HS. */
  body #hs-nav{--hs-hud-surface:#19191e}
  body #hs-nav::before{
    content:"";position:absolute;left:-8px;top:-8px;width:68px;height:100px;
    background:var(--hs-hud-surface);border-radius:6px;pointer-events:none;z-index:-1;
  }
  body.hs-front #hs-nav::before{width:170px;height:112px}
  html:not([data-modo="roxo"]):not([data-modo="escuro"]) body.hs-front.hs-hud-claro #hs-nav{--hs-hud-surface:#e3f7ff}
  html[data-modo="roxo"] body.hs-front #hs-nav{--hs-hud-surface:#150a2d}
  html[data-modo="escuro"] body.hs-front #hs-nav{--hs-hud-surface:#121218}
  body #hs-name-lockup{left:57%;right:auto;top:22%;width:122%;height:42%;text-align:left;align-items:flex-start}
  body.hs-front #hs-name-lockup .hs-name-figma{object-position:left center}
  .hs-case-v2,html.hs-embed .hs-case-v2{padding-top:152px}
  :is(body.hs-front,.editor-styles-wrapper) .hs-sobre-ph{
    padding-top:170px;padding-left:20px;padding-right:76px;
  }
  :is(body.hs-front,.editor-styles-wrapper) .hs-sobre-ph .hs-ph-contatos{margin-top:36px}
  a.hs-voltar{left:20px;top:auto;bottom:16px}
}