/**
 * ==============================================================================
 * PADMA RADYA AKTUARIA - DEDICATED LAPTOP / SMALL DESKTOP RESPONSIVE STYLESHEET
 * ==============================================================================
 * Target Breakpoint: >1023px and <1280px (1024px - 1279.98px)
 * 
 * Karakteristik:
 * - Dikhususkan untuk layar Laptop, Small Desktop, & iPad Pro 12.9" Landscape.
 * - Diisolasi penuh dalam @media screen and (min-width: 1024px) and (max-width: 1279.98px).
 * - Tidak mengganggu tampilan Mobile (<=767px), Tablet (768px-1023px), maupun Desktop Luas (>=1280px).
 * - Berlaku untuk semua halaman pada project web_padma.
 * ==============================================================================
 */

@media screen and (min-width: 1024px) and (max-width: 1279.98px) {

    /* ==========================================================================
       1. GLOBAL RESET & BASE CONTAINER ADJUSTMENTS
       ========================================================================== */
    html {
        font-size: 15.5px;
        overflow-x: hidden !important;
    }

    body {
        overflow-x: hidden !important;
        background-color: #FFFFFF !important;
    }

    /* Section padding scale: 6% padding prevents cramped layout on 1024px-1279px */
    .section,
    .section2,
    .section3,
    .section4,
    .section5,
    .sectionartikel {
        padding: 4.5rem 6% !important;
        width: 100% !important;
        box-sizing: border-box;
    }

    .section_services1,
    .section_services2,
    .section_services3,
    .section_eb1,
    .section_eb2,
    .section_eb3,
    .section_ins1,
    .section_ins2,
    .section_ins3,
    .section_artikel1 {
        padding: 3.5rem 6% !important;
        width: 100% !important;
        box-sizing: border-box;
    }

    .content-wrapper {
        width: 100% !important;
        max-width: 1140px !important;
        margin: 0 auto;
        box-sizing: border-box;
    }

    /* ==========================================================================
       2. TYPOGRAPHY SCALING (LAPTOP / SMALL DESKTOP)
       ========================================================================== */
    h1, .h1 {
        font-size: 46px !important;
        line-height: 1.25 !important;
    }

    h2, .h2 {
        font-size: 32px !important;
        line-height: 1.3 !important;
    }

    h3, .h3 {
        font-size: 24px !important;
        line-height: 1.35 !important;
    }

    .m-fs-32 {
        font-size: 46px !important;
        line-height: 1.25 !important;
    }

    .m-fs-24 {
        font-size: 26px !important;
        line-height: 1.3 !important;
    }

    .m-fs-18 {
        font-size: 19px !important;
        line-height: 1.4 !important;
    }

    /* ==========================================================================
       3. HEADER & NAVIGATION BAR
       ========================================================================== */
    .header-wrapper {
        background: transparent !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    .navbar {
        background-color: #243980 !important;
        opacity: 1 !important;
        padding: 10px 36px !important;
        height: 75px !important;
    }

    .navbar.scrolled {
        background-color: #243980 !important;
        opacity: 1 !important;
        height: 52px !important;
        padding: 6px 30px !important;
    }

    .navbar .logo {
        display: flex !important;
        align-items: center !important;
    }

    .navbar .logo img {
        max-height: 52px !important;
        width: auto !important;
        object-fit: contain !important;
    }

    .navbar.scrolled .logo img {
        max-height: 40px !important;
    }

    /* Explicitly hide mobile drawer overlay & mobile hamburger on laptop */
    .mobile-menu-overlay {
        display: none !important;
        visibility: hidden !important;
        pointer-events: none !important;
        opacity: 0 !important;
    }

    .mobile-toggle {
        display: none !important;
    }

    /* Ensure desktop navigation links fit comfortably without wrapping or dropping */
    .navbar ul {
        display: flex !important;
        position: static !important;
        width: auto !important;
        height: auto !important;
        max-height: none !important;
        background: transparent !important;
        padding: 0 !important;
        margin: 0 !important;
        box-shadow: none !important;
        overflow: visible !important;
        flex-direction: row !important;
        align-items: center !important;
        gap: 12px !important;
    }

    .navbar ul li {
        display: inline-block !important;
    }

    .navbar ul li a {
        font-size: 13px !important;
        white-space: nowrap !important;
        padding: 4px 6px !important;
        display: inline-block !important;
    }

    /* Header Action: Single Trigger Button & Dropdown on Laptop View */
    .header-classic-actions {
        display: none !important;
    }

    .navbar .search {
        display: flex !important;
        align-items: center !important;
        position: relative !important;
        background: transparent !important;
        border: none !important;
        padding: 0 !important;
        box-shadow: none !important;
    }

    .header-action-toggle-btn {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 36px !important;
        height: 36px !important;
        background: rgba(255, 255, 255, 0.15) !important;
        border: 1px solid rgba(255, 255, 255, 0.28) !important;
        border-radius: 50% !important;
        color: #FFFFFF !important;
        cursor: pointer !important;
        transition: all 0.25s ease !important;
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12) !important;
    }

    .header-action-toggle-btn:hover,
    .header-action-toggle-btn.active {
        background: #2CD6AD !important;
        color: #1E293B !important;
        border-color: #2CD6AD !important;
        transform: scale(1.06) !important;
        box-shadow: 0 4px 12px rgba(44, 214, 173, 0.35) !important;
    }

    /* Dropdown panels: strictly collapse when not active */
    .dropdown-panel {
        box-sizing: border-box;
    }

    .dropdown-panel:not(.active) {
        height: 0 !important;
        max-height: 0 !important;
        overflow: hidden !important;
        visibility: hidden !important;
        display: none !important;
    }

    .dropdown-panel.active {
        display: block !important;
        visibility: visible !important;
        padding: 0 !important;
        overflow: hidden !important;
    }

    .dropdown-panel-grid {
        gap: 30px !important;
    }

    /* ==========================================================================
       4. HOMEPAGE SECTIONS
       ========================================================================== */
    /* Hero Featured Banner */
    .section.bg1 {
        min-height: 85vh !important;
        padding: 6rem 6% 4.5rem 6% !important;
    }

    .section.bg1 .content-wrapper p[style*="font-size: 64px"],
    .section.bg1 .m-fs-32 {
        font-size: 48px !important;
        line-height: 1.2 !important;
        margin-bottom: 20px !important;
    }

    .section.bg1 .content-wrapper p[style*="max-width: 800px"] {
        font-size: 15.5px !important;
        max-width: 720px !important;
        line-height: 1.65 !important;
    }

    /* Latest Perspectives Grid (3-Columns Balanced) */
    .section3 .m-grid-1,
    .section3 div[style*="grid-template-columns"] {
        display: grid !important;
        grid-template-columns: repeat(3, 1fr) !important;
        gap: 20px !important;
        max-width: 1140px !important;
        margin: 0 auto !important;
    }

    .perspective-card {
        height: 100% !important;
    }

    .perspective-card-img {
        height: 190px !important;
        object-fit: cover !important;
    }

    .perspective-card-content {
        padding: 18px !important;
    }

    .desktop-only-header {
        min-height: 130px !important;
        margin-bottom: 12px !important;
    }

    /* Calculator Promo Section */
    .content-wrapper.nonoverlay.flex-row {
        min-height: 360px !important;
    }

    .content-wrapper.nonoverlay.flex-row > div:first-child {
        flex: 1 1 45% !important;
    }

    .content-wrapper.nonoverlay.flex-row > div:last-child {
        flex: 1 1 55% !important;
        padding: 2.8rem !important;
    }

    /* Client Logos Marquee */
    .client-marquee-track {
        gap: 3.5rem !important;
    }

    .client-marquee-item {
        min-width: 125px !important;
        height: 65px !important;
    }

    .client-marquee-item img {
        max-height: 50px !important;
    }

    /* ==========================================================================
       Recruitment / Careers Section (Directly Below Globacs) on Laptop
       ========================================================================== */
    .section3.bg5 {
        min-height: auto !important;
        padding: 5rem 6% !important;
        position: relative !important;
        overflow: hidden !important;
    }

    .section3.bg5 .content-wrapper {
        width: 100% !important;
        max-width: 1140px !important;
        margin: 0 auto !important;
        padding: 0 !important;
    }

    .section3.bg5 .m-stack {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        justify-content: space-between !important;
        gap: 40px !important;
        width: 100% !important;
    }

    /* Left Content Column */
    .section3.bg5 .m-stack > div.m-w-full,
    .section3.bg5 .m-stack > div:first-child {
        flex: 1 1 55% !important;
        max-width: 55% !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: flex-start !important;
        text-align: left !important;
    }

    /* Title */
    .section3.bg5 .m-stack > div.m-w-full p:first-child,
    .section3.bg5 .m-stack > div.m-w-full .m-fs-24,
    .section3.bg5 .recruitment-title {
        font-size: 34px !important;
        font-weight: 700 !important;
        line-height: 1.25 !important;
        max-width: 100% !important;
        color: #ffffff !important;
        margin: 0 0 18px 0 !important;
    }

    /* Description */
    .section3.bg5 .m-stack > div.m-w-full p:nth-child(2),
    .section3.bg5 .m-stack > div.m-w-full .m-fs-16,
    .section3.bg5 .recruitment-desc {
        font-size: 16px !important;
        line-height: 1.65 !important;
        max-width: 100% !important;
        color: rgba(255, 255, 255, 0.95) !important;
        margin-top: 0 !important;
        margin-bottom: 28px !important;
    }

    /* CTA Button Container */
    .section3.bg5 .button_hijau,
    .section3.bg5 .button_hijau.m-btn-center {
        margin-top: 0 !important;
        margin-right: 0 !important;
        width: auto !important;
        display: flex !important;
    }

    /* Right Media / Image Wrapper */
    .section3.bg5 .m-stack > button.btn-img,
    .section3.bg5 .m-stack > button.m-hide,
    .section3.bg5 .recruitment-media {
        display: flex !important;
        flex: 1 1 45% !important;
        max-width: 45% !important;
        position: relative !important;
        justify-content: center !important;
        align-items: center !important;
        border-radius: 16px !important;
        overflow: hidden !important;
        box-shadow: 0 14px 32px rgba(0, 0, 0, 0.3) !important;
        padding: 0 !important;
        border: none !important;
        background: transparent !important;
    }

    /* Main Featured Image */
    .section3.bg5 .m-stack > button.btn-img img:first-child,
    .section3.bg5 .m-stack > button.m-hide img:first-child,
    .section3.bg5 .recruitment-img-main {
        width: 100% !important;
        height: auto !important;
        max-height: 320px !important;
        max-width: 100% !important;
        object-fit: cover !important;
        display: block !important;
        border-radius: 16px !important;
    }

    /* Center Badge Icon */
    .section3.bg5 .m-stack > button.btn-img .img-btn,
    .section3.bg5 .m-stack > button.m-hide .img-btn,
    .section3.bg5 .recruitment-img-badge {
        position: absolute !important;
        top: 50% !important;
        left: 50% !important;
        transform: translate(-50%, -50%) !important;
        width: 66px !important;
        height: 66px !important;
        max-width: none !important;
        pointer-events: none !important;
        z-index: 5 !important;
        filter: drop-shadow(0 4px 12px rgba(0, 0, 0, 0.4)) !important;
    }

    /* ==========================================================================
       Contact Us Section on Homepage (Directly Below Recruitment) on Laptop
       ========================================================================== */
    #contact-us,
    #contact-us.m-section-p,
    section#contact-us,
    section.hidden.md\:block#contact-us {
        padding: 0 !important;
        margin: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
        min-height: auto !important;
        background: transparent !important;
        box-sizing: border-box !important;
    }

    #contact-us .content-wrapper,
    #contact-us .content-wrapper.flex-row {
        display: flex !important;
        flex-direction: row !important;
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        border-radius: 0 !important;
        box-shadow: none !important;
        background: transparent !important;
    }

    /* Left Column: Contact Info & Hours (Full-bleed Navy Blue #243980) */
    #contact-us .content-wrapper > div:first-child {
        flex: 1 1 50% !important;
        max-width: 50% !important;
        padding: 60px 7% !important;
        box-sizing: border-box !important;
        background-color: #243980 !important;
        display: flex !important;
        flex-direction: column !important;
        justify-content: center !important;
    }

    #contact-us .content-wrapper > div:first-child > p:first-child,
    #contact-us p[style*="margin-left: 20%"] {
        margin-left: 0 !important;
        margin-bottom: 24px !important;
        font-size: 15px !important;
        font-weight: 600 !important;
        letter-spacing: 1px !important;
        text-align: left !important;
        color: #ffffff !important;
    }

    #contact-us .content-wrapper > div:first-child .m-stack {
        margin-left: 0 !important;
        width: 100% !important;
    }

    #contact-us .content-wrapper > div:first-child .m-fs-24 {
        font-size: 30px !important;
        font-weight: 700 !important;
        max-width: 100% !important;
        line-height: 1.3 !important;
        color: #57FEC2 !important;
        margin: 0 0 20px 0 !important;
    }

    #contact-us .content-wrapper > div:first-child p[style*="margin-top: 50px"] {
        margin-top: 26px !important;
        font-size: 15.5px !important;
        line-height: 1.6 !important;
        color: #ffffff !important;
    }

    #contact-us .m-stack.flex-row {
        display: flex !important;
        flex-direction: row !important;
        gap: 40px !important;
        margin-top: 24px !important;
    }

    #contact-us .m-stack.flex-row p {
        margin: 0 !important;
        font-size: 15px !important;
        line-height: 1.6 !important;
        color: #ffffff !important;
    }

    #contact-us .flex-row[style*="gap: 30px"] {
        display: flex !important;
        flex-direction: row !important;
        gap: 20px !important;
        margin-top: 14px !important;
        align-items: center !important;
    }

    #contact-us .flex-row[style*="gap: 30px"] img {
        width: 32px !important;
        height: 32px !important;
        object-fit: contain !important;
        transition: transform 0.2s ease !important;
    }

    #contact-us .flex-row[style*="gap: 30px"] img:hover {
        transform: scale(1.1) !important;
    }

    /* Right Column: Contact Form (Full-bleed Light Gray #f0f0f0) */
    #contact-us .content-wrapper > div:last-child {
        flex: 1 1 50% !important;
        max-width: 50% !important;
        padding: 60px 7% !important;
        box-sizing: border-box !important;
        background-color: #f0f0f0 !important;
        display: flex !important;
        flex-direction: column !important;
        justify-content: center !important;
    }

    #contact-us .content-wrapper > div:last-child > p:first-child,
    #contact-us .content-wrapper > div:last-child .m-text-center {
        margin: 0 0 24px 0 !important;
        margin-left: 0 !important;
        margin-top: 0 !important;
        font-size: 30px !important;
        font-weight: 700 !important;
        color: #2A4491 !important;
        text-align: left !important;
    }

    #contact-us form,
    #contact-us form.m-stack {
        margin-left: 0 !important;
        margin-right: 0 !important;
        width: 100% !important;
        display: flex !important;
        flex-direction: column !important;
    }

    #contact-us form input,
    #contact-us form textarea {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        margin-top: 14px !important;
        padding: 12px 18px !important;
        font-size: 15px !important;
        border-radius: 10px !important;
        border: 1px solid #2A4491 !important;
        background-color: #2A4491 !important;
        color: #ffffff !important;
    }

    #contact-us form textarea {
        min-height: 110px !important;
        resize: vertical !important;
    }

    #contact-us form div[style*="margin-top: 5%"] {
        margin-top: 20px !important;
        width: 100% !important;
    }

    #contact-us form #submitContactBtn,
    #contact-us form button[type="submit"] {
        width: 100% !important;
        padding: 14px 24px !important;
        font-size: 16px !important;
        font-weight: 700 !important;
        border-radius: 10px !important;
        background-color: #2CD6AD !important;
        color: #000000 !important;
        border: none !important;
        cursor: pointer !important;
        transition: all 0.3s ease !important;
    }

    #contact-us form #submitContactBtn:hover,
    #contact-us form button[type="submit"]:hover {
        background-color: #24b895 !important;
    }

    #contact-us form p[style*="font-size: 12px"] {
        font-size: 12.5px !important;
        line-height: 1.5 !important;
        color: #555555 !important;
    }

    /* ==========================================================================
       5. PERSPECTIVES / ARTIKEL PAGES
       ========================================================================== */
    /* Featured Article Banner on Artikel Index */
    .artikel-featured-box {
        max-width: 1140px !important;
        padding: 28px 36px !important;
        gap: 32px !important;
    }

    .artikel-featured-box > div:first-child p[style*="font-size: 36px"] {
        font-size: 30px !important;
    }

    .artikel-featured-box img {
        max-height: 260px !important;
    }

    /* Article Listing Grid (3 Columns) */
    .article-grid,
    .container-artikel .grid,
    .sectionartikel .grid {
        display: grid !important;
        grid-template-columns: repeat(3, 1fr) !important;
        gap: 24px !important;
    }

    /* Article Detail Page */
    .article-detail-wrapper,
    .article-detail-container {
        max-width: 920px !important;
        margin: 0 auto !important;
    }

    .article-detail-header h1 {
        font-size: 38px !important;
        line-height: 1.3 !important;
    }

    .article-detail-featured-img {
        max-height: 420px !important;
        width: 100% !important;
        object-fit: cover !important;
    }

    .related-articles-grid {
        grid-template-columns: repeat(3, 1fr) !important;
        gap: 20px !important;
    }

    /* ==========================================================================
       6. SERVICES & SOLUTIONS (EB, INS, ME)
       ========================================================================== */
    /* 6.1 Service Detail Subpages (EB, INS, ME) */
    /* Hero Banner (section_eb1) */
    .section_eb1 {
        min-height: auto !important;
        padding: 5.5rem 6% 2.5rem 6% !important;
        background-color: #FFFFFF !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }

    .section_eb1 .content-wrapper {
        max-width: 1140px !important;
        margin: 0 auto !important;
        padding: 0 !important;
        position: relative !important;
    }

    .section_eb1 p:first-child {
        font-size: 14.5px !important;
        margin-bottom: 8px !important;
        max-width: 62% !important;
    }

    .section_eb1 .m-fs-32 {
        font-size: 40px !important;
        line-height: 1.22 !important;
        font-weight: 700 !important;
        color: #222274 !important;
        margin-top: 6px !important;
        margin-bottom: 16px !important;
        max-width: 62% !important;
    }

    .section_eb1 p:last-child,
    .section_eb1 p[style*="max-width: 700px"],
    .section_eb1 p[style*="font-size: 16px"] {
        font-size: 16.5px !important;
        max-width: 58% !important;
        line-height: 1.65 !important;
        color: #333333 !important;
    }

    /* Section EB2 / Service Subpage Content (Menu, Decorative Image & Service List) */
    .section_eb2 {
        min-height: auto !important;
        padding: 2.5rem 6% 4.5rem 6% !important;
        background-color: #ECF4FF !important;
        width: 100% !important;
        box-sizing: border-box !important;
        position: relative !important;
    }

    /* Top Row Container (Menu Tabs + Decorative Image) */
    .section_eb2 > .content-wrapper:first-child {
        display: flex !important;
        flex-direction: row !important;
        justify-content: space-between !important;
        align-items: center !important;
        width: 100% !important;
        max-width: 1140px !important;
        margin: 0 auto 28px auto !important;
        padding: 0 !important;
        position: relative !important;
        box-sizing: border-box !important;
    }

    /* Quick Nav Buttons Stack in EB */
    .section_eb2 > .content-wrapper:first-child .m-stack {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: wrap !important;
        gap: 12px !important;
        width: auto !important;
        max-width: 65% !important;
        align-items: center !important;
        justify-content: flex-start !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    .section_eb2 .btn-eb {
        width: auto !important;
        flex: 0 0 auto !important;
        padding: 10px 24px !important;
        font-size: 14px !important;
        font-weight: 600 !important;
        border-radius: 8px !important;
        border: 1.5px solid #222274 !important;
        background-color: #ffffff !important;
        color: #222274 !important;
        cursor: pointer !important;
        transition: all 0.25s ease !important;
        box-shadow: 0 2px 8px rgba(34, 34, 116, 0.06) !important;
    }

    .section_eb2 .btn-eb:hover {
        background-color: #222274 !important;
        color: #ffffff !important;
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(34, 34, 116, 0.15) !important;
    }

    /* Decorative Floating Image (ebimg, insimg, meimg) */
    .section_eb2 img[src*="ebimg"],
    .section_eb2 img[src*="insimg"],
    .section_eb2 img[src*="meimg"] {
        display: block !important;
        max-width: 290px !important;
        width: 30% !important;
        height: auto !important;
        object-fit: contain !important;
        margin-top: -220px !important;
        margin-right: 2% !important;
        position: relative !important;
        z-index: 5 !important;
        flex-shrink: 0 !important;
    }

    /* Header "Layanan Tunjangan Karyawan Kelas Utama" (#section-services) */
    .section_eb2 #section-services {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        justify-content: flex-start !important;
        background-color: #ffffff !important;
        border-radius: 14px 14px 0 0 !important;
        width: 100% !important;
        max-width: 1140px !important;
        margin: 0 auto !important;
        padding: 26px 36px 14px 36px !important;
        box-sizing: border-box !important;
    }

    .section_eb2 #section-services img[src*="kotakhijau"] {
        width: 20px !important;
        height: 20px !important;
        margin: 0 14px 0 0 !important;
        flex-shrink: 0 !important;
        display: block !important;
    }

    .section_eb2 #section-services p.m-fs-18,
    .section_eb2 #section-services p {
        font-size: 24px !important;
        font-weight: 700 !important;
        font-family: 'JetBrains Mono', monospace !important;
        color: #27397F !important;
        margin: 0 !important;
        line-height: 1.3 !important;
    }

    /* Dropdown Container Card Wrapper */
    .section_eb2 > .content-wrapper:nth-child(3) {
        display: flex !important;
        flex-direction: column !important;
        background-color: #ffffff !important;
        border-radius: 0 0 14px 14px !important;
        width: 100% !important;
        max-width: 1140px !important;
        margin: 0 auto !important;
        padding: 0 36px 36px 36px !important;
        box-sizing: border-box !important;
    }

    .section_eb2 .eb-dropdown-container {
        width: 100% !important;
        max-width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        padding: 0 !important;
        font-family: 'Inter', sans-serif !important;
    }

    .section_eb2 .info-dropdown {
        border-bottom: 1px solid #E2E8F0 !important;
        width: 100% !important;
        margin: 0 !important;
    }

    .section_eb2 .dropdown-toggle {
        display: flex !important;
        justify-content: space-between !important;
        align-items: center !important;
        width: 100% !important;
        padding: 20px 0 !important;
        background: transparent !important;
        border: none !important;
        cursor: pointer !important;
        text-align: left !important;
        box-sizing: border-box !important;
    }

    .section_eb2 .dropdown-toggle span {
        font-size: 19px !important;
        font-weight: 600 !important;
        color: #5468B6 !important;
    }

    .section_eb2 .dropdown-content p {
        font-size: 15.5px !important;
        line-height: 1.6 !important;
        color: #4B5563 !important;
    }

    /* Content block headers in EB subpages */
    .section_eb3 > .content-wrapper:first-child,
    .section_eb5 > .content-wrapper:first-child {
        max-width: 1140px !important;
        margin: 0 auto !important;
        padding-left: 0 !important;
    }

    /* 6.2 Generic Service Grids & Layouts */
    .services-grid,
    .eb-features-grid,
    .ins-services-grid {
        display: grid !important;
        grid-template-columns: repeat(3, 1fr) !important;
        gap: 24px !important;
    }

    .service-split-row {
        gap: 36px !important;
    }

    .lead-form-grid {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 18px !important;
    }

    /* ==========================================================================
       7. PENSIONLAB® & SIMULATION
       ========================================================================== */
    .pensionlab-container {
        max-width: 1140px !important;
        margin: 0 auto !important;
        padding: 2.5rem 2% !important;
    }

    .sim-card {
        padding: 28px !important;
    }

    .sim-result-summary {
        display: grid !important;
        grid-template-columns: repeat(3, 1fr) !important;
        gap: 18px !important;
    }

    .chart-container-wrapper {
        min-height: 360px !important;
    }

    /* ==========================================================================
       8. WORKSHOP, PAST EVENTS & PADMATALKS
       ========================================================================== */
    /* 8.1 Workshop Page (workshop.blade.php) */
    .section_tw1 {
        min-height: auto !important;
        padding: 5rem 6% 1.5rem 6% !important;
        background-color: #FFFFFF !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }

    .section_tw1 .content-wrapper {
        width: 100% !important;
        max-width: 1140px !important;
        margin: 0 auto !important;
        padding: 0 !important;
    }

    .section_tw1 p:first-child {
        font-size: 14.5px !important;
        margin-bottom: 8px !important;
    }

    .section_tw1 .m-fs-32,
    .section_tw1 div[style*="JetBrains Mono"] {
        font-size: 42px !important;
        line-height: 1.2 !important;
        font-weight: 700 !important;
        color: #222274 !important;
        margin-top: 6px !important;
        margin-bottom: 16px !important;
    }

    .section_tw1 p[style*="max-width: 90%"],
    .section_tw1 p:last-child,
    .section_tw1 p:nth-of-type(3) {
        font-size: 17px !important;
        max-width: 100% !important;
        width: 100% !important;
        line-height: 1.65 !important;
        color: #333333 !important;
    }

    /* Tab Buttons Nav (section_tw2) - Clean White background, 3-Column Equal Grid */
    .section_tw2,
    section.section_tw2:not(:has(#faq-container)) {
        min-height: auto !important;
        padding: 1rem 6% 2.5rem 6% !important;
        margin-top: 0 !important;
        margin-bottom: 0 !important;
        background-color: #FFFFFF !important;
        color: #222274 !important;
        width: 100% !important;
        box-sizing: border-box !important;
        position: relative !important;
        z-index: 10 !important;
    }

    .section_tw2 .workshop-tabs-wrapper {
        display: grid !important;
        grid-template-columns: repeat(3, 1fr) !important;
        gap: 20px !important;
        align-items: stretch !important;
        justify-content: space-between !important;
        width: 100% !important;
        max-width: 1140px !important;
        margin: 0 auto !important;
        padding: 0 !important;
        box-sizing: border-box !important;
    }

    /* Tab Button Base (Laptop: 1024px-1279px) */
    .section_tw2 button.btn-with-icon,
    .section_tw2 .btn-with-icon,
    .section_tw2 .btn-eb {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 100% !important;
        min-height: 52px !important;
        padding: 12px 18px !important;
        font-size: 14.5px !important;
        font-weight: 600 !important;
        font-family: 'Inter', sans-serif !important;
        border-radius: 10px !important;
        border: 1.5px solid #222274 !important;
        background-color: #ffffff !important;
        color: #222274 !important;
        cursor: pointer !important;
        transition: all 0.25s ease !important;
        box-shadow: 0 2px 8px rgba(34, 34, 116, 0.06) !important;
        outline: none !important;
        box-sizing: border-box !important;
        text-align: center !important;
    }

    /* Active Tab Button */
    .section_tw2 button.btn-with-icon.active,
    .section_tw2 .btn-with-icon.active {
        background-color: #222274 !important;
        color: #ffffff !important;
        border: 1.5px solid #222274 !important;
        box-shadow: 0 4px 14px rgba(34, 34, 116, 0.22) !important;
    }

    .section_tw2 button.btn-with-icon.active img,
    .section_tw2 .btn-with-icon.active img,
    .section_tw2 .btn-with-icon.active .tab-icon {
        filter: brightness(0) invert(1) !important;
    }

    /* Hover Tab Button */
    .section_tw2 button.btn-with-icon:hover,
    .section_tw2 .btn-with-icon:hover,
    .section_tw2 .btn-eb:hover {
        background-color: #222274 !important;
        color: #ffffff !important;
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(34, 34, 116, 0.18) !important;
    }

    .section_tw2 button.btn-with-icon:hover img,
    .section_tw2 .btn-with-icon:hover img,
    .section_tw2 .btn-with-icon:hover .tab-icon {
        filter: brightness(0) invert(1) !important;
    }

    .section_tw2 .btn-with-icon .icon-text {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 10px !important;
        width: 100% !important;
        pointer-events: none !important;
    }

    .section_tw2 .btn-with-icon img,
    .section_tw2 .btn-with-icon .tab-icon {
        width: 20px !important;
        height: 20px !important;
        object-fit: contain !important;
        flex-shrink: 0 !important;
        transition: filter 0.25s ease !important;
    }

    /* Workshop Card Container & Rows (section_tw3) */
    .section_tw3 {
        min-height: auto !important;
        padding: 3.5rem 6% 5.5rem 6% !important;
        background-color: #FFFFFF !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }

    .section_tw3 .content-wrapper {
        width: 100% !important;
        max-width: 1140px !important;
        margin: 0 auto !important;
        padding: 0 !important;
    }

    .workshop-items-wrapper {
        display: flex !important;
        flex-direction: column !important;
        gap: 50px !important;
        width: 100% !important;
    }

    .workshop-card-row {
        display: flex !important;
        flex-direction: row !important;
        justify-content: space-between !important;
        align-items: flex-start !important;
        gap: 40px !important;
        background: #ffffff !important;
        padding: 36px 40px !important;
        border-radius: 16px !important;
        box-shadow: 0 6px 24px rgba(34, 34, 116, 0.08) !important;
        border: 1px solid #E2E8F0 !important;
        box-sizing: border-box !important;
    }

    .workshop-card-img-wrapper {
        flex: 1 1 45% !important;
        max-width: 45% !important;
        width: 100% !important;
    }

    .workshop-card-img {
        max-height: 400px !important;
        width: 100% !important;
        object-fit: cover !important;
        border-radius: 12px !important;
    }

    .workshop-card-content {
        flex: 1 1 55% !important;
        max-width: 55% !important;
        display: flex !important;
        flex-direction: column !important;
        gap: 18px !important;
        width: 100% !important;
    }

    .workshop-card-title {
        font-size: 34px !important;
        line-height: 1.25 !important;
        color: #222274 !important;
        margin: 0 !important;
    }

    .workshop-card-desc {
        font-size: 16px !important;
        line-height: 1.65 !important;
        color: #4b5563 !important;
        margin: 0 !important;
    }

    .workshop-card-info {
        display: flex !important;
        flex-direction: column !important;
        gap: 12px !important;
        margin-top: 10px !important;
        background: #f9fafb !important;
        padding: 20px 24px !important;
        border-radius: 10px !important;
        border-left: 4px solid #f39c12 !important;
    }

    .workshop-card-buttons {
        display: flex !important;
        flex-wrap: wrap !important;
        gap: 14px !important;
        margin-top: 18px !important;
    }

    /* Workshop Section Common Questions (FAQ at bottom of workshop) */
    .section_tw2:has(#faq-container) {
        background-color: #FFFFFF !important;
        padding: 4rem 6% 5rem 6% !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }

    .section_tw2:has(#faq-container) > p,
    .section_tw2 p[style*="margin-left: 15%"] {
        margin: 0 auto 24px auto !important;
        max-width: 1140px !important;
        width: 100% !important;
        font-size: 34px !important;
        font-family: 'JetBrains Mono', monospace !important;
        font-weight: 700 !important;
        color: #222274 !important;
        text-align: left !important;
    }

    .section_tw2:has(#faq-container) > .content-wrapper,
    .section_tw2 .content-wrapper[style*="max-width: 80%"],
    .section_tw2 .content-wrapper:has(#faq-container) {
        display: flex !important;
        flex-direction: column !important;
        grid-template-columns: none !important;
        background-color: #ffffff !important;
        width: 100% !important;
        max-width: 1140px !important;
        margin: 0 auto !important;
        padding: 32px 36px !important;
        border-radius: 14px !important;
        box-shadow: 0 4px 20px rgba(34, 34, 116, 0.06) !important;
        box-sizing: border-box !important;
    }

    .section_tw2 #faq-container,
    #faq-container {
        margin: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
        display: flex !important;
        flex-direction: column !important;
    }

    .section_tw2 .info-dropdown {
        border-bottom: 1px solid #E2E8F0 !important;
        width: 100% !important;
        margin: 0 !important;
    }

    .section_tw2 .dropdown-toggle {
        display: flex !important;
        justify-content: space-between !important;
        align-items: center !important;
        width: 100% !important;
        padding: 20px 0 !important;
        background: transparent !important;
        border: none !important;
        cursor: pointer !important;
        text-align: left !important;
        box-sizing: border-box !important;
    }

    .section_tw2 .dropdown-toggle span {
        font-size: 19px !important;
        font-weight: 600 !important;
        color: #5468B6 !important;
    }

    .section_tw2 .dropdown-content p {
        font-size: 15.5px !important;
        line-height: 1.6 !important;
        color: #4B5563 !important;
    }

    .workshop-grid,
    .past-events-grid,
    .padmatalks-grid {
        display: grid !important;
        grid-template-columns: repeat(3, 1fr) !important;
        gap: 24px !important;
    }

    .workshop-card,
    .event-card {
        height: 100% !important;
    }

    .event-card img {
        height: 210px !important;
    }

    /* ==========================================================================
       7. PENSIONLAB® & SIMULATION
       ========================================================================== */
    /* 7.1 PensionLab Hero Header & Overview (Laptop) */
    .section_about1.pensionlab-hero-section,
    .section_about1:has(.pensionlab-title-pension),
    .section_about1:has(.pensionlab-title-row) {
        min-height: auto !important;
        padding: 4.5rem 6% 1.5rem 6% !important;
        background-color: #FFFFFF !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }

    .section_about1.pensionlab-hero-section .content-wrapper,
    .section_about1:has(.pensionlab-title-pension) .content-wrapper,
    .section_about1:has(.pensionlab-title-row) .content-wrapper {
        width: 100% !important;
        max-width: 1140px !important;
        margin: 0 auto !important;
        padding: 0 !important;
    }

    .pensionlab-breadcrumb,
    .section_about1.pensionlab-hero-section .pensionlab-breadcrumb {
        margin-left: 0 !important;
        margin-right: 0 !important;
        margin-top: 0 !important;
        margin-bottom: 14px !important;
        font-size: 14.5px !important;
        text-align: left !important;
        color: #00A4FF !important;
    }

    .pensionlab-title-row,
    .section_about1.pensionlab-hero-section .pensionlab-title-row {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        justify-content: flex-start !important;
        margin: 10px 0 18px 0 !important;
    }

    .pensionlab-hero-logo,
    .pensionlab-title-row img {
        max-width: 300px !important;
        width: 100% !important;
        height: auto !important;
        object-fit: contain !important;
        display: block !important;
    }

    .pensionlab-desc,
    .section_about1.pensionlab-hero-section .pensionlab-desc,
    .section_about1.pensionlab-hero-section p[style*="max-width"] {
        margin-left: 0 !important;
        margin-right: 0 !important;
        margin-top: 0 !important;
        font-size: 16.5px !important;
        line-height: 1.7 !important;
        max-width: 100% !important;
        width: 100% !important;
        color: #333333 !important;
        text-align: justify !important;
    }

    .section_pensilab2 {
        padding: 1.5rem 6% 4rem 6% !important;
    }

    .section_pensilab2 .content-wrapper,
    .section_pensilab2 .content-wrapper[style*="max-width: 80%"] {
        max-width: 1140px !important;
        width: 100% !important;
        margin: 0 auto !important;
    }

    .pensionlab-container {
        padding: 2.5rem 3% !important;
        max-width: 1140px !important;
        margin: 0 auto !important;
    }

    .sim-grid {
        display: flex !important;
        flex-direction: column !important;
        gap: 24px !important;
    }

    .sim-card:has(.sim-action-bar),
    .sim-card:has(#btn-simulasi) {
        padding: 0 !important;
        overflow: hidden !important;
    }

    .sim-action-bar {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        justify-content: space-between !important;
        flex-wrap: nowrap !important;
        padding: 22px 26px !important;
        background-color: #EFF6FF !important;
        border-radius: 12px !important;
        gap: 20px !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }

    .sim-action-text {
        flex: 1 1 auto !important;
        width: auto !important;
        max-width: none !important;
    }

    .sim-action-text p {
        margin: 0 !important;
        font-size: 13.5px !important;
        line-height: 1.55 !important;
        color: #27397F !important;
        text-align: left !important;
    }

    .sim-action-buttons {
        flex: 0 0 auto !important;
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        justify-content: flex-end !important;
        gap: 12px !important;
        width: auto !important;
        margin-left: auto !important;
    }

    #btn-reset-pesangon,
    #btn-reset-pajak,
    #btn-reset-alokasi,
    #btn-reset-pensiun {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        padding: 12px 24px !important;
        font-size: 15px !important;
        font-weight: 700 !important;
        border-radius: 8px !important;
        white-space: nowrap !important;
        min-width: 80px !important;
        text-align: center !important;
        cursor: pointer !important;
    }

    #btn-simulasi,
    #btn-simulasikan-pajak,
    #btn-simulasi-alokasi,
    #btn-simulasi-pensiun {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        padding: 12px 34px !important;
        font-size: 16px !important;
        font-weight: 700 !important;
        border-radius: 8px !important;
        white-space: nowrap !important;
        text-align: center !important;
        cursor: pointer !important;
    }

    .section_about1 p:first-child {
        font-size: 14.5px !important;
    }

    .section_about1 .m-fs-32 {
        font-size: 42px !important;
        line-height: 1.2 !important;
        font-weight: 700 !important;
        color: #222274 !important;
        margin-top: 8px !important;
        margin-bottom: 16px !important;
    }

    .section_about1 p[style*="max-width: 90%"] {
        font-size: 17.5px !important;
        max-width: 880px !important;
        line-height: 1.65 !important;
        color: #333333 !important;
    }

    /* 9.2 Core Vision, Mission & Values (3-Column Layout) */
    .section_about2 {
        min-height: auto !important;
        padding: 3rem 6% 4.5rem 6% !important;
        background-color: #FFFFFF !important;
    }

    .section_about2 .content-wrapper,
    .section_about2 .about-grid {
        display: flex !important;
        flex-direction: row !important;
        justify-content: space-between !important;
        align-items: flex-start !important;
        max-width: 1140px !important;
        margin: 0 auto !important;
        width: 100% !important;
        gap: 30px !important;
    }

    .section_about2 .about-col {
        flex: 1 1 31% !important;
        max-width: 31% !important;
        display: flex !important;
        flex-direction: column !important;
    }

    .section_about2 .about-col p[style*="font-size: 24px"] {
        font-size: 23px !important;
        font-weight: 700 !important;
        color: #222274 !important;
        margin-bottom: 14px !important;
    }

    .section_about2 .about-col p[style*="font-size: 20px"] {
        font-size: 18px !important;
        font-weight: 700 !important;
        margin-top: 10px !important;
        margin-bottom: 5px !important;
    }

    .section_about2 .about-col p:not([style*="font-weight: bold"]):not([style*="font-size: 24px"]):not([style*="font-size: 20px"]) {
        font-size: 14.5px !important;
        line-height: 1.6 !important;
        color: #444444 !important;
    }

    .section_about2 .about-img-col {
        flex: 1 1 34% !important;
        max-width: 34% !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }

    .section_about2 .about-img-col img {
        width: 100% !important;
        max-height: 390px !important;
        object-fit: contain !important;
        border-radius: 14px !important;
    }

    /* 9.3 Our Journey Timeline Section (Perjalanan Kami) */
    .section_about3 {
        min-height: auto !important;
        padding: 4.5rem 6% 5.5rem 6% !important;
        background-color: #F9F9F9 !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }

    .timeline-header {
        max-width: 1140px !important;
        margin: 0 auto 2.5rem auto !important;
        display: flex !important;
        flex-direction: row !important;
        justify-content: space-between !important;
        align-items: flex-end !important;
        gap: 24px !important;
    }

    .timeline-header > div:first-child {
        flex: 1 1 auto !important;
        max-width: 75% !important;
    }

    .timeline-label {
        font-size: 14px !important;
        font-weight: 600 !important;
        color: #00A4FF !important;
        text-transform: uppercase !important;
        letter-spacing: 1.5px !important;
        margin-bottom: 6px !important;
    }

    .timeline-title {
        font-size: 36px !important;
        font-weight: 700 !important;
        color: #222274 !important;
        line-height: 1.25 !important;
        margin: 0 0 10px 0 !important;
    }

    .timeline-subtitle {
        font-size: 16px !important;
        color: #666666 !important;
        max-width: 680px !important;
        line-height: 1.6 !important;
        margin: 0 !important;
    }

    .timeline-header > div:last-child {
        display: flex !important;
        align-items: center !important;
        gap: 12px !important;
        flex-shrink: 0 !important;
        margin-top: 0 !important;
        margin-bottom: 0 !important;
    }

    .timeline-header button#timelinePrev,
    .timeline-header button#timelineNext {
        width: 46px !important;
        height: 46px !important;
        border-radius: 50% !important;
        cursor: pointer !important;
        flex-shrink: 0 !important;
    }

    .timeline-outer {
        max-width: 1140px !important;
        width: 100% !important;
        margin: 0 auto !important;
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch !important;
        padding: 1.5rem 0 2rem 0 !important;
        cursor: grab !important;
    }

    .timeline-track-wrapper {
        padding: 1% 1% !important;
        min-width: max-content !important;
    }

    .timeline-track {
        display: flex !important;
        align-items: stretch !important;
        gap: 24px !important;
    }

    .timeline-item {
        width: 255px !important;
        flex-shrink: 0 !important;
        display: flex !important;
        flex-direction: column !important;
    }

    .timeline-card {
        width: 255px !important;
        min-height: 360px !important;
        height: 100% !important;
        border-radius: 16px !important;
        background: #ffffff !important;
        box-shadow: 0 6px 22px rgba(34, 34, 116, 0.09) !important;
        border: 1.5px solid #e0e7ff !important;
        overflow: hidden !important;
        display: flex !important;
        flex-direction: column !important;
        box-sizing: border-box !important;
    }

    .timeline-card-img {
        width: 100% !important;
        height: 170px !important;
        overflow: hidden !important;
        flex-shrink: 0 !important;
    }

    .timeline-card-img img {
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
    }

    .timeline-card-body {
        padding: 16px 18px !important;
        flex: 1 1 auto !important;
        display: flex !important;
        flex-direction: column !important;
        position: relative !important;
    }

    .timeline-card-year {
        font-size: 30px !important;
        font-weight: 800 !important;
        color: #27397F !important;
        line-height: 1.1 !important;
        margin-bottom: 8px !important;
        display: inline-block !important;
    }

    .timeline-card-title {
        font-size: 15px !important;
        font-weight: 700 !important;
        color: #222274 !important;
        line-height: 1.35 !important;
        margin-bottom: 6px !important;
        position: static !important;
        background: transparent !important;
        padding: 0 !important;
    }

    .timeline-card-desc {
        font-size: 13px !important;
        line-height: 1.6 !important;
        color: #555555 !important;
        display: -webkit-box !important;
        -webkit-line-clamp: 5 !important;
        -webkit-box-orient: vertical !important;
        overflow: hidden !important;
        margin: 0 !important;
    }

    .vision-mission-grid {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 28px !important;
    }

    .team-grid,
    .tim-container .grid {
        display: grid !important;
        grid-template-columns: repeat(3, 1fr) !important;
        gap: 24px !important;
    }

    /* ==========================================================================
       10. CONTACT US & FAQ
       ========================================================================== */
    .contact-page-wrapper {
        max-width: 1140px !important;
        margin: 0 auto !important;
    }

    .faq-accordion-item {
        padding: 20px 24px !important;
    }

    /* ==========================================================================
       11. FOOTER (LAPTOP ADAPTATION)
       ========================================================================== */
    .footer-section {
        padding: 70px 48px 36px 48px !important;
    }

    .footer-container {
        max-width: 1140px !important;
        display: grid !important;
        grid-template-columns: 1.1fr 1.8fr 1.3fr !important;
        gap: 40px !important;
        align-items: start !important;
    }

    .footer-logo {
        width: 135px !important;
        margin-bottom: 24px !important;
    }

    .footer-company-name {
        font-size: 22px !important;
        margin-bottom: 15px !important;
    }

    .footer-links-grid {
        gap: 20px 36px !important;
    }

    /* ==========================================================================
       12. MODALS & NOTIFICATIONS
       ========================================================================== */
    .contact-modal-container {
        max-width: 680px !important;
        width: 85% !important;
    }

    /* Social Media Icons (16px) */
    .business-social-row img,
    .contact-info-grid img[src*="assets/ig.png"],
    .contact-info-grid img[src*="assets/yt.png"],
    .contact-info-grid img[src*="assets/linkedin.png"],
    a[href*="instagram"] img,
    a[href*="youtube"] img,
    a[href*="linkedin"] img,
    .social-icon,
    .social-media-icon {
        width: 16px !important;
        height: 16px !important;
        max-width: 16px !important;
        max-height: 16px !important;
        object-fit: contain !important;
    }

    .social-links i,
    .social-icons i,
    a[href*="instagram"] i,
    a[href*="youtube"] i,
    a[href*="linkedin"] i {
        font-size: 16px !important;
    }

    /* ==========================================================================
       13. CONTACT & SUBSCRIBE BOTTOM BANNER (.contact-section-improved)
       ========================================================================== */
    .contact-section-improved,
    .section_artikel3 .contact-section-improved,
    .section_tw4 .contact-section-improved,
    #section-contact .contact-section-improved {
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
        padding: 38px 6% !important;
        background-color: #09FFB8 !important;
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        justify-content: space-between !important;
        gap: 28px !important;
        box-sizing: border-box !important;
    }

    .section_artikel3,
    .section_tw4,
    .section_eb6,
    #section-contact.section_tw4,
    #section-contact.section_eb6 {
        width: 100% !important;
        max-width: 100% !important;
        background-color: #FFFFFF !important;
        box-sizing: border-box !important;
    }

    .section_artikel3 {
        padding-left: 0 !important;
        padding-right: 0 !important;
        padding-bottom: 0 !important;
    }

    .contact-section-improved .contact-content {
        flex: 1 1 auto !important;
        max-width: 68% !important;
        display: flex !important;
        flex-direction: column !important;
        gap: 10px !important;
        text-align: left !important;
    }

    .contact-section-improved .contact-text {
        font-size: 22px !important;
        line-height: 1.4 !important;
        color: #222274 !important;
        margin: 0 !important;
        font-family: 'Inter', sans-serif !important;
        text-align: left !important;
    }

    .contact-section-improved .contact-text strong {
        font-weight: 700 !important;
    }

    .contact-section-improved .contact-buttons {
        flex: 0 0 auto !important;
        display: flex !important;
        gap: 12px !important;
        align-items: center !important;
    }

    .contact-section-improved .btn-contact-improved {
        padding: 13px 32px !important;
        font-size: 15.5px !important;
        font-weight: 600 !important;
        border-radius: 8px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 10px !important;
        white-space: nowrap !important;
        cursor: pointer !important;
        width: auto !important;
    }

    /* ==========================================================================
       WHY PADMA (ME PAGE) VALUE CARDS ALIGNMENT
       ========================================================================== */
    .value-card {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: flex-start !important;
        height: 100% !important;
        min-height: 380px !important;
        padding: 24px 18px 28px 18px !important;
        border-radius: 16px !important;
        box-sizing: border-box !important;
    }

    .value-card .w-36 {
        width: 105px !important;
        height: 105px !important;
        margin: 0 auto 14px auto !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        flex-shrink: 0 !important;
    }

    .value-card .w-36 img {
        max-height: 100% !important;
        max-width: 100% !important;
        object-fit: contain !important;
    }

    .value-card .card-title,
    .value-card h3 {
        font-size: 18px !important;
        font-weight: 700 !important;
        line-height: 1.25 !important;
        min-height: 48px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        text-align: center !important;
        margin-bottom: 10px !important;
        width: 100% !important;
        flex-shrink: 0 !important;
    }

    .value-card .card-desc,
    .value-card p.card-desc {
        font-size: 13.5px !important;
        line-height: 1.5 !important;
        min-height: 64px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        text-align: center !important;
        padding: 0 4px !important;
        width: 100% !important;
        flex-grow: 1 !important;
    }

    .value-card .card-chevron {
        margin-top: auto !important;
        padding-top: 18px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        font-size: 18px !important;
        flex-shrink: 0 !important;
    }
}
