/*
=========================================
GovJobDesk Design System
=========================================
*/

/* ==============================
   CSS Variables
============================== */

:root {

    --gjd-primary: #0F766E;
    --gjd-primary-dark: #115E59;

    --gjd-secondary: #2563EB;

    --gjd-success: #16A34A;
    --gjd-danger: #DC2626;
    --gjd-warning: #D97706;

    --gjd-bg: #F8FAFC;
    --gjd-white: #FFFFFF;

    --gjd-text: #1E293B;
    --gjd-muted: #64748B;

    --gjd-border: #E2E8F0;

    --gjd-radius: 10px;

    --gjd-shadow:
        0 4px 18px rgba(0,0,0,.06);

    --gjd-transition: .25s ease;
}


/* ==============================
   Container
============================== */

.gjd-container{

    max-width:1200px;

    margin:auto;

    padding:30px 20px;

}


/* ==============================
   Headings
============================== */

.gjd-section-title{

    font-size:28px;

    font-weight:700;

    color:var(--gjd-text);

    margin-bottom:20px;

}

.gjd-job-title{

    font-size:36px;

    font-weight:700;

    line-height:1.3;

    margin-bottom:15px;

}


/* ==============================
   Paragraphs
============================== */

.gjd-job-intro{

    color:var(--gjd-muted);

    line-height:1.8;

}


/* ==============================
   Buttons
============================== */

.gjd-btn{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    padding:14px 28px;

    border-radius:8px;

    text-decoration:none;

    font-weight:600;

    transition:var(--gjd-transition);

}

.gjd-btn-primary{

    background:var(--gjd-primary);

    color:#fff;

}

.gjd-btn-primary:hover{

    background:var(--gjd-primary-dark);

}

.gjd-btn-secondary{

    background:#fff;

    color:var(--gjd-primary);

    border:1px solid var(--gjd-border);

}

.gjd-btn-secondary:hover{

    background:var(--gjd-bg);

}


/* ==============================
   Cards
============================== */

.gjd-card{

    background:#fff;

    border-radius:var(--gjd-radius);

    border:1px solid var(--gjd-border);

    box-shadow:var(--gjd-shadow);

    padding:25px;

}


/* ==============================
   Utilities
============================== */

.gjd-grid{

    display:grid;

    gap:20px;

}