:root {
  --mc-blue: #0754c9;
  --mc-bright-blue: #073ff1;
  --mc-navy: #071b55;
}

body.sytec-home-shell .sytec-site-header {
  position: relative;
  z-index: 20;
  background: #fff;
  box-shadow: 0 1px 0 rgba(7, 27, 85, .06);
}

body.sytec-home-shell .sytec-footer-row__inner.sytec-container {
  width: min(1360px, calc(100% - 64px));
  max-width: 1360px;
}

body.sytec-home-shell .sytec-header-row--top { --sytec-row-height: 30px !important; }
body.sytec-home-shell .sytec-header-row--main { --sytec-row-height: 78px !important; }
body.sytec-home-shell .sytec-header-row--bottom { --sytec-row-height: 58px !important; }
body.sytec-home-shell .sytec-header-row--top .sytec-header-row__inner { min-height: 30px; }
body.sytec-home-shell .sytec-header-row--main .sytec-header-row__inner { min-height: 78px; }
body.sytec-home-shell .sytec-header-row--bottom .sytec-header-row__inner { min-height: 58px; }
body.sytec-home-shell .sytec-header-row--top .sytec-header-zone--right { display: none; }


/*
 * SYTEC HOME SHELL
 * Header
 *
 * El diseño visual del header debe provenir del Header Builder.
 * Este archivo conserva únicamente soporte estructural del shell.
 */

body.sytec-home-shell .sytec-site-header {
  position: relative;
  z-index: 20;
}

/*
 * El Header Builder controla:
 * - width / boxed / full
 * - alturas
 * - fondos
 * - colores
 * - distribución
 */

body.sytec-home-shell
.sytec-builder-header__device--desktop
.sytec-header-row__inner {
  grid-template-columns: var(--sytec-row-columns);
}

/*
 * Las zonas deben respetar la distribución generada por el Builder.
 */

body.sytec-home-shell .sytec-header-zone {
  min-width: 0;
  pointer-events: auto;
}

body.sytec-home-shell .sytec-header-zone--align-start {
  justify-content: flex-start;
}

body.sytec-home-shell .sytec-header-zone--align-center {
  justify-content: center;
}

body.sytec-home-shell .sytec-header-zone--align-end {
  justify-content: flex-end;
}

/*
 * Responsive estructural.
 *
 * No se fijan colores, alturas, tamaños de logo,
 * estilos de carrito ni tipografía.
 */

@media (max-width: 1024px) {
  body.sytec-home-shell
  .sytec-builder-header__device--desktop:not(.sytec-sticky-header__device) {
    display: none;
  }

  body.sytec-home-shell
  .sytec-builder-header__device--mobile {
    display: block;
  }
}