/* ==========================================================================
   DozeHost — Base / reset / typography utilities
   ========================================================================== */

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

html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }

body {
  margin: 0;
  font-family: var(--font-body);
  font-size: var(--text-l-size);
  line-height: var(--text-l-lh);
  font-weight: var(--fw-regular);
  color: var(--c-ink);
  background: var(--c-white);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

img, video, svg { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; }
button { font: inherit; cursor: pointer; }
ul, ol { margin: 0; padding: 0; list-style: none; }

h1, h2, h3, h4, h5, h6 {
  margin: 0;
  font-family: var(--font-heading);
  font-weight: var(--fw-medium);
  color: inherit;
}

p { margin: 0; }
/* UA default is `margin: 1em 40px` — that indent squeezes quote cards. */
blockquote, figure, dl, dd { margin: 0; }

:focus-visible {
  outline: 2px solid var(--c-accent);
  outline-offset: 3px;
  border-radius: var(--radius-xs);
}

/* ---------- Title scale ---------- */
.title--7xl { font-family: var(--font-heading); font-weight: var(--fw-medium); font-size: var(--title-7xl-size); line-height: var(--title-7xl-lh); }
.title--6xl { font-family: var(--font-heading); font-weight: var(--fw-medium); font-size: var(--title-6xl-size); line-height: var(--title-6xl-lh); }
.title--5xl { font-family: var(--font-heading); font-weight: var(--fw-medium); font-size: var(--title-5xl-size); line-height: var(--title-5xl-lh); }
.title--4xl { font-family: var(--font-heading); font-weight: var(--fw-medium); font-size: var(--title-4xl-size); line-height: var(--title-4xl-lh); }
.title--3xl { font-family: var(--font-heading); font-weight: var(--fw-medium); font-size: var(--title-3xl-size); line-height: var(--title-3xl-lh); }
.title--2xl { font-family: var(--font-heading); font-weight: var(--fw-medium); font-size: var(--title-2xl-size); line-height: var(--title-2xl-lh); }
.title--xl  { font-family: var(--font-heading); font-weight: var(--fw-medium); font-size: var(--title-xl-size);  line-height: var(--title-xl-lh); }
.title--l   { font-family: var(--font-heading); font-weight: var(--fw-medium); font-size: var(--title-l-size);   line-height: var(--title-l-lh); }

/* ---------- Text scale ---------- */
.text--l   { font-family: var(--font-body);    font-weight: var(--fw-regular);  font-size: var(--text-l-size);   line-height: var(--text-l-lh); }
.text--m   { font-family: var(--font-heading); font-weight: var(--fw-medium);   font-size: var(--text-m-size);   line-height: var(--text-m-lh); }
.text--2xs { font-family: var(--font-heading); font-weight: var(--fw-semibold); font-size: var(--text-2xs-size); line-height: var(--text-2xs-lh); }
.text--3xs { font-family: var(--font-body);    font-weight: var(--fw-semibold); font-size: var(--text-3xs-size); line-height: var(--text-3xs-lh); }

/* ---------- Color utilities ---------- */
.text--white { color: var(--c-white); }
.text--ink   { color: var(--c-ink); }
.text--muted { color: var(--c-gray); }
.text--accent{ color: var(--c-accent); }
.text--center{ text-align: center; }

.bg--white { background: var(--c-white); color: var(--c-ink); }
.bg--dark  { background: var(--c-surface); color: var(--c-ink); }
.bg--black { background: var(--c-surface); color: var(--c-ink); }
.bg--tint  { background: var(--c-accent-tint); color: var(--c-ink); }

/* ---------- Helpers ---------- */
.u-hide { display: none !important; }
.u-mt-2 { margin-top: var(--sp-2); }
.u-mt-3 { margin-top: var(--sp-3); }
.u-mt-4 { margin-top: var(--sp-4); }
.u-mt-5 { margin-top: var(--sp-5); }
.u-mt-6 { margin-top: var(--sp-6); }
.u-mt-8 { margin-top: var(--sp-8); }
.u-max-58 { max-width: 580px; }
.u-max-72 { max-width: 720px; }
.u-mx-auto { margin-left: auto; margin-right: auto; }

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

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    transition-duration: 0.01ms !important;
  }
}