/* ════════════════════════════════════════════════════════════════
   CREATIVE CORE · NEOBRUTALISM — CAMADA DE PADRONIZAÇÃO
   Escopo: html.cc-brut  ·  Carregada por último (vence a cascata)

   Objetivo: unificar TODA a home num único sistema neobrutalista.
   Regra-mãe:  cantos 100% retos  +  borda sólida  +  UMA sombra dura
               +  hover tátil idêntico em toda peça enquadrada.

   Aditivo e reversível: não mexe em layout, posição ou cor de fundo —
   só uniformiza borda / raio / sombra / hover. Some o link e o visual
   antigo volta inteiro.
   ════════════════════════════════════════════════════════════════ */

:root{
  /* — paleta herdada (não inventa cor nova) — */
  /* — moldura/sombra: TEMA-AWARE —
     Claro (padrão): tinta navy da marca · Escuro: branco.
     Os tokens de sombra abaixo referenciam --nb-edge, então viram
     navy ou branco sozinhos conforme o tema ativo. */
  --nb-edge:      rgba(3,17,82,.9);    /* claro: navy */
  --nb-edge-soft: rgba(3,17,82,.4);
  --nb-ink:   #05070f;                 /* tinta escura (controles cheios) */
  --nb-acc:   #FF3D14;                 /* laranja da marca */
  --nb-cyan:  #19E0FF;

  /* — espessura de borda: 4 níveis, sempre os mesmos — */
  --nb-bw:        3px;    /* superfícies (cards, painéis) */
  --nb-bw-ctrl: 2.5px;    /* controles preenchidos (botões) */
  --nb-bw-field:  2px;    /* inputs / links com moldura */
  --nb-bw-chip: 1.5px;    /* tags / chips */

  /* — UMA régua de offset para a sombra dura — */
  --nb-off:       6px;
  --nb-off-press: 9px;

  /* — sombras padrão (sólidas, zero blur) — */
  --nb-shadow:        6px 6px 0 0 var(--nb-edge);
  --nb-shadow-acc:    9px 9px 0 0 var(--nb-acc);
  --nb-shadow-sm:     4px 4px 0 0 var(--nb-edge);
  --nb-shadow-sm-acc: 6px 6px 0 0 var(--nb-acc);
  --nb-shadow-ink:    5px 5px 0 0 var(--nb-ink);

  /* — transição tátil única — */
  --nb-snap: transform .13s cubic-bezier(.2,.85,.25,1),
             box-shadow .13s cubic-bezier(.2,.85,.25,1),
             border-color .13s linear;
}

/* TEMA ESCURO — moldura/sombra brancas (a home é sempre escura) */
html.cc-force-dark,
html.cc-force-dark body,
body.dark-theme{
  --nb-edge:      rgba(255,255,255,.92);
  --nb-edge-soft: rgba(255,255,255,.55);
}

/* ─────────────────────────────────────────────────────────
   0 · CANTOS RETOS — trava o raio em tudo que enquadra
   ───────────────────────────────────────────────────────── */
html.cc-brut body :is(
  .spec-card, .test-card, .testimonial-card, .pricing-card, .guarantee-item,
  .clients-sec__logo-item, .cs-panel, .bento-case, .team-card, .value-card,
  .work-card, .industry-card, .blog-card, .svp-dcard, .faq-item, .signup-strip,
  .proof__quote, .btn-nav-cta, .btn-hero, .sc-cta, .cs-cta, .clients-sec__link,
  .footer-contact-link, .footer-news-form, .footer-news-form input,
  .footer-news-form button, .footer-social__tag, .sc-tag, .cl-tag, .tc-head__tag,
  .ctaform input, .ctaform textarea, .ctaform__submit, .tc-metric, .sc-spec,
  .cl-status, .cs-tele, .tca-avatar, .proof__avatar
){ border-radius: 0 !important; }

/* ═════════════════════════════════════════════════════════
   1 · SUPERFÍCIES — borda 3px + sombra dura 6px + hover tátil
   O padrão visual da home inteira. Idêntico em cada card.
   ═════════════════════════════════════════════════════════ */
html.cc-brut body :is(
  .spec-card, .test-card, .pricing-card, .guarantee-item,
  .clients-sec__logo-item, .team-card, .value-card, .work-card,
  .industry-card, .blog-card, .svp-dcard
){
  border: var(--nb-bw) solid var(--nb-edge) !important;
  box-shadow: var(--nb-shadow) !important;
  transition: var(--nb-snap) !important;
}

/* hover sem tilt-JS → levanta e acende a sombra laranja */
html.cc-brut body :is(
  .spec-card, .test-card, .clients-sec__logo-item, .team-card,
  .value-card, .work-card, .industry-card, .blog-card, .svp-dcard
):hover{
  transform: translate(-3px,-3px) !important;
  box-shadow: var(--nb-shadow-acc) !important;
  border-color: var(--nb-acc) !important;
}

