/* ================================
   🛠️ UTILITY CLASSES
   ================================ */

/* ===== TEXT HIGHLIGHTS ===== */

.emphasis,
.year-highlight {
    background: linear-gradient(135deg, var(--accent-primary), var(--accent-secondary));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    font-weight: 700;
}

.hobby-highlight {
    background: linear-gradient(135deg, #32d74b, #30db5b);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    font-weight: 600;
}

.skill-highlight {
    background: linear-gradient(135deg, #007AFF, #5856D6);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    font-weight: 600;
}

/* ===== STORY HIGHLIGHTS ===== */

.highlight-fitness { 
    background: linear-gradient(135deg, #ff6b6b, #ee5a52); 
    -webkit-background-clip: text; 
    -webkit-text-fill-color: transparent; 
    background-clip: text; 
    font-weight: 600; 
}

.highlight-friendship { 
    background: linear-gradient(135deg, #4ecdc4, #26d0ce); 
    -webkit-background-clip: text; 
    -webkit-text-fill-color: transparent; 
    background-clip: text; 
    font-weight: 600; 
}

.highlight-business { 
    background: linear-gradient(135deg, #007AFF, #5856D6); 
    -webkit-background-clip: text; 
    -webkit-text-fill-color: transparent; 
    background-clip: text; 
    font-weight: 600; 
}

.highlight-education { 
    background: linear-gradient(135deg, #2ea043, #00d084); 
    -webkit-background-clip: text; 
    -webkit-text-fill-color: transparent; 
    background-clip: text; 
    font-weight: 600; 
}

.highlight-legal { 
    background: linear-gradient(135deg, #ffd700, #ffed4e); 
    -webkit-background-clip: text; 
    -webkit-text-fill-color: transparent; 
    background-clip: text; 
    font-weight: 600; 
}

.highlight-quality { 
    background: linear-gradient(135deg, #FF9500, #FFCC02); 
    -webkit-background-clip: text; 
    -webkit-text-fill-color: transparent; 
    background-clip: text; 
    font-weight: 600; 
}

.highlight-innovation { 
    background: linear-gradient(135deg, #5856D6, #AF52DE); 
    -webkit-background-clip: text; 
    -webkit-text-fill-color: transparent; 
    background-clip: text; 
    font-weight: 600; 
}

.highlight-decision { 
    background: linear-gradient(135deg, #007AFF, #5856D6); 
    -webkit-background-clip: text; 
    -webkit-text-fill-color: transparent; 
    background-clip: text; 
    font-weight: 600; 
}

.highlight-improvement { 
    background: linear-gradient(135deg, #2ea043, #00d084); 
    -webkit-background-clip: text; 
    -webkit-text-fill-color: transparent; 
    background-clip: text; 
    font-weight: 600; 
}

.highlight-family { 
    background: linear-gradient(135deg, #ff2d92, #ff375f); 
    -webkit-background-clip: text; 
    -webkit-text-fill-color: transparent; 
    background-clip: text; 
    font-weight: 600; 
}

.highlight-experience { 
    background: linear-gradient(135deg, #FF9500, #FFCC02); 
    -webkit-background-clip: text; 
    -webkit-text-fill-color: transparent; 
    background-clip: text; 
    font-weight: 600; 
}

.highlight-start { 
    background: linear-gradient(135deg, #32d74b, #30db5b); 
    -webkit-background-clip: text; 
    -webkit-text-fill-color: transparent; 
    background-clip: text; 
    font-weight: 600; 
}

.highlight-ai { 
    background: linear-gradient(135deg, #5856D6, #AF52DE); 
    -webkit-background-clip: text; 
    -webkit-text-fill-color: transparent; 
    background-clip: text; 
    font-weight: 600; 
}

.highlight-tech { 
    background: linear-gradient(135deg, #007AFF, #5856D6); 
    -webkit-background-clip: text; 
    -webkit-text-fill-color: transparent; 
    background-clip: text; 
    font-weight: 600; 
}

.highlight-name { 
    background: linear-gradient(135deg, #FF9500, #FFCC02); 
    -webkit-background-clip: text; 
    -webkit-text-fill-color: transparent; 
    background-clip: text; 
    font-weight: 600; 
}

.highlight-first { 
    background: linear-gradient(135deg, #2ea043, #00d084); 
    -webkit-background-clip: text; 
    -webkit-text-fill-color: transparent; 
    background-clip: text; 
    font-weight: 600; 
}

.highlight-community { 
    background: linear-gradient(135deg, #64d2ff, #5ac8fa); 
    -webkit-background-clip: text; 
    -webkit-text-fill-color: transparent; 
    background-clip: text; 
    font-weight: 600; 
}

.highlight-covid { 
    background: linear-gradient(135deg, #ff2d92, #ff375f); 
    -webkit-background-clip: text; 
    -webkit-text-fill-color: transparent; 
    background-clip: text; 
    font-weight: 600; 
}

.highlight-time { 
    background: linear-gradient(135deg, #FF9500, #FFCC02); 
    -webkit-background-clip: text; 
    -webkit-text-fill-color: transparent; 
    background-clip: text; 
    font-weight: 600; 
}

.highlight-coding { 
    background: linear-gradient(135deg, #007AFF, #5856D6); 
    -webkit-background-clip: text; 
    -webkit-text-fill-color: transparent; 
    background-clip: text; 
    font-weight: 600; 
}

.highlight-challenge { 
    background: linear-gradient(135deg, #ff2d92, #ff375f); 
    -webkit-background-clip: text; 
    -webkit-text-fill-color: transparent; 
    background-clip: text; 
    font-weight: 600; 
}

.highlight-resilience { 
    background: linear-gradient(135deg, #2ea043, #00d084); 
    -webkit-background-clip: text; 
    -webkit-text-fill-color: transparent; 
    background-clip: text; 
    font-weight: 600; 
}

.highlight-discipline { 
    background: linear-gradient(135deg, #007AFF, #5856D6); 
    -webkit-background-clip: text; 
    -webkit-text-fill-color: transparent; 
    background-clip: text; 
    font-weight: 600; 
}

.highlight-uncle { 
    background: linear-gradient(135deg, #FF9500, #FFCC02); 
    -webkit-background-clip: text; 
    -webkit-text-fill-color: transparent; 
    background-clip: text; 
    font-weight: 600; 
}

.highlight-meaning { 
    background: linear-gradient(135deg, #5856D6, #AF52DE); 
    -webkit-background-clip: text; 
    -webkit-text-fill-color: transparent; 
    background-clip: text; 
    font-weight: 600; 
}

.highlight-passion,
.highlight-modern,
.highlight-intuitive,
.highlight-future {
    background: linear-gradient(135deg, var(--accent-primary), var(--accent-secondary));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    font-weight: 600;
}

.highlight-passion {
    background: linear-gradient(135deg, #ff2d92, #ff375f);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    font-weight: 600;
}

.highlight-modern {
    background: linear-gradient(135deg, #007AFF, #5856D6);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    font-weight: 600;
}

.highlight-intuitive {
    background: linear-gradient(135deg, #32d74b, #30db5b);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    font-weight: 600;
}

.highlight-future {
    background: linear-gradient(135deg, #5856D6, #AF52DE);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    font-weight: 600;
}

/* ===== SOCIAL LINK UTILITY ===== */

.social-link,
.footer-links a {
    transition: all 0.3s ease;
}

/* ===== RESPONSIVE UTILITIES ===== */

@media (max-width: 768px) {
    .highlight-fitness,
    .highlight-friendship,
    .highlight-business,
    .highlight-education,
    .highlight-legal,
    .highlight-quality,
    .highlight-innovation,
    .highlight-decision,
    .highlight-improvement,
    .highlight-family,
    .highlight-experience,
    .highlight-start,
    .highlight-ai,
    .highlight-tech,
    .highlight-name,
    .highlight-first,
    .highlight-community,
    .highlight-covid,
    .highlight-time,
    .highlight-coding,
    .highlight-challenge,
    .highlight-resilience,
    .highlight-discipline,
    .highlight-uncle,
    .highlight-meaning,
    .highlight-passion,
    .highlight-modern,
    .highlight-intuitive,
    .highlight-future,
    .emphasis,
    .year-highlight,
    .hobby-highlight,
    .skill-highlight {
        /* Fallback for mobile devices that don't support background-clip */
        color: var(--accent-primary);
        background: none;
        -webkit-background-clip: unset;
        -webkit-text-fill-color: unset;
        background-clip: unset;
    }
}

/* ===== ACCESSIBILITY ===== */

@media (prefers-reduced-motion: reduce) {
    .social-link,
    .footer-links a {
        transition: none;
    }
}

/* ===== HIGH CONTRAST MODE ===== */

@media (prefers-contrast: high) {
    .highlight-fitness,
    .highlight-friendship,
    .highlight-business,
    .highlight-education,
    .highlight-legal,
    .highlight-quality,
    .highlight-innovation,
    .highlight-decision,
    .highlight-improvement,
    .highlight-family,
    .highlight-experience,
    .highlight-start,
    .highlight-ai,
    .highlight-tech,
    .highlight-name,
    .highlight-first,
    .highlight-community,
    .highlight-covid,
    .highlight-time,
    .highlight-coding,
    .highlight-challenge,
    .highlight-resilience,
    .highlight-discipline,
    .highlight-uncle,
    .highlight-meaning,
    .highlight-passion,
    .highlight-modern,
    .highlight-intuitive,
    .highlight-future,
    .emphasis,
    .year-highlight,
    .hobby-highlight,
    .skill-highlight {
        background: none;
        color: var(--accent-primary);
        font-weight: 700;
        text-decoration: underline;
    }
} 