.hero-actions {
    display: flex;
    gap: 16px;
    margin-top: 40px;
}

.hero-navy { 
    background-color: var(--color-primary-blue); 
    color: var(--color-warm-cream); 
}

.hero-cream { 
    background-color: var(--color-warm-cream); 
    color: var(--color-primary-blue); 
}

.domain-card {
    background-color: var(--color-warm-ivory);
    padding: 40px;
    border: 1px solid var(--color-navy-60);
    transition: transform var(--transition-duration) var(--ease-out);
}

.domain-card:hover {
    transform: translateY(-4px);
    border-color: var(--color-primary-blue);
}

.domain-icon {
    width: 32px;
    height: 32px;
    color: var(--color-primary-blue);
    margin-bottom: 24px;
}

.approach-section {
    background-color: var(--color-primary-blue);
    color: var(--color-warm-ivory);
}

.approach-step {
    border-top: 1px solid rgba(255, 255, 255, 0.2);
    padding-top: 24px;
}

.step-number {
    font-size: var(--text-eyebrow);
    color: var(--color-primary-blue);
    margin-bottom: 16px;
    display: block;
}

.cta-section {
    background-color: var(--color-warm-cream);
    text-align: center;
    border-top: 1px solid var(--color-navy-60);
}

@media (max-width: 768px) {
    .hero { min-height: 70vh; }
    .hero-actions { flex-direction: column; }
    .domain-card { padding: 24px; }
}