/*
Theme Name: EquiSoftware Theme
Theme URI: https://equisoftware.nl
Author: Bart Ros Development
Description: A custom WordPress theme based on the Manege App Styling, fully optimized for Elementor.
Version: 1.0.0
Text Domain: equisoftware
*/

:root {
    --help-bg-deep: #051025;
    --help-bg-gradient: radial-gradient(circle at top center, #1a2f55 0%, #051025 80%);
    --help-card-bg: #141e32b3;
    /* Glassmorphism base */
    --help-card-border: rgba(194, 164, 104, 0.3);
    /* Subtle Gold Border */

    --help-text-primary: #f0f4f8;
    --help-text-secondary: #b0c4de;

    --help-gold-gradient: linear-gradient(135deg, #d4af37 0%, #f9e398 50%, #aa8c2c 100%);
    --help-gold-text: #deb887;
    /* Fallback flat gold */

    --help-font-serif: 'Cinzel', serif;
    --help-font-sans: 'Roboto', sans-serif;
}

body.help-layout {
    background: var(--help-bg-gradient) !important;
    background-attachment: fixed !important;
    color: var(--help-text-primary) !important;
    font-family: var(--help-font-sans);
    min-height: 100vh;
}

.help-layout .wrapper {
    background: transparent !important;
}

/* --- Main Content Area --- */
.help-content {
    background: transparent !important;
    padding: 40px 20px;
}

/* Module Header */
.module-header h1,
h1.elementor-heading-title {
    font-family: var(--help-font-serif);
    font-size: 3rem;
    font-weight: 700;
    text-align: center;
    text-transform: uppercase;
    margin-bottom: 1rem;

    /* Gold Gradient Text */
    background: var(--help-gold-gradient);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;

    /* Drop shadow for depth */
    filter: drop-shadow(0px 2px 2px rgba(0, 0, 0, 0.8));
}

.module-header p.lead {
    text-align: center;
    font-family: var(--help-font-serif);
    font-size: 1.2rem;
    color: var(--help-text-secondary) !important;
    margin-bottom: 3rem;
    border-bottom: 1px solid var(--help-card-border);
    display: inline-block;
    padding-bottom: 20px;
    width: 100%;
}

/* Cards (Glassmorphism) */
.help-card {
    background: var(--help-card-bg);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid var(--help-card-border);
    border-radius: 12px;
    padding: 30px;
    margin-bottom: 30px;
    box-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.37);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.help-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 12px 40px 0 rgba(0, 0, 0, 0.5);
    border-color: rgba(194, 164, 104, 0.6);
}

/* Headings within cards */
.help-card h2,
.help-card h2.elementor-heading-title {
    font-family: var(--help-font-serif);
    color: #f9e398;
    /* Light Gold */
    border-bottom: 1px solid rgba(212, 175, 55, 0.3);
    padding-bottom: 15px;
    margin-bottom: 20px;
    font-size: 1.8rem;
    letter-spacing: 0.5px;
}

.help-card h3,
.help-card h3.elementor-heading-title {
    font-family: var(--help-font-serif);
    color: #d4af37;
    /* Darker Gold */
    margin-top: 25px;
    margin-bottom: 15px;
    font-size: 1.4rem;
}

/* Typography & Lists */
.help-card p,
.help-card li {
    font-weight: 300;
    line-height: 1.7;
    font-size: 1.05rem;
    color: var(--help-text-primary);
}

.help-card strong {
    color: #fff;
    font-weight: 600;
}

.help-card ul li {
    margin-bottom: 12px;
    padding-left: 15px;
    border-left: 3px solid #d4af37;
    /* Gold accent bar */
}

/* Links inside content */
.help-card a {
    color: #f9e398;
    text-decoration: none;
    border-bottom: 1px dashed #d4af37;
    transition: color 0.2s;
}

.help-card a:hover {
    color: #fff;
    border-bottom: 1px solid #fff;
}

/* Icons */
.help-card i {
    margin-right: 10px;
    background: var(--help-gold-gradient);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}