/* ==========================================================
   AURAMIND V3
   COMPONENT LIBRARY
========================================================== */


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

.am-btn{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    gap:12px;

    padding:16px 34px;

    border:none;

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

    cursor:pointer;

    font-weight:700;

    font-size:16px;

    transition:var(--transition);

}


/* ==========================================================
   PRIMARY BUTTON
========================================================== */

.am-btn-primary{

    color:#fff;

    background:var(--am-gradient-primary);

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

}

.am-btn-primary:hover{

    transform:
        translateY(-4px);

}


/* ==========================================================
   SECONDARY
========================================================== */

.am-btn-secondary{

    background:#fff;

    color:var(--am-primary);

    border:2px solid var(--am-primary);

}

.am-btn-secondary:hover{

    background:var(--am-primary);

    color:#fff;

}


/* ==========================================================
   GLASS BUTTON
========================================================== */

.am-btn-glass{

    color:#fff;

    border:1px solid rgba(255,255,255,.25);

    background:rgba(255,255,255,.15);

    backdrop-filter:blur(16px);

}

.am-btn-glass:hover{

    background:rgba(255,255,255,.25);

}


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

.am-card{

    background:#fff;

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

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

    transition:var(--transition);

}

.am-card:hover{

    transform:translateY(-8px);

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

}


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

.am-glass{

    background:rgba(255,255,255,.16);

    border:1px solid rgba(255,255,255,.22);

    backdrop-filter:blur(18px);

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

}


/* ==========================================================
   BADGE
========================================================== */

.am-badge{

    display:inline-flex;

    align-items:center;

    gap:10px;

    padding:10px 18px;

    border-radius:999px;

    background:#fff;

    color:var(--am-primary);

    font-weight:700;

}


/* ==========================================================
   ICON BOX
========================================================== */

.am-icon{

    width:64px;

    height:64px;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:20px;

    background:var(--am-gradient-primary);

    color:#fff;

    font-size:28px;

}


/* ==========================================================
   TITLE
========================================================== */

.am-title{

    font-size:clamp(2rem,4vw,4.5rem);

    font-weight:800;

    line-height:1.08;

}

.am-subtitle{

    font-size:1.15rem;

    color:var(--am-text-light);

    line-height:1.8;

}


/* ==========================================================
   CHIP
========================================================== */

.am-chip{

    display:inline-flex;

    align-items:center;

    gap:8px;

    padding:8px 14px;

    background:#F3F5FF;

    border-radius:999px;

    font-size:14px;

}


/* ==========================================================
   IMAGE
========================================================== */

.am-image{

    width:100%;

    display:block;

}