/* ============================================================
   AJ VENTURE
   Global Design System
   Version 1.0
============================================================ */

/* ==========================
   BRAND COLORS
========================== */

:root{

    /* Background */

    --bg-primary:#05070B;
    --bg-secondary:#0D121A;
    --bg-surface:#111926;
    --bg-card:#161F2D;

    /* Text */

    --text-primary:#F5F7FA;
    --text-secondary:#D7DFEA;
    --text-muted:#94A3B8;

    /* Brand */

    --primary:#67F0E5;
    --primary-dark:#2CD4C5;

    --secondary:#2F86FF;

    --gold:#C9A45C;

    /* Border */

    --border:#253241;
    --border-light:#334155;

    /* Status */

    --success:#3DDC84;
    --warning:#FBBF24;
    --danger:#EF4444;

    /* Layout */

    --container:1320px;

    --radius-sm:10px;
    --radius-md:18px;
    --radius-lg:28px;

    /* Shadows */

    --shadow-sm:0 10px 30px rgba(0,0,0,.18);

    --shadow-md:0 18px 45px rgba(0,0,0,.28);

    --shadow-lg:0 35px 80px rgba(0,0,0,.45);

    /* Transition */

    --transition:.30s ease;

}

/* ==========================
   RESET
========================== */

*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

html{
    scroll-behavior:smooth;
}

body{

    background:var(--bg-primary);

    color:var(--text-primary);

    font-family:
    Inter,
    -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    sans-serif;

    font-size:16px;

    line-height:1.7;

    overflow-x:hidden;

}

/* ==========================
   CONTAINER
========================== */

.container{

    width:min(92%, var(--container));

    margin:auto;

}

/* ==========================
   LINKS
========================== */

a{

    color:inherit;

    text-decoration:none;

    transition:var(--transition);

}

a:hover{

    color:var(--primary);

}

/* ==========================
   IMAGES
========================== */

img{

    max-width:100%;

    display:block;

}

/* ==========================
   BUTTONS
========================== */

.btn{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    padding:16px 32px;

    border-radius:14px;

    border:none;

    cursor:pointer;

    transition:var(--transition);

}

.btn-primary{

    background:linear-gradient(
    135deg,
    var(--primary),
    var(--secondary));

    color:#061016;

    font-weight:700;

}

.btn-primary:hover{

    transform:translateY(-3px);

    box-shadow:var(--shadow-md);

}

.btn-secondary{

    border:1px solid var(--border-light);

    background:transparent;

    color:var(--text-primary);

}

.btn-secondary:hover{

    border-color:var(--primary);

}

/* ==========================
   HEADINGS
========================== */

h1{

    font-size:clamp(54px,7vw,92px);

    line-height:.92;

    letter-spacing:-3px;

}

h2{

    font-size:clamp(40px,5vw,62px);

    line-height:1;

    letter-spacing:-2px;

}

h3{

    font-size:28px;

}

/* ==========================
   SECTION
========================== */

section{

    padding:120px 0;

}

/* ==========================
   CARD
========================== */

.card{

    background:var(--bg-card);

    border:1px solid var(--border);

    border-radius:var(--radius-lg);

    transition:var(--transition);

}

.card:hover{

    transform:translateY(-6px);

    border-color:var(--primary);

    box-shadow:var(--shadow-lg);

}

/* ==========================
   RESPONSIVE
========================== */

@media(max-width:992px){

    section{

        padding:90px 0;

    }

}

@media(max-width:768px){

    h1{

        font-size:56px;

    }

    h2{

        font-size:42px;

    }

}

@media(max-width:480px){

    h1{

        font-size:46px;

    }

    h2{

        font-size:34px;

    }

}