:root {
  --bar-h: 80px;
  --hero-h: clamp(360px, calc(100vh - 220px), 56.25vw);
  --cara-pos: center center;
  --hero-scrim: linear-gradient(to right, rgba(20, 18, 17, 0.6) 0%, rgba(20, 18, 17, 0.3) 40%, rgba(20, 18, 17, 0) 65%);
}
html, body { height: 100%; }
body { margin: 0; background: #1C1918; }
input, textarea, button { font: inherit; }

.nav-mobile[hidden], .menu-toggle svg[hidden] { display: none !important; }

@media (min-width: 861px) {
  .menu-toggle, .nav-mobile { display: none !important; }
}
@media (max-width: 860px) {
  :root { --bar-h: 72px; }
  .nav-desktop { display: none !important; }
}
@media (max-width: 760px) {
  :root { --hero-h: 392px; --cara-pos: 80% center; --hero-scrim: linear-gradient(rgba(20, 18, 17, 0.45), rgba(20, 18, 17, 0.45)); }
}
