/*
 * =======================================================================
 * 👑 SmmPanelUS: GLOBAL CSS FRAMEWORK v3.3 (Class-Only Edition)
 * Unification: MaxArden-Programmer
 *
 * DESCRIPTION:
 * The final, fully encapsulated style system.
 * - NO styles for global tags (h1, p, a).
 * - All styling is done via unique classes.
 * - Detailed responsive typography.
 * - Adjusted border-radius (10px for blocks, 100px for buttons).
 * - No font-family declarations.
 * =======================================================================
 */


/*
 * =======================================================================
 * SECTION 1: GLOBAL VARIABLES (:root)
 * =======================================================================
 */
 :root {
    /* ----------------------------------------- */
    /* 🎨 COLOR PALETTE */
    /* ----------------------------------------- */
    --SmmPanelUS-MaxArden-Programmer-colorPrimary: rgba(75, 117, 238, 1);
    --SmmPanelUS-MaxArden-Programmer-colorAccent: rgba(249, 70, 43, 1);
    --SmmPanelUS-MaxArden-Programmer-colorText-Default: #0D0E1E;
    --SmmPanelUS-MaxArden-Programmer-colorText-Muted: #6c757d;
    --SmmPanelUS-MaxArden-Programmer-colorText-Light: #FFFFFF;
    --SmmPanelUS-MaxArden-Programmer-colorBackground-Body: #FFFFFF;
    --SmmPanelUS-MaxArden-Programmer-colorBackground-Component: #FFFFFF;
    --SmmPanelUS-MaxArden-Programmer-colorBorder-Default: #E0E0E0;

    /* ----------------------------------------- */
    /* ✒️ TYPOGRAPHY (DESKTOP VERSION) */
    /* ----------------------------------------- */
    --SmmPanelUS-MaxArden-Programmer-fontSize-h1: 2.5rem;    /* 40px */
    --SmmPanelUS-MaxArden-Programmer-fontSize-h2: 2.2rem;    /* 35.2px */
    --SmmPanelUS-MaxArden-Programmer-fontSize-h3: 1.75rem;   /* 28px */
    --SmmPanelUS-MaxArden-Programmer-fontSize-h4: 1.25rem;   /* 20px */
    --SmmPanelUS-MaxArden-Programmer-fontSize-body: 1.1rem;  /* 17.6px */
    --SmmPanelUS-MaxArden-Programmer-fontSize-small: 0.875rem; /* 14px */
    --SmmPanelUS-MaxArden-Programmer-fontWeight-Light: 300;
    --SmmPanelUS-MaxArden-Programmer-fontWeight-Normal: 400;
    --SmmPanelUS-MaxArden-Programmer-fontWeight-Medium: 600;
    --SmmPanelUS-MaxArden-Programmer-fontWeight-Bold: 700;
    --SmmPanelUS-MaxArden-Programmer-lineHeight-Normal: 1.7;
    --SmmPanelUS-MaxArden-Programmer-lineHeight-Heading: 1.4;

    /* ----------------------------------------- */
    /* 📐 SPACING & SIZING */
    /* ----------------------------------------- */
    --SmmPanelUS-MaxArden-Programmer-space-3: 1rem;       /* 16px */
    --SmmPanelUS-MaxArden-Programmer-space-4: 1.5rem;       /* 24px */
    --SmmPanelUS-MaxArden-Programmer-space-5: 2.5rem;       /* 40px */
    --SmmPanelUS-MaxArden-Programmer-space-6: 4rem;       /* 64px */
    --SmmPanelUS-MaxArden-Programmer-container-width: 1280px;

    /* ----------------------------------------- */
    /* 🖼️ BORDERS & SHADOWS */
    /* ----------------------------------------- */
    --SmmPanelUS-MaxArden-Programmer-borderRadius-block: 10px;
    --SmmPanelUS-MaxArden-Programmer-borderRadius-button: 100px;
    --SmmPanelUS-MaxArden-Programmer-boxShadow-medium: 0 10px 25px rgba(0, 0, 0, 0.1);
    
    /* ----------------------------------------- */
    /* ⏱️ TRANSITIONS */
    /* ----------------------------------------- */
    --SmmPanelUS-MaxArden-Programmer-transition-fast: 0.2s ease-out;
    --SmmPanelUS-MaxArden-Programmer-transition-normal: 0.4s ease-out;
}


/*
 * =======================================================================
 * SECTION 2: RESPONSIVE TYPOGRAPHY
 * =======================================================================
 */

