/* Typography Styles */

body {
    font-family: var(--font-primary);
    font-size: var(--font-size-body);
    line-height: var(--line-height-body);
    color: var(--color-gray-100);
    background-color: var(--color-white);
}

/* Headings */
h1, h2, h3, h4, h5, h6 {
    font-family: var(--font-heading);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary-100);
    margin-bottom: var(--space-4);
}

h1 {
    font-size: var(--font-size-h1);
    line-height: var(--line-height-h1);
    letter-spacing: var(--letter-spacing-h1);
}

h2 {
    font-size: var(--font-size-h2);
    line-height: var(--line-height-h2);
    letter-spacing: var(--letter-spacing-h2);
}

h3 {
    font-size: var(--font-size-h3);
    line-height: var(--line-height-h3);
    font-weight: var(--font-weight-semibold);
}

h4 {
    font-size: var(--font-size-h4);
    line-height: var(--line-height-h4);
    font-weight: var(--font-weight-semibold);
}

/* Responsive Headings */
@media (max-width: 767px) {
    h1 {
        font-size: var(--font-size-h1-mobile);
    }
    
    h2 {
        font-size: var(--font-size-h2-mobile);
    }
    
    h3 {
        font-size: var(--font-size-h3-mobile);
    }
}

/* Body Text */
p {
    margin-bottom: var(--space-4);
}

p:last-child {
    margin-bottom: 0;
}

.body-large {
    font-size: var(--font-size-body-large);
    line-height: var(--line-height-body-large);
}

.body-small {
    font-size: var(--font-size-body-small);
    line-height: var(--line-height-body-small);
}

.caption {
    font-size: var(--font-size-caption);
    line-height: var(--line-height-caption);
    color: var(--color-gray-60);
}

/* Links */
a,
.link {
    color: var(--color-primary-100);
    font-weight: var(--font-weight-medium);
    text-decoration: none;
    transition: color var(--transition-fast);
}

a:hover,
.link:hover {
    color: var(--color-primary-80);
    text-decoration: underline;
}

a:focus-visible,
.link:focus-visible {
    outline: var(--focus-outline-width) solid var(--color-primary-100);
    outline-offset: var(--focus-outline-offset);
    border-radius: var(--radius-small);
}

/* Emphasis */
strong,
b {
    font-weight: var(--font-weight-semibold);
}

em,
i {
    font-style: italic;
}

/* Text Utilities */
.text-center {
    text-align: center;
}

.text-right {
    text-align: right;
}

.text-muted {
    color: var(--color-gray-60);
}

.text-error {
    color: var(--color-error-100);
    font-weight: var(--font-weight-medium);
}

.text-success {
    color: var(--color-success-100);
    font-weight: var(--font-weight-medium);
}

/* Editorial heading style — matches Wix brand */
.heading-editorial {
    text-transform: lowercase;
    font-weight: var(--font-weight-bold);
    letter-spacing: -0.01em;
}

/* Uppercase spaced nav link style — matches Wix nav */
.nav-link-brand {
    text-transform: uppercase;
    letter-spacing: 0.1em;
    font-weight: var(--font-weight-medium);
    font-size: var(--font-size-body-small);
    color: var(--color-gray-100);
    text-decoration: none;
}
.nav-link-brand:hover {
    color: var(--color-primary-100);
}
