/* =========================================================
   SAMSEL - RESPONSIVE DESIGN
   Desktop + Tablet + Mobile
   ========================================================= */

/* Prevent horizontal overflow */
html,
body {
    max-width: 100%;
    overflow-x: hidden;
}

* {
    box-sizing: border-box;
}

/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 992px) {

    .main-content {
        margin-left: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
        padding: 20px !important;
    }

    .sidebar {
        transform: translateX(-100%);
        z-index: 3000;
    }

    .sidebar.mobile-active {
        transform: translateX(0);
    }

    .header-section {
        width: 100%;
        max-width: 100%;
        flex-wrap: wrap;
        gap: 15px;
    }

    .welcome-text {
        min-width: 0;
    }

    .action-header {
        flex-wrap: wrap;
    }

    .premium-profile-card {
        flex-direction: column;
        padding: 25px;
        gap: 20px;
    }

    .profile-avatar-container {
        width: 100%;
        margin-top: 20px;
    }

    .profile-info-container {
        width: 100%;
        margin-top: 20px;
    }

    .info-grid {
        grid-template-columns: 1fr 1fr;
    }

    .ebook-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .announcement-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .table-container {
        width: 100%;
        max-width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .table-responsive {
        width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .premium-table {
        min-width: 650px;
    }

    .modal-content {
        width: calc(100% - 40px);
        max-width: 600px;
        max-height: 90vh;
        overflow-y: auto;
    }
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 576px) {

    body {
        font-size: 14px;
    }

    .main-content {
        padding: 15px !important;
        width: 100% !important;
        margin-left: 0 !important;
    }

    /* ---------- Sidebar ---------- */

    .sidebar {
        width: 280px !important;
        max-width: 85vw;
    }

    .sidebar-header {
        padding: 15px;
    }

    .brand-text {
        font-size: 17px;
    }

    .brand-secondary {
        font-size: 12px !important;
    }

    .menu-link {
        padding: 12px 15px;
    }

    /* ---------- Header ---------- */

    .header-section {
        flex-direction: column;
        align-items: stretch;
        gap: 15px;
        margin-bottom: 20px;
    }

    .welcome-text h1 {
        font-size: 24px !important;
        line-height: 1.25;
        word-break: break-word;
    }

    .welcome-text p {
        font-size: 13px;
        line-height: 1.5;
    }

    .action-header {
        width: 100%;
        justify-content: flex-start;
    }

    .action-header .btn {
        width: 100%;
    }

    /* ---------- Profile ---------- */

    .premium-profile-card {
        padding: 20px 15px;
        border-radius: 18px;
        gap: 15px;
    }

    .premium-profile-card::before {
        height: 100px;
    }

    .profile-avatar {
        width: 105px;
        height: 105px;
    }

    .profile-avatar-container {
        margin-top: 20px;
    }

    .profile-avatar-container h3 {
        font-size: 19px;
    }

    .profile-avatar-container p {
        font-size: 13px;
    }

    .profile-info-container {
        padding: 18px;
        border-radius: 14px;
        margin-top: 10px;
    }

    .info-grid {
        grid-template-columns: 1fr;
        gap: 15px;
    }

    .info-value {
        font-size: 14px;
        word-break: break-word;
    }

    /* ---------- Ebook cards ---------- */

    .ebook-grid {
        grid-template-columns: 1fr !important;
        gap: 15px;
    }

    .ebook-card,
    .ebook-card-premium {
        width: 100%;
        min-width: 0;
    }

    .ebook-details {
        min-width: 0;
    }

    .ebook-title {
        font-size: 16px;
        word-break: break-word;
    }

    /* ---------- Announcements ---------- */

    .announcement-grid {
        grid-template-columns: 1fr !important;
        gap: 15px;
    }

    .announcement-card {
        width: 100%;
        min-width: 0;
    }

    .announcement-title {
        word-break: break-word;
    }

    /* ---------- Tables ---------- */

    .table-container,
    .table-responsive {
        width: 100%;
        overflow-x: auto !important;
        display: block;
        border-radius: 10px;
    }

    .premium-table {
        min-width: 600px;
    }

    /* ---------- Forms ---------- */

    .form-group,
    .upload-form-group {
        width: 100%;
    }

    .form-input,
    select,
    textarea,
    input[type="text"],
    input[type="email"],
    input[type="number"],
    input[type="password"],
    input[type="file"] {
        width: 100%;
        max-width: 100%;
        font-size: 16px;
    }

    .form-actions {
        flex-direction: column;
        width: 100%;
    }

    .form-actions .btn {
        width: 100%;
    }

    /* ---------- Buttons ---------- */

    .btn {
        max-width: 100%;
        white-space: normal;
    }

    .btn-open-ebook,
    .btn-download-premium,
    .btn-submit-premium,
    .btn-file-select {
        width: 100%;
        max-width: 100%;
    }

    /* ---------- Modals ---------- */

    .modal-overlay {
        padding: 15px;
    }

    .modal-content {
        width: 100%;
        max-width: 100%;
        padding: 20px;
        border-radius: 18px;
        max-height: 90vh;
        overflow-y: auto;
    }

    .modal-header {
        margin-bottom: 18px;
    }

    .modal-header h2 {
        font-size: 18px;
    }

    /* ---------- Section headers ---------- */

    .section-header {
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
    }

    /* ---------- Cards ---------- */

    .dashboard-section {
        width: 100%;
        max-width: 100%;
    }

    /* ---------- Messages ---------- */

    .alert {
        align-items: flex-start;
        gap: 10px;
        padding: 12px 14px;
        font-size: 13px;
    }

    /* ---------- Search / controls ---------- */

    .custom-dropdown,
    .dropdown-header {
        width: 100%;
        max-width: 100%;
    }

    /* ---------- Super/Admin tables ---------- */

    .book-item {
        min-width: 500px;
    }

    /* ---------- Touch-friendly controls ---------- */

    button,
    .btn,
    .menu-link,
    input,
    select,
    textarea {
        min-height: 44px;
    }
}


/* =========================================================
   VERY SMALL PHONES
   ========================================================= */

@media (max-width: 380px) {

    .main-content {
        padding: 10px !important;
    }

    .welcome-text h1 {
        font-size: 21px !important;
    }

    .premium-profile-card {
        padding: 15px 10px;
    }

    .profile-info-container {
        padding: 14px;
    }

    .modal-content {
        padding: 15px;
    }

    .sidebar {
        width: 260px !important;
    }
}


/* =========================================================
   LANDSCAPE MOBILE
   ========================================================= */

@media (max-width: 767px) and (orientation: landscape) {

    .sidebar {
        overflow-y: auto;
    }

    .modal-content {
        max-height: 85vh;
    }
}


/* =========================================================
   SAMSEL PUBLIC HOME PAGE RESPONSIVE DESIGN
   ========================================================= */

/* ---------- HOME HEADER ---------- */

@media (max-width: 992px) {

    body.home-page .main-header {
        width: 100%;
    }

    body.home-page .main-header .header-container {
        width: 100%;
        max-width: 100%;
        padding: 15px 25px;
        gap: 15px;
    }

    body.home-page .main-header .header-action {
        gap: 10px !important;
        flex-wrap: wrap;
        justify-content: flex-end;
    }

    body.home-page .top-navbar {
        width: 100%;
    }

}


/* ---------- TABLET ---------- */

@media (max-width: 768px) {

    body.home-page .main-header .header-container {
        flex-direction: column;
        align-items: center;
        text-align: center;
        padding: 18px 20px;
    }

    body.home-page .main-header .header-action {
        width: 100%;
        justify-content: center;
    }

    body.home-page .main-header .header-action a {
        max-width: 220px;
    }

    /* Navbar */

    body.home-page .top-navbar {
        width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    body.home-page .top-menu {
        flex-wrap: wrap;
        justify-content: center;
        gap: 5px;
    }

    body.home-page .top-menu > li > a {
        white-space: nowrap;
    }


    /* Hero */

    body.home-page .hero-landing {
        min-height: auto;
        padding: 50px 20px 80px;
    }

    body.home-page .hero-inner {
        width: 100%;
        max-width: 100%;
        padding: 0 10px;
    }

    body.home-page .hero-eyebrow {
        font-size: 0.72rem;
        letter-spacing: 2px;
        padding: 7px 15px;
        margin-bottom: 1.5rem;
    }

    body.home-page .hero-headline {
        font-size: clamp(2.3rem, 9vw, 4rem);
        line-height: 1.1;
        margin-bottom: 1.2rem;
    }

    body.home-page .hero-para {
        font-size: 1rem;
        line-height: 1.65;
        margin-bottom: 2rem;
    }

    body.home-page .hero-cta-row {
        width: 100%;
        gap: 12px;
    }

    body.home-page .hero-cta-row .btn-hero-primary,
    body.home-page .hero-cta-row .btn-hero-outline {
        font-size: 1rem;
        padding: 15px 25px;
        width: auto;
        min-width: 180px;
        justify-content: center;
    }


    /* Hero pillars */

    body.home-page .hero-landing .sl-pillars {
        width: 100%;
        max-width: 100%;
        padding: 1rem 0;
        margin-top: 2rem;
        margin-bottom: 2rem;
        grid-template-columns: 1fr;
        gap: 15px;
    }

    body.home-page .hero-landing .sl-pillar {
        padding: 1.5rem;
        border-radius: 16px;
    }

    body.home-page .hero-landing .sl-pillar h3 {
        font-size: 1.1rem;
    }

    body.home-page .hero-landing .sl-pillar p {
        font-size: 0.9rem;
        line-height: 1.6;
    }


    /* Stats */

    body.home-page .stats-grid {
        grid-template-columns: 1fr 1fr;
        gap: 1.5rem;
    }

}


/* ---------- MOBILE ---------- */

@media (max-width: 576px) {

    body.home-page {
        width: 100%;
        overflow-x: hidden;
    }


    /* Header */

    body.home-page .main-header .header-container {
        padding: 15px;
    }

    body.home-page .logo-main {
        font-size: 28px;
    }

    body.home-page .logo-sub {
        font-size: 14px;
    }

    body.home-page .logo-tagline {
        font-size: 10px;
    }

    body.home-page .main-header .header-action {
        flex-direction: column;
        align-items: stretch;
        width: 100%;
        gap: 8px !important;
    }

    body.home-page .main-header .header-action a {
        width: 100%;
        max-width: 100%;
        justify-content: center;
        text-align: center;
    }


    /* Navbar */

    body.home-page .top-navbar {
        overflow-x: auto;
        white-space: nowrap;
    }

    body.home-page .top-menu {
        display: flex;
        flex-wrap: nowrap;
        justify-content: flex-start;
        width: max-content;
        min-width: 100%;
        padding: 0 10px;
    }

    body.home-page .top-menu > li > a {
        padding: 12px 10px;
        font-size: 14px;
    }


    /* Hero */

    body.home-page .hero-landing {
        padding: 45px 15px 70px;
        min-height: auto;
    }

    body.home-page .hero-inner {
        padding: 0;
    }

    body.home-page .hero-eyebrow {
        font-size: 0.65rem;
        letter-spacing: 1.5px;
        padding: 7px 12px;
        margin-bottom: 1.3rem;
    }

    body.home-page .hero-headline {
        font-size: clamp(2.1rem, 12vw, 3.2rem);
        line-height: 1.08;
    }

    body.home-page .hero-para {
        font-size: 0.92rem;
        line-height: 1.65;
        margin-bottom: 1.8rem;
    }

    body.home-page .hero-cta-row {
        flex-direction: column;
        align-items: stretch;
        width: 100%;
    }

    body.home-page .hero-cta-row .btn-hero-primary,
    body.home-page .hero-cta-row .btn-hero-outline {
        width: 100%;
        min-width: 0;
        padding: 14px 20px;
        font-size: 0.95rem;
    }


    /* Badges */

    body.home-page .hero-badges {
        margin-top: 2rem;
        gap: 8px;
    }

    body.home-page .hero-badge {
        font-size: 0.75rem;
        padding: 8px 12px;
    }


    /* Pillars */

    body.home-page .hero-landing .sl-pillars {
        padding: 0;
        gap: 12px;
    }

    body.home-page .hero-landing .sl-pillar {
        padding: 1.3rem;
        border-radius: 14px;
    }

    body.home-page .hero-landing .sl-pillar-icon {
        font-size: 1.5rem;
        margin-bottom: 0.8rem;
    }


    /* Stats */

    body.home-page .stats-grid {
        grid-template-columns: 1fr;
        gap: 1rem;
        margin: 2rem 0;
    }


    /* Scroll indicator */

    body.home-page .hero-scroll-cue {
        display: none;
    }

}


/* ---------- VERY SMALL PHONES ---------- */

@media (max-width: 380px) {

    body.home-page .hero-landing {
        padding-left: 10px;
        padding-right: 10px;
    }

    body.home-page .hero-headline {
        font-size: 2rem;
    }

    body.home-page .hero-para {
        font-size: 0.88rem;
    }

    body.home-page .hero-landing .sl-pillar {
        padding: 1.1rem;
    }

}


/* ---------- LANDSCAPE MOBILE ---------- */

@media (max-width: 767px) and (orientation: landscape) {

    body.home-page .hero-landing {
        padding-top: 30px;
        padding-bottom: 50px;
    }

    body.home-page .hero-headline {
        font-size: 2.5rem;
    }

    body.home-page .hero-badges {
        margin-top: 1.5rem;
    }

}


/* =========================================================
   FIX: SAMSEL HOME HERO MOBILE WIDTH
   ========================================================= */

@media (max-width: 767px) {

    body.home-page .hero-landing {
        width: 100%;
        box-sizing: border-box;
        padding-left: 15px;
        padding-right: 15px;
        overflow-x: hidden;
    }

    body.home-page .hero-inner {
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
        padding-left: 10px;
        padding-right: 10px;
        margin: 0 auto;
    }

    body.home-page .hero-headline {
        width: 100%;
        font-size: clamp(2.2rem, 11vw, 3.2rem);
        line-height: 1.08;
        word-break: normal;
    }

    body.home-page .hero-para {
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
        text-align: center !important;
        font-size: 0.92rem;
        line-height: 1.6;
    }

    body.home-page .hero-cta-row {
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
    }

    body.home-page .hero-cta-row .btn-hero-primary,
    body.home-page .hero-cta-row .btn-hero-outline {
        box-sizing: border-box;
        width: 100%;
        max-width: 340px;
    }

    body.home-page .hero-badges {
        width: 100%;
        box-sizing: border-box;
    }

    body.home-page .hero-landing .sl-pillars {
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
        padding-left: 5px;
        padding-right: 5px;
    }
}

/* Very small phones */
@media (max-width: 380px) {

    body.home-page .hero-inner {
        padding-left: 5px;
        padding-right: 5px;
    }

    body.home-page .hero-headline {
        font-size: 2rem;
    }
}

cat >> static/css/responsive.css <<'EOF'

/* =========================================================
   SAMSEL HOME PAGE - FINAL RESPONSIVE FIX
   Desktop + Tablet + Mobile
   ========================================================= */

/* ---------- DESKTOP ---------- */

body.home-page .hero-landing {
    width: 100%;
    box-sizing: border-box;
}

body.home-page .hero-inner {
    width: 100%;
    max-width: 900px;
    box-sizing: border-box;
}

body.home-page .hero-para {
    width: 100%;
    box-sizing: border-box;
}

body.home-page .sl-pillars {
    width: 100%;
    box-sizing: border-box;
}


/* ---------- TABLET ---------- */

@media (max-width: 1024px) {

    body.home-page .main-header .header-container {
        padding-left: 20px;
        padding-right: 20px;
    }

    body.home-page .hero-landing {
        padding-top: 50px;
        padding-left: 20px;
        padding-right: 20px;
    }

    body.home-page .hero-inner {
        max-width: 850px;
        padding-left: 1rem;
        padding-right: 1rem;
    }

    body.home-page .hero-headline {
        font-size: clamp(3rem, 7vw, 4.5rem);
    }

    body.home-page .hero-para {
        font-size: 1.05rem;
    }

    body.home-page .sl-pillars {
        width: 100%;
        max-width: 100%;
        padding: 1.5rem;
    }
}


/* ---------- MOBILE ---------- */

@media (max-width: 767px) {

    /* Header */

    body.home-page .main-header {
        position: relative;
        width: 100%;
    }

    body.home-page .main-header .header-container {
        width: 100%;
        padding: 12px 15px;
        box-sizing: border-box;
        flex-direction: column;
        align-items: center;
    }

    body.home-page .logo {
        width: 100%;
        text-align: center;
    }

    body.home-page .header-action {
        width: 100%;
        display: flex !important;
        flex-direction: column;
        gap: 8px !important;
    }

    body.home-page .header-action a {
        width: 100%;
        box-sizing: border-box;
        text-align: center;
    }


    /* Navbar */

    body.home-page .top-navbar {
        position: relative;
        width: 100%;
        top: 0 !important;
        overflow-x: auto;
        overflow-y: visible;
        -webkit-overflow-scrolling: touch;
    }

    body.home-page .top-menu {
        width: max-content;
        min-width: 100%;
        display: flex;
        flex-wrap: nowrap;
        justify-content: flex-start;
    }

    body.home-page .top-menu > li > a {
        white-space: nowrap;
        padding: 12px 10px;
        font-size: 14px;
    }


    /* Hero */

    body.home-page .hero-landing {
        width: 100%;
        min-height: auto;
        padding: 45px 15px 60px;
        box-sizing: border-box;
    }

    body.home-page .hero-inner {
        width: 100%;
        max-width: 100%;
        padding: 0;
        box-sizing: border-box;
    }

    body.home-page .hero-headline {
        font-size: clamp(2.2rem, 11vw, 3.5rem);
        line-height: 1.08;
        word-break: normal;
    }

    body.home-page .hero-para {
        width: 100%;
        max-width: 100%;
        font-size: 0.95rem;
        line-height: 1.65;
        margin-bottom: 2rem;
        text-align: left !important;
    }


    /* Buttons */

    body.home-page .hero-cta-row {
        width: 100%;
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 12px;
    }

    body.home-page .hero-cta-row a {
        width: 100%;
        box-sizing: border-box;
        justify-content: center;
        text-align: center;
    }

    body.home-page .hero-cta-row .btn-hero-primary,
    body.home-page .hero-cta-row .btn-hero-outline {
        width: 100%;
        min-width: 0;
        padding: 15px 20px;
        font-size: 1rem;
    }


    /* Badges */

    body.home-page .hero-badges {
        width: 100%;
        margin-top: 2rem;
        gap: 8px;
    }

    body.home-page .hero-badge {
        font-size: 0.75rem;
        padding: 8px 12px;
    }


    /* Pillars */

    body.home-page .hero-landing .sl-pillars {
        width: 100%;
        max-width: 100%;
        padding: 0;
        margin-top: 2rem;
        margin-bottom: 1rem;
        grid-template-columns: 1fr;
        gap: 12px;
    }

    body.home-page .hero-landing .sl-pillar {
        width: 100%;
        box-sizing: border-box;
        padding: 1.3rem;
        border-radius: 14px;
    }


    /* Hide scroll indicator on mobile */

    body.home-page .hero-scroll-cue {
        display: none;
    }
}


/* ---------- SMALL PHONES ---------- */

@media (max-width: 480px) {

    body.home-page .hero-landing {
        padding-left: 12px;
        padding-right: 12px;
    }

    body.home-page .hero-headline {
        font-size: 2.15rem;
    }

    body.home-page .hero-para {
        font-size: 0.9rem;
    }

    body.home-page .hero-landing .sl-pillar {
        padding: 1.1rem;
    }
}


/* ---------- VERY SMALL PHONES ---------- */

@media (max-width: 380px) {

    body.home-page .hero-headline {
        font-size: 1.95rem;
    }

    body.home-page .hero-para {
        font-size: 0.86rem;
    }

    body.home-page .main-header .header-container {
        padding-left: 10px;
        padding-right: 10px;
    }
}


/* ---------- LANDSCAPE PHONES ---------- */

@media (max-width: 767px) and (orientation: landscape) {

    body.home-page .hero-landing {
        padding-top: 30px;
        padding-bottom: 50px;
    }

    body.home-page .hero-headline {
        font-size: 2.5rem;
    }

    body.home-page .hero-landing .sl-pillars {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* =========================================================
   FINAL MOBILE FIX - SAMSEL HOME PAGE
   Overrides fixed desktop header/navbar on mobile
   ========================================================= */

@media (max-width: 767px) {

    body.home-page {
        width: 100%;
        max-width: 100%;
        overflow-x: hidden;
        margin: 0;
        padding: 0;
    }

    /* HEADER */
    body.home-page .main-header {
        position: relative !important;
        top: auto !important;
        left: auto !important;
        right: auto !important;
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        margin: 0 !important;
        padding: 12px 0 !important;
        box-sizing: border-box;
        transform: none !important;
    }

    body.home-page .main-header .header-container {
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
        padding: 10px 15px !important;
        box-sizing: border-box;

        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 12px !important;
    }

    /* LOGO */
    body.home-page .logo {
        width: 100% !important;
        display: flex !important;
        justify-content: center !important;
        text-align: center !important;
    }

    body.home-page .logo a {
        align-items: center !important;
    }

    body.home-page .logo-text-group {
        justify-content: center !important;
        gap: 7px !important;
        flex-wrap: nowrap !important;
    }

    body.home-page .logo-main {
        font-size: 30px !important;
    }

    body.home-page .logo-sub {
        font-size: 16px !important;
    }

    body.home-page .logo-tagline {
        font-size: 10px !important;
        text-align: center !important;
    }

    /* HEADER BUTTONS */
    body.home-page .main-header .header-action {
        width: 100% !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        justify-content: center !important;
        gap: 8px !important;
        box-sizing: border-box;
    }

    body.home-page .main-header .header-action a {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box;
        justify-content: center !important;
        text-align: center !important;
        white-space: nowrap;
    }

    /* NAVBAR */
    body.home-page .top-navbar {
        position: relative !important;
        top: auto !important;
        left: auto !important;
        right: auto !important;
        width: 100% !important;
        height: auto !important;
        margin: 0 !important;
        overflow-x: auto !important;
        overflow-y: visible !important;
        white-space: nowrap;
        box-sizing: border-box;
        -webkit-overflow-scrolling: touch;
    }

    body.home-page .top-menu {
        display: flex !important;
        flex-wrap: nowrap !important;
        justify-content: flex-start !important;
        width: max-content !important;
        min-width: 100% !important;
        margin: 0 !important;
        padding: 0 8px !important;
        box-sizing: border-box;
    }

    body.home-page .top-menu > li {
        flex: 0 0 auto;
    }

    body.home-page .top-menu > li > a {
        white-space: nowrap !important;
        padding: 12px 10px !important;
        font-size: 14px !important;
    }

    /* HERO */
    body.home-page .hero-landing {
        width: 100% !important;
        max-width: 100% !important;
        min-height: auto !important;
        margin: 0 !important;
        padding: 45px 15px 60px !important;
        box-sizing: border-box;
    }

    body.home-page .hero-inner {
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 auto !important;
        padding: 0 !important;
        box-sizing: border-box;
    }

    body.home-page .hero-headline {
        width: 100%;
        max-width: 100%;
        font-size: clamp(2.2rem, 11vw, 3.5rem) !important;
        line-height: 1.08 !important;
        word-break: normal;
    }

    body.home-page .hero-para {
        width: 100% !important;
        max-width: 100% !important;
        font-size: 0.95rem !important;
        line-height: 1.65 !important;
        text-align: left !important;
        box-sizing: border-box;
    }

    body.home-page .hero-cta-row {
        width: 100% !important;
        display: flex !important;
        flex-direction: column !important;
        gap: 12px !important;
    }

    body.home-page .hero-cta-row a {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box;
    }
}