*,
*::before,
*::after {
    box-sizing: border-box;
}
:root {

    /* BACKGROUND */
    --bg-main: #0b1120;
    --bg-card: #131c31;
    --bg-card-2: #1a2540;
    --bg-hover: #24304d;

    /* BRAND */
    --primary: #8b5cf6;
    --primary-hover: #7c3aed;

    --accent: #f59e0b;
    --danger: #ef4444;

    /* TEXT */
    --text-main: #e5e7eb;
    --text-muted: #94a3b8;
    --text-white: #ffffff;

    /* UI */
    --radius: 16px;
    /* SHADOW */
--shadow-soft:0 8px 24px rgba(0,0,0,.22);

--shadow-hover:0 10px 24px rgba(0,0,0,.24);

/* SPACING */
--space-xs:6px;
--space-sm:10px;
--space-md:16px;
--space-lg:24px;
--space-xl:32px;

/* EXTRA RADIUS */
--radius-sm:12px;
--radius-lg:22px;

/* TRANSITION */
--transition:.25s ease;
}
/* ===============================
   GLOBAL
================================ */
body{
    background: var(--bg-main);
    color: var(--text-main);

    font-family: Inter, sans-serif;

    line-height:1.6;

    overflow-x:hidden;

    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}
img{
    display:block;
}

a{
    text-decoration:none;
    color:inherit;
}

button{
    font-family:inherit;
}

*{
    -webkit-tap-highlight-color:transparent;
}
/* ===============================
   SCROLLBAR
================================ */

::-webkit-scrollbar{
width:10px;
height:10px;
}

::-webkit-scrollbar-track{
background:#0f172a;
}

::-webkit-scrollbar-thumb{
background:#24304d;
border-radius:999px;
}

::-webkit-scrollbar-thumb:hover{
background:#334155;
}
/* ===============================
   HOMEPAGE SECTION TITLE
================================ */

.za-section h2{
    position:relative;

    display:flex;
    align-items:center;

    margin:0 16px 22px;
    padding-left:14px;

    font-size:22px;
    font-weight:800;
    line-height:1.2;
    letter-spacing:-0.45px;

    color:var(--text-white);
    text-shadow:0 2px 10px rgba(0,0,0,.18);
}
.za-section h2::before{

content:"";

position:absolute;

left:0;
top:50%;

transform:translateY(-50%);

width:4px;
height:24px;

border-radius:999px;

background:var(--primary);

}
/* ===============================
   HERO TITLE
================================ */

.za-hero-overlay h1{
font-size:42px;
line-height:1.15;
font-weight:800;
letter-spacing:-1px;
color:var(--text-white);
max-width:700px;
text-shadow:0 4px 24px rgba(0,0,0,.45);
margin-bottom:14px;
}
/* ===============================
   MOBILE HERO TITLE
================================ */

@media(max-width:768px){

.za-hero-overlay h1{
    font-size:24px;
    line-height:1.2;
    letter-spacing:-0.4px;
    max-width:260px;
    margin-bottom:10px;
}
.site-header,
.ast-primary-header-bar{

    width:calc(100% - 16px);

    top:8px;

    border-radius:20px;
}

.ast-builder-grid-row{
    min-height:64px !important;
    padding-inline:10px;
}

}

/* ===============================
   PREMIUM AUDIO HEADER
================================ */

.site-header,
.ast-primary-header-bar{

    position:sticky;
    top:12px;

    z-index:9999;

    width:min(calc(100% - 28px),1280px);

    margin-inline:auto;

    background:
        linear-gradient(
            180deg,
            rgba(8,12,24,.74),
            rgba(8,12,24,.58)
        ) !important;

    backdrop-filter:blur(18px);

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

    border-radius:24px;

    box-shadow:
        0 18px 42px rgba(0,0,0,.24);

    transition:
        background .25s ease,
        box-shadow .25s ease,
        border-color .25s ease;
}
.main-header-menu .menu-link{

    display:flex;
    align-items:center;
    justify-content:center;

    min-height:44px;
    padding:0 20px !important;

    border-radius:999px;

    color:rgba(255,255,255,.72) !important;

    font-size:14px;
    font-weight:700;
    letter-spacing:-0.1px;

    transition:
        background .25s ease,
        color .25s ease,
        transform .25s ease;
}

.main-header-menu .menu-link:hover{

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

    color:var(--text-white) !important;

    transform:translateY(-1px);
}
.main-header-menu .current-menu-item > .menu-link,
.main-header-menu .current_page_item > .menu-link{

    background:rgba(139,92,246,.18);

    color:#fff !important;

    box-shadow:
        0 0 0 1px rgba(139,92,246,.16),
        0 8px 22px rgba(139,92,246,.18);
}
.ast-site-title-wrap,
.site-branding{
    color:var(--text-white);
}
/* ===============================
   NAVBAR INNER SPACING
================================ */

.ast-builder-grid-row{
    min-height:74px !important;
    padding-inline:14px;
}

.main-header-bar{
    padding:0 10px;
}

/* SOCIAL ICON */
.ast-header-social-wrap,
.ast-header-social-wrap .ast-builder-social-element,
.ast-header-social-wrap .ast-social-stack-desktop{
    display:flex !important;
    flex-direction:row !important;
    align-items:center !important;
    gap:10px;
}
.ast-header-social-wrap{
    margin-left:18px;
}

.ast-header-social-wrap .ast-builder-social-element{
    margin:0 !important;
}
.ast-header-social-wrap a{
    width:38px;
    height:38px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:50%;

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

    transition:
        background .25s ease,
        transform .25s ease;
}

.ast-header-social-wrap a:hover{
    background:rgba(139,92,246,.22);
    transform:translateY(-2px);
}
/* LOGO SPACING */
.ast-site-identity{
    padding-left:10px;
}

.site-branding img{
    max-height:42px;
}
/* Hide Astra social icons on premium header */
.ast-header-social-wrap{
    display:none !important;
}
/* ===============================
   HOME PAGE FULL WIDTH FIX
================================ */

body.home .ast-container,
body.home .site-content,
body.home .content-area,
body.home .site-main{
    width:100% !important;
    max-width:100% !important;
    margin-left:auto !important;
    margin-right:auto !important;
    padding-left:0 !important;
    padding-right:0 !important;
}

body.home .entry-content{
    width:100% !important;
    max-width:100% !important;
    margin:0 auto !important;
}