/* Tablets (up to 992px) */
@media (max-width: 992px) {
    :root {
        --SmmPanelUS-MaxArden-Programmer-fontSize-h1: 2.2rem;
        --SmmPanelUS-MaxArden-Programmer-fontSize-h2: 1.9rem;
        --SmmPanelUS-MaxArden-Programmer-fontSize-h3: 1.5rem;
        --SmmPanelUS-MaxArden-Programmer-fontSize-h4: 1.15rem;
        --SmmPanelUS-MaxArden-Programmer-fontSize-body: 1.05rem;
    }
}

/* Mobile devices (up to 576px) */
@media (max-width: 576px) {
    :root {
        --SmmPanelUS-MaxArden-Programmer-fontSize-h1: 1.8rem;
        --SmmPanelUS-MaxArden-Programmer-fontSize-h2: 1.6rem;
        --SmmPanelUS-MaxArden-Programmer-fontSize-h3: 1.3rem;
        --SmmPanelUS-MaxArden-Programmer-fontSize-h4: 1.1rem;
        --SmmPanelUS-MaxArden-Programmer-fontSize-body: 1rem;
    }
}


/*
 * =======================================================================
 * SECTION 3: DARK THEME
 * =======================================================================
 */
.theme-dark-active {
    --SmmPanelUS-MaxArden-Programmer-colorText-Default: #FFFFFF;
    --SmmPanelUS-MaxArden-Programmer-colorText-Muted: rgba(255, 255, 255, 0.6);
    --SmmPanelUS-MaxArden-Programmer-colorBackground-Body: #0D0E1E;
    --SmmPanelUS-MaxArden-Programmer-colorBackground-Component: #1A1B2D;
    --SmmPanelUS-MaxArden-Programmer-colorBorder-Default: #333448;
    --SmmPanelUS-MaxArden-Programmer-boxShadow-medium: 0 10px 25px rgba(0, 0, 0, 0.4);
}


/*
 * =======================================================================
 * SECTION 4: COMPONENT LIBRARY
 * =======================================================================
 */

/* ----------------------------------------- */
/* 4.1 Component: Typography (Classes) */
/* ----------------------------------------- */
.SmmPanelUS-MaxArden-Programmer-Heading--h1 {
    font-size: var(--SmmPanelUS-MaxArden-Programmer-fontSize-h1);
    font-weight: var(--SmmPanelUS-MaxArden-Programmer-fontWeight-Bold);
    line-height: var(--SmmPanelUS-MaxArden-Programmer-lineHeight-Heading);
    color: var(--SmmPanelUS-MaxArden-Programmer-colorText-Default);
}
.SmmPanelUS-MaxArden-Programmer-Heading--h2 {
    font-size: var(--SmmPanelUS-MaxArden-Programmer-fontSize-h2);
    font-weight: var(--SmmPanelUS-MaxArden-Programmer-fontWeight-Medium);
    line-height: var(--SmmPanelUS-MaxArden-Programmer-lineHeight-Heading);
    color: var(--SmmPanelUS-MaxArden-Programmer-colorText-Default);
}
/* ... and so on for h3, h4 ... */

.SmmPanelUS-MaxArden-Programmer-Paragraph {
    font-size: var(--SmmPanelUS-MaxArden-Programmer-fontSize-body);
    font-weight: var(--SmmPanelUS-MaxArden-Programmer-fontWeight-Light);
    color: var(--SmmPanelUS-MaxArden-Programmer-colorText-Muted);
    line-height: var(--SmmPanelUS-MaxArden-Programmer-lineHeight-Normal);
}
.SmmPanelUS-MaxArden-Programmer-Link {
    color: var(--SmmPanelUS-MaxArden-Programmer-colorPrimary);
    text-decoration: none;
    transition: color var(--SmmPanelUS-MaxArden-Programmer-transition-fast);
}
.SmmPanelUS-MaxArden-Programmer-Link:hover {
    color: var(--SmmPanelUS-MaxArden-Programmer-colorAccent);
}

/* ----------------------------------------- */
/* 4.2 Component: Container & Sections */
/* ----------------------------------------- */
.SmmPanelUS-MaxArden-Programmer-Container {
    width: 100%;
    max-width: var(--SmmPanelUS-MaxArden-Programmer-container-width);
    margin-left: auto;
    margin-right: auto;
    padding-left: var(--SmmPanelUS-MaxArden-Programmer-space-4);
    padding-right: var(--SmmPanelUS-MaxArden-Programmer-space-4);
}
.SmmPanelUS-MaxArden-Programmer-Section {
    padding-top: var(--SmmPanelUS-MaxArden-Programmer-space-6);
    padding-bottom: var(--SmmPanelUS-MaxArden-Programmer-space-6);
}

