/*
Theme Name: Astra Child
Template: astra
Version: 1.0
Description: Sphere Digital custom child theme
*/

/* Base styles */
:root {
    --accent: #2563eb;
    --accent-dark: #1d4ed8;
    --dark: #0f172a;
    --gray: #64748b;
    --light-gray: #f8fafc;
    --border: #e2e8f0;
}

body {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    color: #1e293b;
    line-height: 1.7;
}

/* Headers */
h1, h2, h3, h4, h5, h6 {
    color: var(--dark);
    font-weight: 700;
    line-height: 1.3;
}

h1 { font-size: 2.2em; margin-bottom: 20px; }
h2 { font-size: 1.6em; margin-top: 40px; margin-bottom: 16px; }
h3 { font-size: 1.25em; margin-top: 28px; margin-bottom: 12px; }

/* Links */
a { color: var(--accent); transition: color 0.2s; }
a:hover { color: var(--accent-dark); }

/* Tables */
table {
    width: 100%;
    border-collapse: collapse;
    margin: 20px 0;
    font-size: 0.95em;
}

table th {
    background: var(--dark);
    color: #fff;
    padding: 12px 16px;
    text-align: left;
    font-weight: 600;
}

table td {
    padding: 10px 16px;
    border-bottom: 1px solid var(--border);
}

table tr:nth-child(even) {
    background: var(--light-gray);
}

/* Lists */
ul, ol { margin: 16px 0; padding-left: 24px; }
li { margin-bottom: 8px; }

/* Buttons / CTA */
.wp-block-button__link,
.ast-custom-button,
a[style*="background:#2563eb"],
a[style*="background: #2563eb"] {
    transition: all 0.3s ease;
}

a[style*="background:#2563eb"]:hover,
a[style*="background: #2563eb"]:hover {
    opacity: 0.9;
    transform: translateY(-1px);
}

/* FAQ styling */
.entry-content h3 + p {
    margin-top: 4px;
}

/* Footer */
.site-footer {
    background: var(--dark);
    color: #94a3b8;
}

.site-footer a {
    color: #cbd5e1;
}

.site-footer a:hover {
    color: #fff;
}

/* Breadcrumbs */
.ast-breadcrumbs {
    font-size: 0.85em;
    color: var(--gray);
    margin-bottom: 20px;
}

/* Responsive */
@media (max-width: 768px) {
    h1 { font-size: 1.6em; }
    h2 { font-size: 1.3em; }
    
    table { font-size: 0.85em; }
    table th, table td { padding: 8px 10px; }
}