/* cards com tilt-JS (transform inline) → só a sombra muda, sem brigar */
html.cc-brut body :is(.pricing-card, .guarantee-item, .testimonial-card):hover{
  box-shadow: var(--nb-shadow-acc) !important;
  border-color: var(--nb-acc) !important;
}
html.cc-brut body .testimonial-card{
  border: var(--nb-bw) solid var(--nb-edge) !important;
  box-shadow: var(--nb-shadow) !important;
  transition: var(--nb-snap) !important;
}

/* painel de case (stack com sticky) entra no mesmo sistema */
html.cc-brut body .cs-panel{
  border: var(--nb-bw) solid var(--nb-edge) !important;
  box-shadow: var(--nb-shadow) !important;
  transition: var(--nb-snap) !important;
}
html.cc-brut body .cs-panel:hover{
  box-shadow: var(--nb-shadow-acc) !important;
  border-color: var(--nb-acc) !important;
}

/* ═════════════════════════════════════════════════════════
   2 · CONTROLES PREENCHIDOS — CTA laranja
   borda tinta · sombra dura branca (pop no dark) · press tátil
   ═════════════════════════════════════════════════════════ */
html.cc-brut body :is(.btn-nav-cta, .btn-hero){
  border: var(--nb-bw-ctrl) solid var(--nb-ink) !important;
  box-shadow: var(--nb-shadow-sm) !important;
  transition: var(--nb-snap) !important;
}
html.cc-brut body :is(.btn-nav-cta, .btn-hero):hover{
  transform: translate(-2px,-2px) !important;
  box-shadow: var(--nb-shadow-sm-acc) !important;
}
html.cc-brut body :is(.btn-nav-cta, .btn-hero):active{
  transform: translate(2px,2px) !important;
  box-shadow: 1px 1px 0 0 var(--nb-edge) !important;
}

/* CTAs vazados (ghost) — moldura + sombra menor, mesmo idioma */
html.cc-brut body :is(.sc-cta, .cs-cta, .clients-sec__link, .link-more){
  border: var(--nb-bw-field) solid var(--nb-edge-soft) !important;
  box-shadow: var(--nb-shadow-sm) !important;
  transition: var(--nb-snap) !important;
}
html.cc-brut body :is(.sc-cta, .cs-cta, .clients-sec__link, .link-more):hover{
  transform: translate(-2px,-2px) !important;
  box-shadow: var(--nb-shadow-sm-acc) !important;
  border-color: var(--nb-acc) !important;
}

/* ═════════════════════════════════════════════════════════
   3 · CAMPOS DE FORMULÁRIO — borda 2px · foco com sombra dura
   ═════════════════════════════════════════════════════════ */
html.cc-brut body :is(.ctaform input, .ctaform textarea, .footer-news-form input){
  border: var(--nb-bw-field) solid var(--nb-edge-soft) !important;
  box-shadow: none !important;
  transition: var(--nb-snap) !important;
}
html.cc-brut body :is(.ctaform input, .ctaform textarea, .footer-news-form input):focus{
  outline: none !important;
  border-color: var(--nb-acc) !important;
  box-shadow: var(--nb-shadow-sm-acc) !important;
}
/* botão de envio dos forms = bloco cheio com sombra dura */
html.cc-brut body :is(.ctaform__submit, .footer-news-form button){
  border: var(--nb-bw-ctrl) solid var(--nb-ink) !important;
  box-shadow: var(--nb-shadow-sm) !important;
  transition: var(--nb-snap) !important;
}
html.cc-brut body :is(.ctaform__submit, .footer-news-form button):hover{
  transform: translate(-2px,-2px) !important;
  box-shadow: var(--nb-shadow-sm-acc) !important;
}

/* contato no footer = item com moldura consistente */
html.cc-brut body .footer-contact-link{
  border: var(--nb-bw-field) solid var(--nb-edge-soft) !important;
  box-shadow: var(--nb-shadow-sm) !important;
  transition: var(--nb-snap) !important;
}
html.cc-brut body .footer-contact-link:hover{
  transform: translate(-2px,-2px) !important;
  box-shadow: var(--nb-shadow-sm-acc) !important;
  border-color: var(--nb-acc) !important;
}

/* ═════════════════════════════════════════════════════════
   4 · PEÇAS ANTES SEM SISTEMA — FAQ, signup, proof
   Ganham a mesma moldura para fechar o padrão.
   ═════════════════════════════════════════════════════════ */
