/* ============================================
   Webflow Branding Remover CSS
   ============================================

   This stylesheet hides all Webflow branding elements
   from exported Webflow templates.

   Usage: Include this CSS file in your HTML:
   <link href="css/hide-branding.css" rel="stylesheet" type="text/css"/>

   ============================================ */

/* Hide "Made in Webflow" badge */
a[href*="webflow.com"][href*="Made-in"] {
    display: none !important;
}

/* Hide Webflow badge (alternative selector) */
.w-webflow-badge {
    display: none !important;
}

/* Hide promotional labels wrapper */
.promotion-labels-wrapper-to-remove {
    display: none !important;
}

/* Hide individual promotion labels */
.promotion-label-left,
.promotion-label-right,
.promotion-label-holder,
.promotion-label-more-templates,
.promotion-label-buy-this-template,
.promotion-label-paragraph,
.promotion-label-button,
.promotion-label-close {
    display: none !important;
}

/* Hide footer branding elements */
.footer-rights-wrapper {
    display: none !important;
}

.footer-rights {
    display: none !important;
}

.footer-copyright-link {
    display: none !important;
}

.footer-licensing-link {
    display: none !important;
}

/* Hide meta generator tag (doesn't affect display but good practice) */
meta[name="generator"][content="Webflow"] {
    display: none !important;
}

/* ============================================
   Additional common Webflow branding selectors
   ============================================ */

/* Hide any links to webflow.com in footer */
footer a[href*="webflow.com"],
.footer a[href*="webflow.com"] {
    display: none !important;
}

/* Hide any links to 128.digital (template designer) */
footer a[href*="128.digital"],
.footer a[href*="128.digital"] {
    display: none !important;
}

/* Hide template marketplace links */
a[href*="webflow.com/templates"],
a[href*="webflow.com/dashboard/marketplace"] {
    display: none !important;
}

/* ============================================
   Flowfye Branding Elements
   ============================================ */

/* Hide entire bottom left corner popup section */
.cover_page-popup {
    display: none !important;
}

/* Hide "Explore all pages" button */
.cover_button-text {
    display: none !important;
}

/* Hide "Like this template? Customize it or explore more from us." popup */
.small-popup-text {
    display: none !important;
}

/* Hide individual popup elements */
.cover_button-item {
    display: none !important;
}

.packages-link-wrap.small_popup {
    display: none !important;
}

.purches-template-trigger {
    display: none !important;
}

/* Hide navbar dropdown bottom branding text */
.nav-dropdown_bottom {
    display: none !important;
}

.nav-dropdown_bottom-text {
    display: none !important;
}

/* Hide elements containing "Made By Flowfye - Powered By Webflow" text */
footer a[href*="flowfye.com"],
.footer a[href*="flowfye.com"] {
    display: none !important;
}

/* Hide any text mentioning Flowfye */
*:contains("Flowfye") {
    display: none !important;
}

/* Hide copyright with Flowfye */
.link-white[href*="flowfye.com"] {
    display: none !important;
}

/* Additional catch-all for Flowfye links */
a[href*="flowfye.com"] {
    display: none !important;
}

/* ============================================
   End of Webflow Branding Remover CSS
   ============================================ */

/* ============================================
   Blog Card Styles
   ============================================ */

.collection-list-blogs {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 2rem;
    padding: 0;
    list-style: none;
}

@media (max-width: 991px) {
    .collection-list-blogs {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 767px) {
    .collection-list-blogs {
        grid-template-columns: 1fr;
    }
}

.collection-item-blogs {
    margin: 0;
}

.blog-card-link {
    display: block;
    text-decoration: none;
    color: inherit;
    transition: transform 0.3s ease;
}

.blog-card-link:hover {
    transform: translateY(-8px);
}

.blog-card-image-wrapper {
    position: relative;
    width: 100%;
    padding-bottom: 66.67%;
    overflow: hidden;
    border-radius: 16px;
    margin-bottom: 1.5rem;
}

.blog-card-image {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.blog-category-tag {
    position: absolute;
    top: 1.25rem;
    left: 1.25rem;
    background: #ffffff;
    padding: 0.5rem 1rem;
    border-radius: 50px;
    font-size: 0.875rem;
    font-weight: 500;
    color: #000000;
}

.blog-card-content {
    padding: 0;
}

.blog-date {
    font-size: 0.875rem;
    color: #666666;
    margin-bottom: 0.75rem;
}

.blog-card-title {
    font-size: 1.25rem;
    font-weight: 600;
    line-height: 1.4;
    margin: 0;
    color: #000000;
}

/* ============================================
   End of Blog Card Styles
   ============================================ */
