/*
==============================================================================
SANOME CSS ARCHITECTURE
HEADER — CANONICAL CONTRACT V1
SN_CSS_ARCH_HEADER_CANONICAL_V1
==============================================================================

Fonte canônica futura do Header público.

IMPORTANTE:
- este arquivo permanece DESLIGADO do runtime nesta fase;
- reproduz o comportamento visual atual;
- não normaliza breakpoints históricos;
- não incorpora .sn-nav-* da Home;
- não altera o comportamento atual de Header estático;
- regras antigas do sanome-main.min.css permanecem intactas.

Estrutura HTML atual:
  .sn-site-header
    .sn-header-inner
      .sn-logo.sn-logo-img-link
        .sn-logo-img
      .sn-header-contact-phone
        .sn-header-contact-phone-icon

==============================================================================
*/


/* ==========================================================================
   ROOT
   ========================================================================== */

.sn-site-header {
  background: var(--sn-dark) !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.035) !important;
  box-shadow: none !important;

  /*
   * Estado efetivo atual:
   * o Header NÃO acompanha a rolagem.
   */
  position: static !important;
  top: auto !important;
  left: auto !important;
  right: auto !important;
  transform: none !important;

  z-index: 900 !important;
}

.sn-site-header::after {
  display: none !important;
  content: none !important;
}


/* ==========================================================================
   INNER CONTAINER
   ========================================================================== */

.sn-site-header .sn-header-inner {
  width: 100% !important;
  max-width: 80rem !important;

  margin-left: auto !important;
  margin-right: auto !important;

  padding-left: 1rem !important;
  padding-right: 1rem !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;

  box-sizing: border-box !important;

  display: flex !important;
  align-items: center !important;
  justify-content: space-between;
  gap: 28px;
  position: relative !important;

  background: #0d1117 !important;
}


/* ==========================================================================
   LOGO — BASE
   ========================================================================== */

.sn-site-header .sn-logo.sn-logo-img-link {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  align-self: center !important;

  overflow: hidden !important;

  line-height: 0 !important;

  padding: 0 !important;
  margin: 0 !important;

  transform: none !important;

  text-decoration: none !important;

  -webkit-tap-highlight-color: transparent;
}

.sn-site-header .sn-logo-img,
.sn-site-header .sn-logo img {
  display: block !important;

  height: auto !important;

  object-fit: contain !important;
  object-position: center center !important;

  transform: none !important;

  margin: 0 !important;
  padding: 0 !important;
}


/* ==========================================================================
   CONTACT PHONE — DESKTOP DEFAULT
   ========================================================================== */

.sn-site-header .sn-header-contact-phone {
  margin-left: auto;

  display: inline-flex;
  align-items: center;
  justify-content: flex-end;

  gap: 7px;

  color: #a8bfd8;

  font-family: "Montserrat", sans-serif;
  font-size: 13px;
  font-weight: 500;
  line-height: 1;
  letter-spacing: 0.04em;

  white-space: nowrap;

  cursor: default;
  user-select: text;
}

.sn-site-header .sn-header-contact-phone-icon {
  display: block;

  width: 16px;
  height: 16px;

  flex: 0 0 16px;

  fill: #25d366;
}


/* ==========================================================================
   MOBILE — até 767px
   ========================================================================== */

@media (max-width: 767px) {

  :root {
    --sn-site-header-height: 52px !important;
  }

  .sn-site-header {
    min-height: 52px !important;
    height: 52px !important;
  }

  .sn-site-header .sn-header-inner {
    min-height: 52px !important;
    height: 52px !important;
  }

  .sn-site-header .sn-logo.sn-logo-img-link {
    /*
     * O antigo bloco consolidado dava 52px ao link,
     * mas o fix posterior reduz a área clicável efetiva para 30px.
     */
    height: 30px !important;
    min-height: 30px !important;

    width: 122px !important;
    max-width: 122px !important;
    flex: 0 0 122px !important;
  }

  .sn-site-header .sn-logo-img,
  .sn-site-header .sn-logo img {
    width: 122px !important;
    max-width: 122px !important;

    max-height: 30px !important;
  }

  .sn-site-header .sn-header-contact-phone {
    font-size: 12px;
    gap: 5px;
    letter-spacing: 0;
  }

  .sn-site-header .sn-header-contact-phone-icon {
    width: 15px;
    height: 15px;
    flex-basis: 15px;
  }
}


/* ==========================================================================
   BORDA HISTÓRICA — exatamente 768px
   ========================================================================== */

@media (width: 768px) {

  :root {
    --sn-site-header-height: 64px !important;
  }

  .sn-site-header {
    min-height: 64px !important;
    height: 64px !important;
  }

  .sn-site-header .sn-header-inner {
    min-height: 64px !important;
    height: 64px !important;
  }

  .sn-site-header .sn-logo.sn-logo-img-link {
    /*
     * Em 768px:
     * - o layout já usa dimensões desktop;
     * - o fix max-width:768px mantém área clicável em 30px.
     */
    height: 30px !important;
    min-height: 30px !important;

    width: 132px !important;
    max-width: 132px !important;
    flex: 0 0 132px !important;
  }

  .sn-site-header .sn-logo-img,
  .sn-site-header .sn-logo img {
    width: 132px !important;
    max-width: 132px !important;

    max-height: 32px !important;
  }
}


/* ==========================================================================
   DESKTOP — 769px+
   ========================================================================== */

@media (min-width: 769px) {

  :root {
    --sn-site-header-height: 64px !important;
  }

  .sn-site-header {
    min-height: 64px !important;
    height: 64px !important;
  }

  .sn-site-header .sn-header-inner {
    min-height: 64px !important;
    height: 64px !important;
  }

  .sn-site-header .sn-logo.sn-logo-img-link {
    height: 32px !important;
    min-height: 32px !important;

    width: 132px !important;
    max-width: 132px !important;
    flex: 0 0 132px !important;
  }

  .sn-site-header .sn-logo-img,
  .sn-site-header .sn-logo img {
    width: 132px !important;
    max-width: 132px !important;

    max-height: 32px !important;
  }
}


/* ==========================================================================
   END
   ========================================================================== */
