/*
Theme Name: OS
Theme URI: https://trailbase.app/
Author: Origin Studio
Description: Minimalistisch maatwerkthema voor volledig custom gebouwde WordPress-pagina's.
Version: 1.15.8
Requires at least: 6.6
Requires PHP: 7.4
Text Domain: os
*/

:root {
  --os-ink: #151515;
  --os-paper: #ffffff;
  --os-accent: #bc3411;
  --os-content-width: 1600px;
  --os-gutter: clamp(20px, 4vw, 64px);
  --os-font-sans: "Roobert", -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
}

html {
  min-height: 100%;
  color-scheme: light;
  scroll-behavior: smooth;
  text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
}

body {
  min-height: 100%;
  margin: 0;
  background: var(--os-paper);
  color: var(--os-ink);
  font-family: var(--os-font-sans);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

body.os-projects-page {
  height: 100dvh;
  overflow: hidden;
  overscroll-behavior: none;
}

body.os-projects-page .os-projects3d {
  height: 100dvh;
  min-height: 0;
}

body.admin-bar.os-projects-page .os-projects3d {
  height: calc(100dvh - 32px);
}

@media (max-width: 782px) {
  body.admin-bar.os-projects-page .os-projects3d {
    height: calc(100dvh - 46px);
  }
}

/* One typographic system across content, navigation and controls. */
body :where(h1, h2, h3, h4, h5, h6, p, a, button, input, select, textarea, label, li, span, strong, small, blockquote, figcaption):not(.dashicons) {
  font-family: var(--os-font-sans);
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

img,
picture,
svg,
video,
canvas {
  display: block;
  max-width: 100%;
}

button,
input,
select,
textarea {
  color: inherit;
  font: inherit;
}

a {
  color: inherit;
}

.os-site-main,
.os-entry-content {
  width: 100%;
  min-width: 0;
}

.os-site-main {
  min-height: 100svh;
}

.os-shell {
  width: min(calc(100% - (2 * var(--os-gutter))), var(--os-content-width));
  margin-inline: auto;
  padding-block: clamp(64px, 10vw, 144px);
}

.os-screen-reader-text {
  position: absolute !important;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.os-screen-reader-text:focus {
  position: fixed !important;
  top: 12px;
  left: 12px;
  z-index: 100000;
  width: auto;
  height: auto;
  padding: 12px 16px;
  margin: 0;
  overflow: visible;
  clip: auto;
  background: var(--os-ink);
  color: #fff;
}

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