/*
Theme Name: TinyTall
Theme URI: https://tinytall.org/
Description: Direction A child theme for Hello Elementor. Elementor owns page bodies and the global Header and Footer.
Author: TinyTall
Template: hello-elementor
Version: 1.0.2
Requires at least: 7.0
Requires PHP: 8.1
Text Domain: tinytall
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
*/

@font-face {
  font-family: "Instrument Sans Variable";
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url("assets/fonts/instrument-sans-latin-wght-normal.woff2") format("woff2");
}

@font-face {
  font-family: "Bodoni Moda";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("assets/fonts/bodoni-moda-latin-400-normal.woff2") format("woff2");
}

:root {
  --tt-color-night: #0a1117;
  --tt-color-ink: #111820;
  --tt-color-paper: #f4f3ef;
  --tt-color-panel: #f0f0ed;
  --tt-color-laurel: #526a5a;
  --tt-color-gold: #c3a06f;
  --tt-color-prayer: #4f5f6f;
  --tt-color-contact: #4f6b66;
  --tt-font-body: "Instrument Sans Variable", "Instrument Sans", system-ui, sans-serif;
  --tt-font-display: "Bodoni Moda", Georgia, serif;
  --tt-page-width: min(1360px, calc(100vw - 96px));
  --tt-section-space: clamp(72px, 8vw, 128px);
  --tt-focus-inner: 0 0 0 2px var(--tt-color-paper);
  --tt-focus-outer: 0 0 0 5px var(--tt-color-ink);
}

html {
  scroll-behavior: smooth;
}

body {
  min-width: 320px;
  margin: 0;
  overflow-x: clip;
  background: var(--tt-color-paper);
  color: var(--tt-color-ink);
  font-family: var(--tt-font-body);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

:where(button, input, select, textarea) {
  font: inherit;
}

:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
  outline: 2px solid transparent;
  outline-offset: 3px;
  box-shadow: var(--tt-focus-inner), var(--tt-focus-outer);
}

:where(h1, h2, h3, h4, h5, h6) {
  text-wrap: balance;
}

:where(p, li, blockquote) {
  text-wrap: pretty;
}

.tt-display-type {
  font-family: var(--tt-font-display);
  font-weight: 400;
}

.tt-page-width {
  width: var(--tt-page-width);
  margin-inline: auto;
}

.tt-section-space {
  padding-block: var(--tt-section-space);
}

.tt-visually-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

body.elementor-page .site-main {
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
}

body.elementor-page .page-header {
  display: none;
}

.elementor-location-header,
.elementor-location-footer {
  width: 100%;
}

@media (max-width: 1024px) {
  :root {
    --tt-page-width: min(100% - 64px, 1360px);
  }
}

@media (max-width: 600px) {
  :root {
    --tt-page-width: min(100% - 40px, 1360px);
  }
}

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

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