/* REINTEGRAL PRECISION GLOBAL STYLES 
   Verified against original index, assessment, apply, and privacy.css
*/

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;600;700&display=swap');

:root {
    /* Precise Brand Colors from source documents */
    --brand-primary: #7C3AED;   /* Purple (Assessment) */
    --brand-secondary: #33B0BA; /* Teal (Apply) */
    --brand-dark: #111111;      /* Precise Site Background */
    --accent-journal: #2DD4BF;  /* Substack Accent */
    
    --text-main: #FFFFFF;
    --text-muted: #9CA3AF;
}

/* 1. BASE RESET & TYPOGRAPHY */
body {
    font-family: 'Inter', sans-serif;
    background-color: var(--brand-dark);
    color: var(--text-main);
    overflow-x: hidden;
    margin: 0;
    line-height: 1.5;
}

/* 2. SHARED ANIMATIONS (Matched to original 0.5s) */
.fade-in {
    animation: fadeIn 0.5s ease-in-out forwards;
}

@keyframes fadeIn {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
}

/* 3. CUSTOM SCROLLBAR (Matched to original custom-scrollbar class) */
::-webkit-scrollbar { width: 8px; }
::-webkit-scrollbar-track { background: #1f1f1f; }
::-webkit-scrollbar-thumb {
    background: var(--brand-primary);
    border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover { background: #6D28D9; }

/* 4. SECURITY: Honeypot (Matched precisely) */
.oh-no-robots {
    position: absolute; 
    left: -5000px; 
    top: -5000px;
    display: none !important;
}

/* 5. ASSESSMENT & FORM COMPONENTS */
.hidden { display: none; }

.option-btn {
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
}

/* The .selected class used in your assessment.js logic */
.option-btn.selected {
    background-color: rgba(124, 58, 237, 0.1) !important;
    border-color: var(--brand-primary) !important;
}

/* 6. UTILITIES */
.turq-bg { background-color: var(--brand-secondary); }
.turq-text { color: var(--brand-secondary); }
.turq-border { border-color: var(--brand-secondary); }

a {
    transition: all 0.3s ease-in-out;
    color: var(--brand-secondary);
    text-decoration: underline;
}

a:hover { opacity: 0.8; }