/* ----------------------------------------- */
/* 4.3 Component: Buttons */
/* ----------------------------------------- */
.SmmPanelUS-MaxArden-Programmer-Button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 14px 30px;
    font-size: 1rem;
    font-weight: var(--SmmPanelUS-MaxArden-Programmer-fontWeight-Bold);
    text-decoration: none;
    cursor: pointer;
    border: 2px solid transparent;
    border-radius: var(--SmmPanelUS-MaxArden-Programmer-borderRadius-button);
    transition: all var(--SmmPanelUS-MaxArden-Programmer-transition-fast);
}
.SmmPanelUS-MaxArden-Programmer-Button--wave {
    position: relative;
    border-color: var(--SmmPanelUS-MaxArden-Programmer-colorAccent);
    color: var(--SmmPanelUS-MaxArden-Programmer-colorAccent);
    overflow: hidden;
}
.SmmPanelUS-MaxArden-Programmer-Button--wave::before {
    content: ''; position: absolute; left: 0; top: 0; width: 100%; height: 100%;
    background-color: var(--SmmPanelUS-MaxArden-Programmer-colorAccent);
    transform: translateX(-101%);
    transition: transform var(--SmmPanelUS-MaxArden-Programmer-transition-normal);
    z-index: 1;
}
.SmmPanelUS-MaxArden-Programmer-Button--wave > * { position: relative; z-index: 2; }
.SmmPanelUS-MaxArden-Programmer-Button--wave:hover { color: var(--SmmPanelUS-MaxArden-Programmer-colorText-Light); }
.SmmPanelUS-MaxArden-Programmer-Button--wave:hover::before { transform: translateX(0); }

