/*
Theme Name:    Sanctified Man
Theme URI:     https://sanctifiedman.com.au
Description:   Custom theme for the Sanctified Man discipleship program
Author:        R6 Digital
Author URI:    https://r6digital.com.au
Template:      generatepress
Version:       1.0.0
License:       GNU General Public License v2 or later
License URI:   http://www.gnu.org/licenses/gpl-2.0.html
Text Domain:   sanctifiedman
*/

/* ============================================
   CSS VARIABLES & DESIGN SYSTEM
   ============================================ */
:root {
    --onyx-black: #0A0A0A;
    --parchment: #F5F0E8;
    --forge-orange: #E8612D;
    --forge-orange-dark: #C94E1F;
    --charcoal: #1A1A1A;
    --dark-gray: #2A2A2A;
    --medium-gray: #4A4A4A;
    --light-gray: #8A8A8A;
    --silver: #C0C0C0;
    --cream: #FAF7F2;
    --warm-gray: #B8B0A8;
    --font-heading: 'Barlow Condensed', sans-serif;
    --font-body: 'Inter', sans-serif;
    --transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

/* ============================================
   GLOBAL OVERRIDES (GeneratePress defaults)
   ============================================ */
body {
    font-family: var(--font-body);
    color: var(--parchment);
    background-color: var(--onyx-black);
    line-height: 1.6;
    overflow-x: hidden;
}

h1, h2, h3, h4, h5, h6 {
    font-family: var(--font-heading);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--parchment);
}

a { color: inherit; }

/* ============================================
   HERO SECTION (all pages)
   ============================================ */
.hero {
    background-color: var(--onyx-black);
}
.hero h1 {
    color: var(--parchment);
}
.hero p {
    color: var(--silver);
}
.hero-label {
    color: var(--forge-orange);
}
.hero-badge {
    color: var(--parchment);
}
.hero-subtext {
    color: var(--warm-gray);
}

/* ============================================
   HOME PAGE - PROBLEM SECTION
   ============================================ */
.problem {
    background-color: var(--charcoal);
}
.problem .section-label {
    color: var(--forge-orange);
}
.problem .section-title,
.problem-content h2 {
    color: var(--parchment);
}
.problem-content p {
    color: var(--warm-gray);
}
.quote-card p {
    color: var(--parchment);
}

/* ============================================
   HOME PAGE - STATS BAR
   ============================================ */
.stats-bar {
    background-color: var(--dark-gray);
}
.stat-number {
    color: var(--forge-orange);
}
.stat-label {
    color: var(--warm-gray);
}

/* ============================================
   HOME PAGE - THE CODE SECTION
   ============================================ */
.the-code {
    background-color: var(--onyx-black);
}
.the-code .section-label {
    color: var(--forge-orange);
}
.the-code .section-title {
    color: var(--parchment);
}
.code-card {
    background-color: var(--dark-gray);
}
.code-card-number {
    color: var(--forge-orange);
}
.code-card h4 {
    color: var(--parchment);
}
.code-card p {
    color: var(--warm-gray);
}
.code-link {
    color: var(--forge-orange);
}

/* ============================================
   HOME PAGE - CORE 5 SECTION
   ============================================ */
.core-five {
    background-color: var(--cream);
    color: var(--onyx-black);
}
.core-five .section-label {
    color: var(--forge-orange);
}
.core-five .section-title,
.core-five h2 {
    color: var(--onyx-black);
}
.core-card {
    background-color: var(--parchment);
}
.core-card h4 {
    color: var(--onyx-black);
}
.core-card p {
    color: var(--medium-gray);
}
.core-card:hover {
    background-color: var(--onyx-black);
}
.core-card:hover h4 {
    color: var(--parchment);
}
.core-card:hover p {
    color: var(--warm-gray);
}
.core-five-link {
    color: var(--forge-orange);
}

/* ============================================
   HOME PAGE - APP BANNER
   ============================================ */
.app-banner {
    background-color: var(--cream);
    color: var(--onyx-black);
}
.app-banner .section-label {
    color: var(--forge-orange);
}
.app-banner h2 {
    color: var(--onyx-black);
}
.app-text p {
    color: var(--medium-gray);
}
.app-feature {
    background: var(--parchment);
}
.app-feature h4 {
    color: var(--onyx-black);
}
.app-feature p {
    color: var(--medium-gray);
}

/* ============================================
   HOME PAGE - FINAL CTA
   ============================================ */
.final-cta {
    background-color: var(--onyx-black);
}
.final-cta .section-label {
    color: var(--forge-orange);
}
.final-cta h2 {
    color: var(--parchment);
}
.final-cta p {
    color: var(--warm-gray);
}

/* ============================================
   ABOUT PAGE - CONTENT SECTIONS
   ============================================ */
.content-section.cream-bg {
    background-color: var(--cream);
    color: var(--onyx-black);
}
.cream-bg .section-label {
    color: var(--forge-orange);
}
.cream-bg .section-title,
.cream-bg h2 {
    color: var(--onyx-black);
}
.cream-bg .content-text {
    color: var(--medium-gray);
}
.cream-bg .content-text strong {
    color: var(--forge-orange);
}
.cream-bg .content-text a {
    color: var(--forge-orange);
}

