/* Royal Cutz & Royal Ink - Dark Theme Test */
html { color-scheme: dark; }
body { background: #0d0d0d; color: #d6d6d6; }

/* Navigation & footer */
nav { background: #000; border-bottom: 1px solid #2a2a2a; }
footer { background: #000; border-top: 1px solid #2a2a2a; }
.footer-bottom { border-top-color: #2a2a2a; }

/* Hero (pages with an image hero keep their image) */
.hero:not([style]) { background: linear-gradient(135deg, #000 0%, #1a1a1a 100%); }

/* Section backgrounds -> let the dark body show through */
.brands, .story, .locations, .instagram-section, .experience, .piercings,
.consent-forms, .portfolio, .cta-section, .contact-section, .services, .styles {
    background: transparent;
}

/* Headings & text */
html body h1, html body h2, html body h3, html body h4 { color: #f5f5f5; }
html body .footer-section h4 { color: #d4af37; }
html body p:not(.subtitle):not(.cta-text) { color: #b8b8b8; }
html body strong { color: #f0f0f0; }
.section-title { color: #f5f5f5; }
.stat-label { color: #aaa; }
.address, .day, .hours h4, .address-section h3, .hours-section h3 { color: #eee; }
.time { color: #aaa; }

/* Cards */
.brand-card, .location-card, .service-card, .style-card, .piercing-card,
.form-link, .contact-method {
    background: #1a1a1a;
    box-shadow: 0 4px 18px rgba(0, 0, 0, 0.6);
    border-color: #d4af37;
}
.service-card, .style-card, .piercing-card { border-left: 4px solid #d4af37; }
.service-card:hover, .style-card:hover { box-shadow: 0 8px 24px rgba(212, 175, 55, 0.15); }
.brand-card:hover { box-shadow: 0 8px 28px rgba(212, 175, 55, 0.18); }
.services-list { background: #232323; }
.services-list h3 { color: #eee; }

/* Notice boxes */
.info-box { background: #201c0e; border-left: 4px solid #d4af37; }
.info-box p, .info-box h3 { color: #e6e6e6; }

/* Footer links */
.footer-section p { color: #b8b8b8; }
.footer-section a:hover { color: #fff; }

/* Headings nested in components (match original selector specificity) */
.story-text h2, .brand-card h3, .location-card h2, .location-card h3,
.service-card h3, .style-card h3, .piercing-card h3, .form-link h3,
.contact-method h3, .experience h2, .cta-section h2, .contact-section h2,
.info-box h3, .services-list h3 {
    color: #f5f5f5;
}
.location-card .subtitle { color: #d4af37; }
.location-card .address, .address-section .address { color: #eee; }