html.cc-brut body .faq-item{
  border: var(--nb-bw-field) solid var(--nb-edge-soft) !important;
  box-shadow: var(--nb-shadow-sm) !important;
  transition: var(--nb-snap) !important;
}
html.cc-brut body .faq-item:hover,
html.cc-brut body .faq-item[open]{
  border-color: var(--nb-acc) !important;
  box-shadow: var(--nb-shadow-sm-acc) !important;
}

html.cc-brut body .signup-strip,
html.cc-brut body .proof__quote{
  border: var(--nb-bw) solid var(--nb-edge) !important;
  box-shadow: var(--nb-shadow) !important;
}
html.cc-brut body .proof__quote{ transition: var(--nb-snap) !important; }
html.cc-brut body .proof__quote:hover{
  transform: translate(-3px,-3px) !important;
  box-shadow: var(--nb-shadow-acc) !important;
  border-color: var(--nb-acc) !important;
}

/* ═════════════════════════════════════════════════════════
   5 · CHIPS / TAGS — moldura fina uniforme (flat, sem sombra)
   ═════════════════════════════════════════════════════════ */
html.cc-brut body :is(.sc-tag, .footer-social__tag){
  border: var(--nb-bw-chip) solid rgba(255,61,20,.55) !important;
  background: rgba(255,61,20,.07) !important;
  transition: var(--nb-snap) !important;
}
html.cc-brut body :is(.sc-tag, .footer-social__tag):hover{
  background: var(--nb-acc) !important;
  color: var(--nb-ink) !important;
  border-color: var(--nb-acc) !important;
}

/* avatares quadrados com moldura dura (depoimentos / prova) */
html.cc-brut body :is(.tca-avatar, .proof__avatar){
  border: var(--nb-bw-field) solid var(--nb-edge) !important;
  box-shadow: var(--nb-shadow-sm) !important;
}

/* ═════════════════════════════════════════════════════════
   6 · REFORÇO GLOBAL — nada arredondado escapa
   ═════════════════════════════════════════════════════════ */
html.cc-brut body .nav-header,
html.cc-brut body .mobile-menu__inner,
html.cc-brut body .nav-account__pop,
html.cc-brut body .marquee-strip{ border-radius: 0 !important; }

/* respiro p/ a sombra não encostar no vizinho na grade de clientes */
html.cc-brut body .clients-sec__logos{ gap: 18px !important; }

/* ═════════════════════════════════════════════════════════
   7 · OVERRIDES DE ESPECIFICIDADE
   Regras antigas body.dark-theme .*--cockpit .* ganhavam da
   camada → reescritas aqui com peso maior p/ fechar o padrão.
   ═════════════════════════════════════════════════════════ */
html.cc-brut body.dark-theme .clients-sec--cockpit .clients-sec__logo-item,
html.cc-brut body.dark-theme .clients-sec__logo-item{
  border: var(--nb-bw) solid var(--nb-edge) !important;
  box-shadow: var(--nb-shadow) !important;
}
html.cc-brut body.dark-theme .clients-sec--cockpit .clients-sec__logo-item:hover,
html.cc-brut body.dark-theme .clients-sec__logo-item:hover{
  transform: translate(-3px,-3px) !important;
  box-shadow: var(--nb-shadow-acc) !important;
  border-color: var(--nb-acc) !important;
}
/* chips: largura de borda uniforme mesmo sob seletores compostos */
html.cc-brut body.dark-theme .spec-card--cockpit .sc-tag,
html.cc-brut body.dark-theme .sc-tag{
  border: var(--nb-bw-chip) solid rgba(255,61,20,.55) !important;
}

/* spec-card: borda inteira branca (vence border-*-color !important antigos) */
html.cc-brut body.dark-theme .spec-list .spec-card,
html.cc-brut body.dark-theme .spec-list .spec-card:first-child{
  border-color: var(--nb-edge) !important;
}

/* footer: vence a regra-coringa body.dark-theme [class*="footer"] (0,4,1) */
html.cc-brut body.dark-theme .footer--cockpit .footer-contact-link:not(.footer-contact-link--wa),
html.cc-brut body.dark-theme .footer--cockpit .footer-news-form input{
  border: var(--nb-bw-field) solid var(--nb-edge-soft) !important;
}
html.cc-brut body.dark-theme .footer--cockpit .footer-contact-link--wa{
  border: var(--nb-bw-field) solid rgba(37,211,102,.6) !important;
}
html.cc-brut body.dark-theme .footer--cockpit .footer-news-form button{
  border: var(--nb-bw-ctrl) solid var(--nb-ink) !important;
}

@media (prefers-reduced-motion: reduce){
  html.cc-brut body :is(
    .spec-card,.test-card,.testimonial-card,.pricing-card,.guarantee-item,
    .clients-sec__logo-item,.cs-panel,.proof__quote,.btn-nav-cta,.btn-hero,
    .sc-cta,.cs-cta,.footer-contact-link,.faq-item
  ):hover{ transform: none !important; }
}
