/*
 * Pronto Theme - Base Styles
 *
 * This file contains:
 * - Font variables (set by inc/font-config.php)
 * - Base element styles
 * - Custom assets (SVG borders)
 *
 * Design tokens (colors, spacing, font sizes) are defined in tailwind-input.css
 */

:root {
  /* ==========================================================================
     Font Variables
     Set via inc/font-config.php for per-site customization.
     These are fallback defaults if PHP doesn't load.
     ========================================================================== */
  --font-sans-name: "DM Sans";
  --font-serif-name: "Inter";

  /* ==========================================================================
     Z-Index Scale
     ========================================================================== */
  --z-dropdown: 1000;
  --z-sticky: 1020;
  --z-fixed: 1030;
  --z-modal-backdrop: 1040;
  --z-modal: 1050;
  --z-popover: 1060;
  --z-tooltip: 1070;

  /* ==========================================================================
     Custom Assets
     ========================================================================== */
  --border-drawn: url("../images/drawn-border.svg");
  --border-underline: url("../images/drawn-underline.svg");
}

/* ==========================================================================
   Base Element Styles
   ========================================================================== */

body {
  font-family: var(--font-sans-name), -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  color: var(--color-softened-black);
  background-color: var(--color-soft-white);
  line-height: 1.6;
}

/* Headings */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: var(--font-serif-name), -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  font-weight: 600;
}

h1 {
  font-size: var(--text-h1);
  line-height: 1.1;
  letter-spacing: -0.02em;
}

h2 {
  font-size: var(--text-h2);
  line-height: 1.2;
  letter-spacing: -0.01em;
}

h3 {
  font-size: var(--text-h3);
  line-height: 1.3;
  letter-spacing: -0.01em;
}

h4 {
  font-size: var(--text-h4);
  line-height: 1.4;
}

h5 {
  font-size: var(--text-h5);
  line-height: 1.4;
}

h6 {
  font-size: var(--text-h6);
  line-height: 1.5;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

/* Links */
a:not([class]) {
  color: var(--color-softened-black);
  transition: color 250ms ease-in-out;
}

a:not([class]):hover {
  color: var(--color-rust-700);
}

/* Form elements inherit font */
input,
textarea,
select,
button {
  font-family: inherit;
}

/* ==========================================================================
   Component Styles
   ========================================================================== */

.header-logo {
  max-width: 200px;
}

.header-logo a:hover img {
  transition: none;
  transform: none;
}