/*
 * Base layer: self-hosted fonts, reset, typography, accessibility helpers, keyframes, reduced motion.
 * The reset is the subset of Tailwind's "preflight" that the original site relied on.
 */

/* ---- Fonts (variable WOFF2, same files and unicode ranges as Google Fonts serves) ---- */

@font-face {
  font-family: Inter;
  font-style: normal;
  font-weight: 400 900;
  font-display: swap;
  src: url("../fonts/inter-latin.woff2") format("woff2");
  unicode-range: u+0000-00ff, u+0131, u+0152-0153, u+02bb-02bc, u+02c6, u+02da, u+02dc, u+0304, u+0308, u+0329,
    u+2000-206f, u+20ac, u+2122, u+2191, u+2193, u+2212, u+2215, u+feff, u+fffd;
}

@font-face {
  font-family: Inter;
  font-style: normal;
  font-weight: 400 900;
  font-display: swap;
  src: url("../fonts/inter-latin-ext.woff2") format("woff2");
  unicode-range: u+0100-02ba, u+02bd-02c5, u+02c7-02cc, u+02ce-02d7, u+02dd-02ff, u+0304, u+0308, u+0329,
    u+1d00-1dbf, u+1e00-1e9f, u+1ef2-1eff, u+2020, u+20a0-20ab, u+20ad-20c4, u+2113, u+2c60-2c7f, u+a720-a7ff;
}

@font-face {
  font-family: Manrope;
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
  src: url("../fonts/manrope-latin.woff2") format("woff2");
  unicode-range: u+0000-00ff, u+0131, u+0152-0153, u+02bb-02bc, u+02c6, u+02da, u+02dc, u+0304, u+0308, u+0329,
    u+2000-206f, u+20ac, u+2122, u+2191, u+2193, u+2212, u+2215, u+feff, u+fffd;
}

@font-face {
  font-family: Manrope;
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
  src: url("../fonts/manrope-latin-ext.woff2") format("woff2");
  unicode-range: u+0100-02ba, u+02bd-02c5, u+02c7-02cc, u+02ce-02d7, u+02dd-02ff, u+0304, u+0308, u+0329,
    u+1d00-1dbf, u+1e00-1e9f, u+1ef2-1eff, u+2020, u+20a0-20ab, u+20ad-20c4, u+2113, u+2c60-2c7f, u+a720-a7ff;
}

/* ---- Reset ---- */

*,
::before,
::after {
  box-sizing: border-box;
  border: 0 solid var(--border);
}

* {
  outline-color: hsl(var(--primary-hsl) / 50%);
}

html {
  line-height: 1.5;
  -webkit-text-size-adjust: 100%; /* stylelint-disable-line property-no-vendor-prefix -- still needed by iOS Safari */
  tab-size: 4;
  -webkit-tap-highlight-color: transparent;
  scroll-behavior: smooth; /* the original has no scroll-padding either: anchors land under the fixed header */
}

body {
  min-height: 100vh;
  margin: 0;
  background: #fff;
  color: var(--fg);
  font-family: var(--font-body);
  line-height: inherit;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

main:focus {
  outline: none;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  margin: 0;
  font-family: var(--font-heading);
  font-size: inherit;
  font-weight: inherit;
  letter-spacing: -0.025em;
}

p,
dl,
dd,
figure,
blockquote {
  margin: 0;
}

ol,
ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

a {
  color: inherit;
  text-decoration: inherit;
}

strong {
  font-weight: bolder;
}

button {
  margin: 0;
  padding: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  letter-spacing: inherit;
  line-height: inherit;
  text-transform: none;
  cursor: pointer;
  appearance: auto;
}

img,
svg,
iframe {
  display: block;
  vertical-align: middle;
}

img {
  max-width: 100%;
  height: auto;
}

table {
  border-collapse: collapse;
  border-color: inherit;
  text-indent: 0;
}

dialog {
  padding: 0;
}

[hidden] {
  display: none !important;
}

/* ---- Accessibility ---- */

.skip-link {
  position: absolute;
  z-index: 100;
  top: -100px;
  left: 1rem;
  padding: 0.6rem 1.1rem;
  border-radius: 0.5rem;
  background: var(--primary);
  color: #fff;
  font-weight: 600;
  transition: top 0.2s ease;
}

.skip-link:focus {
  top: 1rem;
}

/* ---- Decorative animations (same names, timings and curves as the original) ---- */

@keyframes pulse {
  50% {
    opacity: 0.5;
  }
}

@keyframes float {
  0%,
  100% {
    transform: translateY(0);
  }

  50% {
    transform: translateY(-10px);
  }
}

@keyframes ping {
  75%,
  100% {
    transform: scale(2);
    opacity: 0;
  }
}

/* ---- Reduced motion: final state immediately (the decorations' animation:none is at the end of site.css) ---- */

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

  *,
  ::before,
  ::after {
    transition-duration: 0.001ms !important;
  }
}