.content-section.dark-bg {
    background-color: var(--onyx-black);
    color: var(--parchment);
}
.dark-bg .section-label {
    color: var(--forge-orange);
}
.dark-bg .section-title,
.dark-bg h2 {
    color: var(--parchment);
}
.dark-bg .content-text {
    color: var(--silver);
}

.content-section.charcoal-bg {
    background-color: var(--charcoal);
    color: var(--parchment);
}
.charcoal-bg .section-label {
    color: var(--forge-orange);
}
.charcoal-bg .section-title,
.charcoal-bg h2 {
    color: var(--parchment);
}
.charcoal-bg .content-text {
    color: var(--silver);
}

/* About page pillar cards */
.pillar-card {
    background: var(--parchment);
}
.pillar-card h3 {
    color: var(--onyx-black);
}
.pillar-card p {
    color: var(--medium-gray);
}

/* About page who list */
.who-list li {
    color: var(--silver);
}
.who-list li::before {
    background: var(--forge-orange);
}

/* About page app callout */
.app-callout {
    background: var(--charcoal);
}
.app-callout h3 {
    color: var(--parchment);
}
.app-callout p {
    color: var(--silver);
}

/* ============================================
   CTA SECTION (shared across pages)
   ============================================ */
.cta-section {
    background: linear-gradient(135deg, var(--charcoal) 0%, var(--dark-gray) 100%);
}
.cta-section h2 {
    color: var(--parchment);
}
.cta-section p {
    color: var(--warm-gray);
}

/* ============================================
   PROGRAM PAGE - SECTIONS
   ============================================ */
.section-dark {
    background-color: var(--onyx-black);
    color: var(--parchment);
}
.section-dark .section-label {
    color: var(--forge-orange);
}
.section-dark .section-title,
.section-dark h2,
.section-dark h3 {
    color: var(--parchment);
}
.section-dark p {
    color: var(--warm-gray);
}
.section-dark li {
    color: var(--warm-gray);
}

.section-light {
    background-color: var(--cream);
    color: var(--onyx-black);
}
.section-light .section-label {
    color: var(--forge-orange);
}
.section-light .section-title,
.section-light h2,
.section-light h3 {
    color: var(--onyx-black);
}
.section-light p {
    color: var(--medium-gray);
}
.section-light li {
    color: var(--medium-gray);
}

/* ============================================
   CHURCHES PAGE - SECTIONS
   ============================================ */
section.cream-bg {
    background-color: var(--cream);
    color: var(--onyx-black);
}
section.cream-bg h2,
section.cream-bg h3,
section.cream-bg h4 {
    color: var(--onyx-black);
}
section.cream-bg p {
    color: var(--medium-gray);
}

/* ============================================
   CONTACT PAGE - FORM SECTION
   ============================================ */
.form-column h3 {
    color: var(--onyx-black);
}
section.cream-bg .form-column h3 {
    color: var(--onyx-black);
}
label {
    color: inherit;
}
.alt-contact {
    background-color: var(--parchment);
    color: var(--onyx-black);
}
.alt-contact h3 {
    color: var(--onyx-black);
}
.alt-contact p {
    color: var(--medium-gray);
}
.alt-contact a {
    color: var(--forge-orange);
}

/* ============================================
   FOOTER
   ============================================ */
footer,
.site-footer {
    background-color: var(--charcoal);
}
.footer-column h4 {
    color: var(--parchment);
}
.footer-column p {
    color: var(--warm-gray);
}
.footer-column a {
    color: var(--warm-gray);
}
.footer-column a:hover {
    color: var(--forge-orange);
}
.footer-bottom {
    color: var(--warm-gray);
}
.footer-verse {
    color: var(--light-gray);
}

/* ============================================
   BUTTONS
   ============================================ */
.btn-primary {
    background-color: var(--forge-orange);
    color: var(--parchment);
    border: 2px solid var(--forge-orange);
}
.btn-primary:hover {
    background-color: var(--forge-orange-dark);
    border-color: var(--forge-orange-dark);
}
.btn-outline {
    background-color: transparent;
    color: var(--parchment);
    border: 2px solid var(--parchment);
}
.btn-outline:hover {
    background-color: var(--parchment);
    color: var(--onyx-black);
}
.btn-dark {
    background-color: var(--onyx-black);
    color: var(--parchment);
    border: 2px solid var(--parchment);
}
.btn-dark:hover {
    background-color: var(--parchment);
    color: var(--onyx-black);
}
.nav-login {
    background: transparent;
    color: var(--parchment);
    border: 2px solid var(--parchment);
}
.nav-login:hover {
    background: var(--parchment);
    color: var(--onyx-black);
}

/* ============================================
   NAVIGATION
   ============================================ */
nav, .site-header {
    background-color: rgba(10, 10, 10, 0.8);
}
.nav-links a {
    color: var(--parchment);
}
.nav-links a:hover,
.nav-links a.active {
    color: var(--forge-orange);
}

/* ============================================
   SECTION LABELS
   ============================================ */
.section-label {
    color: var(--forge-orange);
}

/* ============================================
   ANIMATIONS
   ============================================ */
.fade-in {
    opacity: 0;
    transform: translateY(30px);
}
.fade-in.visible {
    opacity: 1;
    transform: translateY(0);
    transition: all 0.6s ease-out;
}