            html:not([data-tk-theme="light"]) .tk-app-portfolio .light.first_section {
                background: #1d1c1c !important;
            }

            .tk-app-portfolio .light.first_section {
                padding-bottom: 70px;
            }

            .tk-app-portfolio-actions {
                margin-bottom: 10px;
                text-align: center;
            }

            .tk-app-portfolio-list + .tk-app-portfolio-list {
                margin-top: 48px;
            }

            .tk-app-portfolio-head {
                margin-bottom: 22px;
                text-align: center;
            }

            .tk-app-portfolio-head h2 {
                display: inline-flex;
                align-items: center;
                gap: 10px;
                margin: 0 0 6px;
                font-size: 28px;
                font-weight: 800;
                text-transform: uppercase;
            }

            .tk-app-portfolio-head h2 i {
                color: var(--primary-color);
            }

            .tk-app-portfolio-head p {
                margin: 0;
            }

            /* Same grid as the website portfolio (portfolioweb.blade.php). */
            .tk-app-portfolio-grid {
                display: grid;
                grid-template-columns: repeat(3, minmax(0, 1fr));
                gap: 25px 20px;
                align-items: start;
                margin: 0;
                padding: 0;
                list-style: none;
            }

            .tk-app-portfolio-grid .featured-img {
                display: block;
                width: 100%;
                height: auto;
                aspect-ratio: 4 / 3;
                object-fit: cover;
            }

            .tk-app-portfolio .light p.portfolio-item-caption {
                margin: 0;
                padding: 10px 15px;
                background: #171717;
                color: #fff;
                font-weight: bold;
                text-align: left;
            }

            .tk-app-portfolio-credit {
                display: block;
                margin-top: 3px;
                color: var(--primary-color);
                font-size: 12px;
                font-weight: 600;
                text-decoration: none;
            }

            html[data-tk-theme="light"] #primary.tk-app-portfolio .tk-app-portfolio-credit {
                color: var(--primary-color-dark, #005BC7);
            }

            .tk-app-portfolio-empty {
                margin: 0;
                padding: 28px 16px;
                border: 1px dashed color-mix(in srgb, var(--primary-color) 45%, transparent);
                border-radius: 14px;
                text-align: center;
            }

            html[data-tk-theme="light"] #primary.tk-app-portfolio {
                background: #F3F6F8;
            }

            html[data-tk-theme="light"] #primary.tk-app-portfolio section.light.first_section {
                background-color: #F3F6F8 !important;
                background-image: none !important;
            }

            html[data-tk-theme="light"] #primary.tk-app-portfolio h1,
            html[data-tk-theme="light"] #primary.tk-app-portfolio h2 {
                color: #0A0D0F;
            }

            html[data-tk-theme="light"] #primary.tk-app-portfolio .light p.portfolio-item-caption {
                background: #FFFFFF;
                color: #0A0D0F;
            }

            @media (min-width: 768px) {
                .tk-app-portfolio-actions .button.main-green {
                    margin: 10px 4px 30px !important;
                }
            }

            @media (max-width: 991px) {
                .tk-app-portfolio-grid {
                    grid-template-columns: repeat(2, minmax(0, 1fr));
                }
            }

            @media (max-width: 767px) {
                .tk-app-portfolio .first_section {
                    padding-top: 95px !important;
                }

                .tk-app-portfolio .mobbig.main-title {
                    font-size: 30px !important;
                    text-align: center;
                }

                .tk-app-portfolio-actions .button.main-green {
                    margin: 10px 3px 24px !important;
                    padding: 10px 21px !important;
                }

                .tk-app-portfolio-head h2 {
                    font-size: 22px;
                }
            }

            /* Two across on phones too: a hundred cards in one column was a
               very long scroll. */
            @media (max-width: 575px) {
                .tk-app-portfolio-grid {
                    gap: 14px 10px;
                }

                .tk-app-portfolio .light p.portfolio-item-caption {
                    padding: 8px 10px;
                    font-size: 12px;
                    line-height: 1.3;
                }

                .tk-app-portfolio-credit {
                    font-size: 10.5px;
                }
            }
        