/* ----------------------------------------- */
/* 4.4 Component: Cards */
/* ----------------------------------------- */
.SmmPanelUS-MaxArden-Programmer-Card {
    background-color: var(--SmmPanelUS-MaxArden-Programmer-colorBackground-Component);
    border: 1px solid var(--SmmPanelUS-MaxArden-Programmer-colorBorder-Default);
    border-radius: var(--SmmPanelUS-MaxArden-Programmer-borderRadius-block);
    padding: var(--SmmPanelUS-MaxArden-Programmer-space-4);
    height: 100%;
}
.SmmPanelUS-MaxArden-Programmer-Card--stat {
    position: relative;
    overflow: hidden;
    color: var(--SmmPanelUS-MaxArden-Programmer-colorText-Light);
    border: none !important;
    background-color: var(--SmmPanelUS-MaxArden-Programmer-colorPrimary);
    transition: transform var(--SmmPanelUS-MaxArden-Programmer-transition-fast), box-shadow var(--SmmPanelUS-MaxArden-Programmer-transition-fast);
}
.SmmPanelUS-MaxArden-Programmer-Card--stat:hover {
    transform: translateY(-5px);
    box-shadow: var(--SmmPanelUS-MaxArden-Programmer-boxShadow-medium);
}
.SmmPanelUS-MaxArden-Programmer-Card--stat.is-accent {
    background: linear-gradient(45deg, var(--SmmPanelUS-MaxArden-Programmer-colorAccent), #FF8A75);
}

/* ----------------------------------------- */
/* 4.5 Component: Custom Lists */
/* ----------------------------------------- */
.SmmPanelUS-MaxArden-Programmer-List {
    list-style: none;
    padding-left: 0;
    display: flex;
    flex-direction: column;
    gap: var(--SmmPanelUS-MaxArden-Programmer-space-3);
}
.SmmPanelUS-MaxArden-Programmer-List__item {
    display: flex;
    align-items: flex-start;
    gap: var(--SmmPanelUS-MaxArden-Programmer-space-3);
    color: var(--SmmPanelUS-MaxArden-Programmer-colorText-Muted);
    font-weight: var(--SmmPanelUS-MaxArden-Programmer-fontWeight-Light);
}
.SmmPanelUS-MaxArden-Programmer-List--numbered {
    counter-reset: smm-counter;
}
.SmmPanelUS-MaxArden-Programmer-List--numbered .SmmPanelUS-MaxArden-Programmer-List__item::before {
    counter-increment: smm-counter;
    content: counter(smm-counter);
    background-color: var(--SmmPanelUS-MaxArden-Programmer-colorPrimary);
    color: var(--SmmPanelUS-MaxArden-Programmer-colorText-Light);
    min-width: 24px;
    height: 24px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: var(--SmmPanelUS-MaxArden-Programmer-fontSize-small);
    font-weight: var(--SmmPanelUS-MaxArden-Programmer-fontWeight-Bold);
    margin-top: 2px;
    flex-shrink: 0;
}


/* ======================================================================= */
    /* 👑 SmmPanelUS: BLOG v14.1 (Full & Fixed)
    /* ======================================================================= */
    
    
    .SmmPanelUS-MaxArden-Programmer-BlogPost-Layout { display: block; margin-top: var(--SmmPanelUS-MaxArden-Programmer-space-5); }
    @media (min-width: 992px) { .SmmPanelUS-MaxArden-Programmer-BlogPost-Layout { display: grid; grid-template-columns: 1fr 320px; align-items: flex-start; gap: var(--SmmPanelUS-MaxArden-Programmer-space-5); } }
    .SmmPanelUS-MaxArden-Programmer-BlogPost-Layout__main { min-width: 0; }
    .SmmPanelUS-MaxArden-Programmer-BlogPost-Layout__sidebar { margin-top: var(--SmmPanelUS-MaxArden-Programmer-space-5); }
    @media (min-width: 992px) { .SmmPanelUS-MaxArden-Programmer-BlogPost-Layout__sidebar { margin-top: 0; position: sticky; top: 2rem; } }
    
    .SmmPanelUS-MaxArden-Programmer-BlogPost-HeaderMeta { display: flex; justify-content: center; align-items: center; flex-wrap: wrap; gap: var(--SmmPanelUS-MaxArden-Programmer-space-4); color: var(--SmmPanelUS-MaxArden-Programmer-colorText-Muted); font-size: var(--SmmPanelUS-MaxArden-Programmer-fontSize-small); padding-top: var(--SmmPanelUS-MaxArden-Programmer-space-4); }
    .SmmPanelUS-MaxArden-Programmer-BlogPost-HeaderMeta span { display: inline-flex; align-items: center; gap: 8px; }
    .SmmPanelUS-MaxArden-Programmer-BlogPost-ImageWrapper { display: block; margin-bottom: var(--SmmPanelUS-MaxArden-Programmer-space-4); overflow: hidden; border-radius: var(--SmmPanelUS-MaxArden-Programmer-borderRadius-block); }
    .SmmPanelUS-MaxArden-Programmer-BlogPost-Image { display: block; width: 100%; height: auto; object-fit: cover; }
    
    .SmmPanelUS-MaxArden-Programmer-BlogPost-Content > *:first-child { margin-top: 0; }
    .SmmPanelUS-MaxArden-Programmer-BlogPost-Content > *:last-child { margin-bottom: 0; }
    .SmmPanelUS-MaxArden-Programmer-BlogPost-Content p,
    .SmmPanelUS-MaxArden-Programmer-BlogPost-Content li { font-size: var(--SmmPanelUS-MaxArden-Programmer-fontSize-body); font-weight: var(--SmmPanelUS-MaxArden-Programmer-fontWeight-Light); color: var(--SmmPanelUS-MaxArden-Programmer-colorText-Muted); line-height: var(--SmmPanelUS-MaxArden-Programmer-lineHeight-Normal); }
    .SmmPanelUS-MaxArden-Programmer-BlogPost-Content p { margin-bottom: 1.5rem; }
    .SmmPanelUS-MaxArden-Programmer-BlogPost-Content a { color: var(--SmmPanelUS-MaxArden-Programmer-colorPrimary); text-decoration: underline; }
    .SmmPanelUS-MaxArden-Programmer-BlogPost-Content h2,
    .SmmPanelUS-MaxArden-Programmer-BlogPost-Content h3,
    .SmmPanelUS-MaxArden-Programmer-BlogPost-Content h4 { color: var(--SmmPanelUS-MaxArden-Programmer-colorText-Default) !important; font-weight: var(--SmmPanelUS-MaxArden-Programmer-fontWeight-Bold); margin: 2.5rem 0 1rem 0; }
    .SmmPanelUS-MaxArden-Programmer-BlogPost-Content h2 { font-size: var(--SmmPanelUS-MaxArden-Programmer-fontSize-h2); }
    .SmmPanelUS-MaxArden-Programmer-BlogPost-Content h3 { font-size: var(--SmmPanelUS-MaxArden-Programmer-fontSize-h3); }
    .SmmPanelUS-MaxArden-Programmer-BlogPost-Content h4 { font-size: var(--SmmPanelUS-MaxArden-Programmer-fontSize-h4); }
    .SmmPanelUS-MaxArden-Programmer-BlogPost-Content ul,
    .SmmPanelUS-MaxArden-Programmer-BlogPost-Content ol { list-style: none; padding-left: 0; margin-bottom: 1.5rem; }
    .SmmPanelUS-MaxArden-Programmer-BlogPost-Content ul li,
    .SmmPanelUS-MaxArden-Programmer-BlogPost-Content ol li { display: flex; align-items: flex-start; padding-left: 0; margin-bottom: 1rem; }
    .SmmPanelUS-MaxArden-Programmer-BlogPost-Content ul li::before { content: ''; flex-shrink: 0; display: inline-block; width: 8px; height: 8px; border-radius: 50%; background-color: var(--SmmPanelUS-MaxArden-Programmer-colorPrimary); margin-right: 14px; margin-top: 10px; }
    .SmmPanelUS-MaxArden-Programmer-BlogPost-Content ol { counter-reset: smm-post-counter; }
    .SmmPanelUS-MaxArden-Programmer-BlogPost-Content ol li { counter-increment: smm-post-counter; }
    .SmmPanelUS-MaxArden-Programmer-BlogPost-Content ol li::before { content: counter(smm-post-counter); flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; border-radius: 50%; background-color: var(--SmmPanelUS-MaxArden-Programmer-colorPrimary); color: var(--SmmPanelUS-MaxArden-Programmer-colorText-Light); font-size: 13px; font-weight: var(--SmmPanelUS-MaxArden-Programmer-fontWeight-Bold); margin-right: 12px; margin-top: 4px; }
    
    .SmmPanelUS-MaxArden-Programmer-AuthorBox { margin-top: var(--SmmPanelUS-MaxArden-Programmer-space-5); padding: var(--SmmPanelUS-MaxArden-Programmer-space-4); border: 1px solid var(--SmmPanelUS-MaxArden-Programmer-colorBorder-Default); border-radius: var(--SmmPanelUS-MaxArden-Programmer-borderRadius-block); background-color: var(--SmmPanelUS-MaxArden-Programmer-colorBackground-Component); }
    .SmmPanelUS-MaxArden-Programmer-AuthorBox__MetaList { list-style: none; padding: 0; margin: 0; font-size: var(--SmmPanelUS-MaxArden-Programmer-fontSize-small); color: var(--SmmPanelUS-MaxArden-Programmer-colorText-Muted); }
    .SmmPanelUS-MaxArden-Programmer-AuthorBox__MetaList li { display: flex; align-items: center; gap: 12px; }
    .SmmPanelUS-MaxArden-Programmer-AuthorBox__MetaList li:not(:last-child) { margin-bottom: 0.75rem; }
    .SmmPanelUS-MaxArden-Programmer-AuthorBox__MetaList li .fa-fw { color: var(--SmmPanelUS-MaxArden-Programmer-colorPrimary); font-size: 1.1em; }
    
    .SmmPanelUS-MaxArden-Programmer-BlogPost-SidebarCard {
        background-color: var(--SmmPanelUS-MaxArden-Programmer-colorBackground-Component);
        border: 1px solid var(--SmmPanelUS-MaxArden-Programmer-colorBorder-Default);
        border-radius: var(--SmmPanelUS-MaxArden-Programmer-borderRadius-block);
        padding: var(--SmmPanelUS-MaxArden-Programmer-space-4);
        margin-bottom: var(--SmmPanelUS-MaxArden-Programmer-space-4);
        overflow: hidden;
    }
    .SmmPanelUS-MaxArden-Programmer-BlogPost-Layout__sidebar > .SmmPanelUS-MaxArden-Programmer-BlogPost-SidebarCard:last-child {
        margin-bottom: 0;
    }
    
    .SmmPanelUS-MaxArden-Programmer-TocList { list-style: none; padding-left: 0; margin: 0; }
    .SmmPanelUS-MaxArden-Programmer-TocList ul { list-style: none; padding-left: 20px; margin-top: 0.5rem; }
    .SmmPanelUS-MaxArden-Programmer-TocList li { margin-bottom: 0.75rem; }
    .SmmPanelUS-MaxArden-Programmer-TocList a { color: var(--SmmPanelUS-MaxArden-Programmer-colorText-Muted); text-decoration: none; font-size: var(--SmmPanelUS-MaxArden-Programmer-fontSize-small); font-weight: var(--SmmPanelUS-MaxArden-Programmer-fontWeight-Medium); transition: color 0.2s; }
    .SmmPanelUS-MaxArden-Programmer-TocList a:hover { color: var(--SmmPanelUS-MaxArden-Programmer-colorPrimary); }
    
    .SmmPanelUS-MaxArden-Programmer-BlogPost-CtaSection { margin-top: var(--SmmPanelUS-MaxArden-Programmer-space-6); padding: var(--SmmPanelUS-MaxArden-Programmer-space-5); background-color: var(--SmmPanelUS-MaxArden-Programmer-colorBackground-Component); border: 1px solid var(--SmmPanelUS-MaxArden-Programmer-colorBorder-Default); border-radius: var(--SmmPanelUS-MaxArden-Programmer-borderRadius-block); text-align: center; }
    .SmmPanelUS-MaxArden-Programmer-BlogPost-CtaSection .SmmPanelUS-MaxArden-Programmer-Paragraph { max-width: 500px; margin-left: auto; margin-right: auto; margin-top: 1rem; margin-bottom: 2rem; }
    
    .SmmPanelUS-MaxArden-Programmer-Breadcrumbs-Wrapper { display:flex; justify-content: center; padding-top: var(--SmmPanelUS-MaxArden-Programmer-space-3); padding-bottom: var(--SmmPanelUS-MaxArden-Programmer-space-5); border-bottom: 1px solid var(--SmmPanelUS-MaxArden-Programmer-colorBorder-Default); }
    .SmmPanelUS-MaxArden-Programmer-Breadcrumbs { list-style: none; padding: 0; margin: 0; display: flex; align-items: center; flex-wrap: wrap; gap: 0.5rem; font-size: var(--SmmPanelUS-MaxArden-Programmer-fontSize-small); }
    .SmmPanelUS-MaxArden-Programmer-Breadcrumbs__item:not(:last-child)::after { content: '/'; margin-left: 0.5rem; color: var(--SmmPanelUS-MaxArden-Programmer-colorText-Muted); opacity: 0.5; }
    .SmmPanelUS-MaxArden-Programmer-Breadcrumbs__link { color: var(--SmmPanelUS-MaxArden-Programmer-colorText-Muted); text-decoration: none; transition: color 0.2s; }
    .SmmPanelUS-MaxArden-Programmer-Breadcrumbs__link:hover { color: var(--SmmPanelUS-MaxArden-Programmer-colorPrimary); }
    .SmmPanelUS-MaxArden-Programmer-Breadcrumbs__item.is-active { color: var(--SmmPanelUS-MaxArden-Programmer-colorText-Default); font-weight: var(--SmmPanelUS-MaxArden-Programmer-fontWeight-Medium); }
    .SmmPanelUS-MaxArden-Programmer-VideoWrapper { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; border-radius: var(--SmmPanelUS-MaxArden-Programmer-borderRadius-block); background-color: #000; }
    .SmmPanelUS-MaxArden-Programmer-VideoWrapper iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: 0; }
    .SmmPanelUS-MaxArden-Programmer-Button--wave { position: relative; border-color: var(--SmmPanelUS-MaxArden-Programmer-colorAccent); color: var(--SmmPanelUS-MaxArden-Programmer-colorAccent); overflow: hidden; }
    .SmmPanelUS-MaxArden-Programmer-Button--wave::before { content: ''; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-color: var(--SmmPanelUS-MaxArden-Programmer-colorAccent); transform: translateX(-101%); transition: transform 0.4s ease-out; z-index: 1; }
    .SmmPanelUS-MaxArden-Programmer-Button--wave > * { position: relative; z-index: 2; }
    .SmmPanelUS-MaxArden-Programmer-Button--wave:hover,
    .SmmPanelUS-MaxArden-Programmer-Button--wave:hover > * { color: #FFFFFF !important; }
    .SmmPanelUS-MaxArden-Programmer-Button--wave:hover::before { transform: translateX(0); }



.SmmPanelUS-MaxArden-Programmer-BlogPost-CtaButton {
    /* Базовые стили */
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 14px 30px;
    font-size: 1rem;
    font-weight: 700;
    text-decoration: none !important;
    cursor: pointer;
    border-radius: 100px;
    transition: color 0.4s ease-out;
    
    border: 2px solid #F9462B; /* Accent Color */
    color: #F9462B !important;     /* Accent Color */
    position: relative;
    overflow: hidden;
}

.SmmPanelUS-MaxArden-Programmer-BlogPost-CtaButton::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: #F9462B; /* Accent Color */
    transform: translateX(-101%);
    transition: transform 0.4s ease-out;
    z-index: 1;
}

.SmmPanelUS-MaxArden-Programmer-BlogPost-CtaButton > * {
    position: relative;
    z-index: 2;
}

.SmmPanelUS-MaxArden-Programmer-BlogPost-CtaButton:hover,
.SmmPanelUS-MaxArden-Programmer-BlogPost-CtaButton:hover > * {
    color: #FFFFFF !important;
}

.SmmPanelUS-MaxArden-Programmer-BlogPost-CtaButton:hover::before {
    transform: translateX(0);
}

/*
 * =======================================================================
 * 👑 SmmPanelUS: BLOG GENERAL global-max-arden.css
 * =======================================================================
 */

.SmmPanelUS-MaxArden-Programmer-BlogList-Layout { display: block; margin-top: var(--SmmPanelUS-MaxArden-Programmer-space-5); }
@media (min-width: 992px) {
    .SmmPanelUS-MaxArden-Programmer-BlogList-Layout { display: grid; grid-template-columns: 1fr 320px; align-items: flex-start; gap: var(--SmmPanelUS-MaxArden-Programmer-space-5); }
    .SmmPanelUS-MaxArden-Programmer-BlogList-Layout__sidebar { margin-top: 0; position: sticky; top: 2rem; }
}

.SmmPanelUS-MaxArden-Programmer-BlogList-Grid { display: grid; gap: var(--SmmPanelUS-MaxArden-Programmer-space-5); grid-template-columns: 1fr; }
@media (min-width: 768px) { .SmmPanelUS-MaxArden-Programmer-BlogList-Grid { grid-template-columns: repeat(2, 1fr); } }
.SmmPanelUS-MaxArden-Programmer-BlogList-Card { display: flex; flex-direction: column; background-color: var(--SmmPanelUS-MaxArden-Programmer-colorBackground-Component); border: 1px solid var(--SmmPanelUS-MaxArden-Programmer-colorBorder-Default); border-radius: var(--SmmPanelUS-MaxArden-Programmer-borderRadius-block); box-shadow: 0 4px 25px rgba(0, 0, 0, 0.04); transition: transform 0.3s ease, box-shadow 0.3s ease; overflow: hidden; }
.SmmPanelUS-MaxArden-Programmer-BlogList-Card:hover { transform: translateY(-7px); box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08); }
.SmmPanelUS-MaxArden-Programmer-BlogList-Card__Image { width: 100%; height: 220px; object-fit: cover; }
.SmmPanelUS-MaxArden-Programmer-BlogList-Card__Content { padding: var(--SmmPanelUS-MaxArden-Programmer-space-4); display: flex; flex-direction: column; gap: 0.8rem; flex-grow: 1; }
.SmmPanelUS-MaxArden-Programmer-BlogList-Card__TagsContainer { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.SmmPanelUS-MaxArden-Programmer-BlogList-Card__Category { display: inline-block; padding: 4px 10px; font-size: 0.65rem; font-weight: var(--SmmPanelUS-MaxArden-Programmer-fontWeight-Bold); color: var(--SmmPanelUS-MaxArden-Programmer-colorPrimary); background-color: rgba(75, 117, 238, 0.1); border-radius: var(--SmmPanelUS-MaxArden-Programmer-borderRadius-button); text-transform: uppercase; letter-spacing: 0.5px; }
.SmmPanelUS-MaxArden-Programmer-BlogList-Card__Meta { display: flex; align-items: center; gap: 0.5rem; font-size: var(--SmmPanelUS-MaxArden-Programmer-fontSize-small); color: var(--SmmPanelUS-MaxArden-Programmer-colorText-Muted); }
h3.SmmPanelUS-MaxArden-Programmer-BlogList-Card__Title { font-size: var(--SmmPanelUS-MaxArden-Programmer-fontSize-h4); line-height: 1.5; margin: 0; flex-grow: 1; }

.SmmPanelUS-MaxArden-Programmer-BlogList-Pagination { list-style: none; padding-left: 0; display: flex; justify-content: center; align-items: center; flex-wrap: wrap; gap: 8px; }
.SmmPanelUS-MaxArden-Programmer-BlogList-Pagination__link { display: flex; align-items: center; justify-content: center; min-width: 44px; height: 44px; padding: 0 15px; text-decoration: none; font-size: var(--SmmPanelUS-MaxArden-Programmer-fontSize-body); font-weight: var(--SmmPanelUS-MaxArden-Programmer-fontWeight-Medium); color: var(--SmmPanelUS-MaxArden-Programmer-colorText-Default); background-color: transparent; border: 2px solid var(--SmmPanelUS-MaxArden-Programmer-colorBorder-Default); border-radius: var(--SmmPanelUS-MaxArden-Programmer-borderRadius-button); transition: all var(--SmmPanelUS-MaxArden-Programmer-transition-fast); }
.SmmPanelUS-MaxArden-Programmer-BlogList-Pagination__item:not(.is-active) .SmmPanelUS-MaxArden-Programmer-BlogList-Pagination__link:hover { border-color: var(--SmmPanelUS-MaxArden-Programmer-colorPrimary); background-color: var(--SmmPanelUS-MaxArden-Programmer-colorPrimary); color: var(--SmmPanelUS-MaxArden-Programmer-colorText-Light); transform: translateY(-2px); }
.SmmPanelUS-MaxArden-Programmer-BlogList-Pagination__item.is-active .SmmPanelUS-MaxArden-Programmer-BlogList-Pagination__link { border-color: var(--SmmPanelUS-MaxArden-Programmer-colorPrimary); background-color: var(--SmmPanelUS-MaxArden-Programmer-colorPrimary); color: var(--SmmPanelUS-MaxArden-Programmer-colorText-Light); cursor: default; pointer-events: none; }

.SmmPanelUS-MaxArden-Programmer-BlogList-SidebarCard {
    background-color: var(--SmmPanelUS-MaxArden-Programmer-colorBackground-Component);
    border: 1px solid var(--SmmPanelUS-MaxArden-Programmer-colorBorder-Default);
    border-radius: var(--SmmPanelUS-MaxArden-Programmer-borderRadius-block);
    padding: var(--SmmPanelUS-MaxArden-Programmer-space-4);
    margin-bottom: var(--SmmPanelUS-MaxArden-Programmer-space-4);
    overflow: hidden;
}
.SmmPanelUS-MaxArden-Programmer-BlogList-Layout__sidebar > .SmmPanelUS-MaxArden-Programmer-BlogList-SidebarCard:last-child {
    margin-bottom: 0;
}
.SmmPanelUS-MaxArden-Programmer-VideoWrapper { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; border-radius: var(--SmmPanelUS-MaxArden-Programmer-borderRadius-block); background-color: #000; }
.SmmPanelUS-MaxArden-Programmer-VideoWrapper iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: 0; }
.SmmPanelUS-MaxArden-Programmer-BlogList-SidebarLinks { list-style: none; padding-left: 0; margin: 0; display: flex; flex-direction: column; }
.SmmPanelUS-MaxArden-Programmer-BlogList-SidebarLinks__item { display: flex; align-items: flex-start; border-bottom: 1px solid var(--SmmPanelUS-MaxArden-Programmer-colorBorder-Default); padding: 1rem 0; gap: 12px; }
.SmmPanelUS-MaxArden-Programmer-BlogList-SidebarLinks__item i { color: var(--SmmPanelUS-MaxArden-Programmer-colorPrimary); font-size: 1.1em; margin-top: 2px; }
.SmmPanelUS-MaxArden-Programmer-BlogList-SidebarLinks__item:first-child { paddingTop: 0; }
.SmmPanelUS-MaxArden-Programmer-BlogList-SidebarLinks__item:last-child { border-bottom: none; padding-bottom: 0; }
.SmmPanelUS-MaxArden-Programmer-BlogList-SidebarLinks__link { color: var(--SmmPanelUS-MaxArden-Programmer-colorText-Default); text-decoration: none; font-weight: var(--SmmPanelUS-MaxArden-Programmer-fontWeight-Medium); transition: color var(--SmmPanelUS-MaxArden-Programmer-transition-fast); font-size: var(--SmmPanelUS-MaxArden-Programmer-fontSize-small); }
.SmmPanelUS-MaxArden-Programmer-BlogList-SidebarLinks__link:hover { color: var(--SmmPanelUS-MaxArden-Programmer-colorPrimary); }

.SmmPanelUS-MaxArden-Programmer-PageHeader { text-align: center; }
.SmmPanelUS-MaxArden-Programmer-Breadcrumbs-Wrapper { display:flex; justify-content: center; padding-top: var(--SmmPanelUS-MaxArden-Programmer-space-3); padding-bottom: var(--SmmPanelUS-MaxArden-Programmer-space-5); border-bottom: 1px solid var(--SmmPanelUS-MaxArden-Programmer-colorBorder-Default); }
.SmmPanelUS-MaxArden-Programmer-Breadcrumbs { list-style: none; padding: 0; margin: 0; display: flex; align-items: center; flex-wrap: wrap; gap: 0.5rem; font-size: var(--SmmPanelUS-MaxArden-Programmer-fontSize-small); }
.SmmPanelUS-MaxArden-Programmer-Breadcrumbs__item:not(:last-child)::after { content: '/'; margin-left: 0.5rem; color: var(--SmmPanelUS-MaxArden-Programmer-colorText-Muted); opacity: 0.5; }
.SmmPanelUS-MaxArden-Programmer-Breadcrumbs__link { color: var(--SmmPanelUS-MaxArden-Programmer-colorText-Muted); text-decoration: none; transition: color 0.2s; }
.SmmPanelUS-MaxArden-Programmer-Breadcrumbs__link:hover { color: var(--SmmPanelUS-MaxArden-Programmer-colorPrimary); }
.SmmPanelUS-MaxArden-Programmer-Breadcrumbs__item.is-active { color: var(--SmmPanelUS-MaxArden-Programmer-colorText-Default); font-weight: var(--SmmPanelUS-MaxArden-Programmer-fontWeight-Medium); }
.SmmPanelUS-MaxArden-Programmer-Button--outline { background-color: transparent; border: 2px solid var(--SmmPanelUS-MaxArden-Programmer-colorBorder-Default); color: var(--SmmPanelUS-MaxArden-Programmer-colorText-Default); font-weight: var(--SmmPanelUS-MaxArden-Programmer-fontWeight-Medium); }
.SmmPanelUS-MaxArden-Programmer-Button--outline:hover { background-color: var(--SmmPanelUS-MaxArden-Programmer-colorPrimary); border-color: var(--SmmPanelUS-MaxArden-Programmer-colorPrimary); color: var(--SmmPanelUS-MaxArden-Programmer-colorText-Light) !important; }