/**
 * ItsMyIdeas.com — Base Styles
 * 
 * Global typography, links, images, and element resets.
 * Uses design tokens from tokens.css.
 *
 * @package kadence-child
 * @version 1.0.0
 */

/* ═══════════════════════════════════════ */
/* HEADING HIERARCHY                        */
/* ═══════════════════════════════════════ */

h1 {
    font-size: var(--imi-heading-1);
    font-weight: 700;
    line-height: 1.25;
    color: var(--imi-text-heading);
    margin-top: 0;
    margin-bottom: var(--imi-space-4);
}

h2 {
    font-size: var(--imi-heading-2);
    font-weight: 700;
    line-height: 1.3;
    color: var(--imi-text-heading);
    margin-top: var(--imi-space-10);
    margin-bottom: var(--imi-space-4);
}

h3 {
    font-size: var(--imi-heading-3);
    font-weight: 700;
    line-height: 1.35;
    color: var(--imi-text-heading);
    margin-top: var(--imi-space-8);
    margin-bottom: var(--imi-space-3);
}

h4 {
    font-size: var(--imi-heading-4);
    font-weight: 700;
    line-height: 1.4;
    color: var(--imi-text);
    margin-top: var(--imi-space-6);
    margin-bottom: var(--imi-space-3);
}

h5 {
    font-size: var(--imi-heading-5);
    font-weight: 700;
    line-height: 1.4;
    color: var(--imi-text);
    margin-top: var(--imi-space-5);
    margin-bottom: var(--imi-space-2);
}

h6 {
    font-size: var(--imi-heading-6);
    font-weight: 700;
    line-height: 1.4;
    color: var(--imi-text-muted);
    margin-top: var(--imi-space-4);
    margin-bottom: var(--imi-space-2);
}

/* ═══════════════════════════════════════ */
/* LINKS                                    */
/* ═══════════════════════════════════════ */

a {
    color: var(--imi-text-link);
    text-decoration: none;
    transition: color var(--imi-transition-fast);
}

a:hover {
    color: var(--imi-text-link-hover);
    text-decoration: underline;
}

a:focus-visible {
    outline: 2px solid var(--imi-blue-500);
    outline-offset: 2px;
    border-radius: 2px;
}

/* ═══════════════════════════════════════ */
/* IMAGES                                   */
/* ═══════════════════════════════════════ */

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

.entry-content img,
.wp-block-image img {
    border-radius: var(--imi-radius-md);
}

/* ═══════════════════════════════════════ */
/* UTILITY CLASSES                          */
/* ═══════════════════════════════════════ */

/* Text utilities */
.imi-text-muted { color: var(--imi-text-muted); }
.imi-text-light { color: var(--imi-text-light); }
.imi-text-white { color: var(--imi-text-white); }
.imi-text-primary { color: var(--imi-blue-600); }
.imi-text-heading { color: var(--imi-text-heading); }
.imi-text-center { text-align: center; }

/* Font size utilities */
.imi-text-xs { font-size: var(--imi-text-xs); }
.imi-text-sm { font-size: var(--imi-text-sm); }
.imi-text-base { font-size: var(--imi-text-base); }
.imi-text-lg { font-size: var(--imi-text-lg); }
.imi-text-xl { font-size: var(--imi-text-xl); }

/* Font weight utilities */
.imi-font-normal { font-weight: 400; }
.imi-font-medium { font-weight: 500; }
.imi-font-semibold { font-weight: 600; }
.imi-font-bold { font-weight: 700; }

/* Spacing utilities */
.imi-mt-0 { margin-top: var(--imi-space-0); }
.imi-mt-2 { margin-top: var(--imi-space-2); }
.imi-mt-4 { margin-top: var(--imi-space-4); }
.imi-mt-6 { margin-top: var(--imi-space-6); }
.imi-mt-8 { margin-top: var(--imi-space-8); }
.imi-mb-0 { margin-bottom: var(--imi-space-0); }
.imi-mb-2 { margin-bottom: var(--imi-space-2); }
.imi-mb-4 { margin-bottom: var(--imi-space-4); }
.imi-mb-6 { margin-bottom: var(--imi-space-6); }
.imi-mb-8 { margin-bottom: var(--imi-space-8); }

/* Flex utilities */
.imi-flex { display: flex; }
.imi-flex-wrap { flex-wrap: wrap; }
.imi-items-center { align-items: center; }
.imi-justify-center { justify-content: center; }
.imi-gap-2 { gap: var(--imi-space-2); }
.imi-gap-3 { gap: var(--imi-space-3); }
.imi-gap-4 { gap: var(--imi-space-4); }
.imi-gap-6 { gap: var(--imi-space-6); }

/* Container utilities */
.imi-container { max-width: var(--imi-container); margin: 0 auto; padding: 0 var(--imi-edge-padding); }
.imi-container-wide { max-width: var(--imi-container-wide); margin: 0 auto; padding: 0 var(--imi-edge-padding); }
.imi-container-narrow { max-width: var(--imi-container-narrow); margin: 0 auto; padding: 0 var(--imi-edge-padding); }

/* ═══════════════════════════════════════ */
/* SECTION UTILITIES                        */
/* ═══════════════════════════════════════ */

.imi-section {
    padding: var(--imi-space-12) 0;
}

.imi-section-alt {
    padding: var(--imi-space-12) 0;
    background: var(--imi-bg-alt);
}

.imi-section-dark {
    padding: var(--imi-space-12) 0;
    background: var(--imi-navy-900);
    color: var(--imi-navy-100);
}