/*
Theme Name: Mokili Hub
Theme URI: https://mokilihub.com/
Author: Mokili Hub
Author URI: https://mokilihub.com/
Description: Tema de blocos oficial da Mokili Hub, preparado para uma experiência editorial controlada e componentes próprios.
Requires at least: 6.6
Requires PHP: 7.4
Version: 0.1.0
Text Domain: mokili-hub
*/

@font-face {
  font-family: "Albert Sans";
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("./assets/fonts/albert-sans-latin-variable.woff2") format("woff2");
}

@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("./assets/fonts/inter-latin-variable.woff2") format("woff2");
}

:where(html) {
  scroll-behavior: smooth;
}

:where(body) {
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

:where(a, button, input, select, textarea):focus-visible {
  outline: 3px solid var(--wp--preset--color--cyan);
  outline-offset: 3px;
}

.mokili-site-header {
  position: relative;
  z-index: 20;
  border-bottom: 1px solid color-mix(in srgb, var(--wp--preset--color--navy) 10%, transparent);
  background: color-mix(in srgb, var(--wp--preset--color--white) 94%, transparent);
  backdrop-filter: blur(16px);
}

.mokili-site-header__inner,
.mokili-site-footer__inner,
.mokili-section-shell {
  width: min(100% - 2rem, var(--wp--style--global--wide-size));
  margin-inline: auto;
}

.mokili-site-footer {
  border-top: 1px solid color-mix(in srgb, var(--wp--preset--color--white) 14%, transparent);
}

.mokili-eyebrow {
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.mokili-card {
  border: 1px solid color-mix(in srgb, var(--wp--preset--color--navy) 10%, transparent);
  box-shadow: 0 24px 70px rgb(14 27 51 / 8%);
}

.mokili-gradient-panel {
  background:
    radial-gradient(circle at 85% 15%, rgb(45 168 255 / 22%), transparent 34%),
    linear-gradient(135deg, var(--wp--preset--color--navy), var(--wp--preset--color--navy-2));
}

@media (min-width: 782px) {
  .mokili-site-header {
    position: sticky;
    top: 0;
  }
}

@media (prefers-reduced-motion: reduce) {
  :where(html) {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
  }
}