@import '_content/Ecommerce.Basic/Ecommerce.Basic.o1prarvo7f.bundle.scp.css';

/* /Components/Layout/MainLayout.razor.rz.scp.css */
.page[b-huz2ka0xry] {
    position: relative;
    display: flex;
    flex-direction: column;
}

main[b-huz2ka0xry] {
    flex: 1;
}

.sidebar[b-huz2ka0xry] {
    background-image: linear-gradient(180deg, rgb(5, 39, 103) 0%, #3a0647 70%);
}

.top-row[b-huz2ka0xry] {
    background-color: #f7f7f7;
    border-bottom: 1px solid #d6d5d5;
    justify-content: flex-end;
    height: 3.5rem;
    display: flex;
    align-items: center;
}

    .top-row[b-huz2ka0xry]  a, .top-row[b-huz2ka0xry]  .btn-link {
        white-space: nowrap;
        margin-left: 1.5rem;
        text-decoration: none;
    }

    .top-row[b-huz2ka0xry]  a:hover, .top-row[b-huz2ka0xry]  .btn-link:hover {
        text-decoration: underline;
    }

    .top-row[b-huz2ka0xry]  a:first-child {
        overflow: hidden;
        text-overflow: ellipsis;
    }

@media (max-width: 640.98px) {
    .top-row[b-huz2ka0xry] {
        justify-content: space-between;
    }

    .top-row[b-huz2ka0xry]  a, .top-row[b-huz2ka0xry]  .btn-link {
        margin-left: 0;
    }
}

@media (min-width: 641px) {
    .page[b-huz2ka0xry] {
        flex-direction: row;
    }

    .sidebar[b-huz2ka0xry] {
        width: 250px;
        height: 100vh;
        position: sticky;
        top: 0;
    }

    .top-row[b-huz2ka0xry] {
        position: sticky;
        top: 0;
        z-index: 1;
    }

    .top-row.auth[b-huz2ka0xry]  a:first-child {
        flex: 1;
        text-align: right;
        width: 0;
    }

    .top-row[b-huz2ka0xry], article[b-huz2ka0xry] {
        padding-left: 2rem !important;
        padding-right: 1.5rem !important;
    }
}

#blazor-error-ui[b-huz2ka0xry] {
    color-scheme: light only;
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    box-sizing: border-box;
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss[b-huz2ka0xry] {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }

/* Floating Cart Button */
.cart-float[b-huz2ka0xry] {
    position: fixed;
    bottom: 30px;
    right: 30px;
    width: 60px;
    height: 60px;
    border-radius: 50%;
    background: #0f172a; /* Store ink color */
    color: white;
    display: grid;
    place-items: center;
    font-size: 24px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.2);
    cursor: pointer;
    z-index: 1100; /* High z-index to sit on top */
    transition: transform 0.2s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.cart-float:hover[b-huz2ka0xry] {
    transform: scale(1.1);
}

.cart-count[b-huz2ka0xry] {
    position: absolute;
    top: -5px;
    right: -5px;
    background: #ef4444;
    color: white;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    font-size: 12px;
    font-weight: 700;
    display: grid;
    place-items: center;
    border: 2px solid white;
}

@media (max-width: 1024px) {
    .cart-float[b-huz2ka0xry] {
        bottom: 20px;
        right: 20px;
    }
}
/* /Components/Layout/SazaFooter.razor.rz.scp.css */
/* Footer Styles (Grand & Sexy) */
.saza-footer[b-uqggy3sho8] {
    background: radial-gradient(circle at center top, #1e293b 0%, #020617 100%);
    color: #e2e8f0;
    padding: 8rem 0 4rem;
    font-family: system-ui, -apple-system, "Segoe UI", sans-serif;
    position: relative;
    overflow: hidden;
    border-top: 1px solid rgba(255,255,255,0.05);
}

/* Texture Overlay (Noise) - Matching About Page */
.saza-footer[b-uqggy3sho8]::before {
    content: "";
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)' opacity='0.03'/%3E%3C/svg%3E");
    opacity: 0.4;
    pointer-events: none;
    z-index: 0;
}

/* Top Glow Accent */
.saza-footer[b-uqggy3sho8]::after {
    content: "";
    position: absolute;
    top: 0; left: 50%;
    transform: translateX(-50%);
    width: 60%;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(56, 189, 248, 0.5), transparent);
    box-shadow: 0 0 30px rgba(56, 189, 248, 0.3);
}

.saza-container[b-uqggy3sho8] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 24px;
    position: relative;
    z-index: 2;
}

.footer-inner[b-uqggy3sho8] {
    display: grid;
    grid-template-columns: 1fr 1.2fr 1fr;
    gap: 5rem;
}

/* COL 1: BRAND */
.brand-col[b-uqggy3sho8] {
    display: flex;
    flex-direction: column;
    gap: 2.5rem;
}

.footer-logo img[b-uqggy3sho8] {
    height: 70px;
    width: auto;
    filter: drop-shadow(0 0 20px rgba(255,255,255,0.1));
    transition: filter 0.3s;
}

.footer-logo:hover img[b-uqggy3sho8] {
    filter: drop-shadow(0 0 30px rgba(255,255,255,0.3));
}

.contact-details[b-uqggy3sho8] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.contact-item[b-uqggy3sho8] {
    display: flex;
    align-items: center;
    gap: 16px;
    font-size: 1.05rem;
    color: #94a3b8;
    padding: 10px;
    border-radius: 12px;
    transition: background 0.3s;
}

.contact-item:hover[b-uqggy3sho8] {
    background: rgba(255,255,255,0.03);
}

.contact-item .icon[b-uqggy3sho8] {
    font-size: 1.4rem;
    filter: grayscale(1);
    transition: filter 0.3s;
}

.contact-item:hover .icon[b-uqggy3sho8] {
    filter: grayscale(0);
}

.contact-item a[b-uqggy3sho8] {
    color: #cbd5e1;
    text-decoration: none;
    font-weight: 500;
    transition: color 0.3s;
}

.contact-item:hover a[b-uqggy3sho8] {
    color: #ffffff;
    text-shadow: 0 0 10px rgba(255,255,255,0.3);
}

.social-links[b-uqggy3sho8] {
    display: flex;
    gap: 16px;
    margin-top: 1rem;
}

.social-btn[b-uqggy3sho8] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: rgba(255,255,255,0.03);
    color: #94a3b8;
    border: 1px solid rgba(255,255,255,0.1);
    backdrop-filter: blur(5px);
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.social-btn:hover[b-uqggy3sho8] {
    background: #d32f2f;
    color: white;
    border-color: #d32f2f;
    transform: translateY(-5px) scale(1.1);
    box-shadow: 0 0 20px rgba(211, 47, 47, 0.5);
}

/* HEADINGS */
.footer-heading[b-uqggy3sho8] {
    font-size: 1rem;
    font-weight: 800;
    color: #ffffff;
    margin-bottom: 2.5rem;
    text-transform: uppercase;
    letter-spacing: 0.15em;
    position: relative;
    display: inline-block;
    text-shadow: 0 0 20px rgba(255,255,255,0.1);
}

.footer-heading[b-uqggy3sho8]::after {
    content: "";
    display: block;
    width: 50px;
    height: 3px;
    background: linear-gradient(90deg, #d32f2f, transparent);
    margin-top: 10px;
}

/* COL 2: POSTS (Glass Cards) */
.posts-list[b-uqggy3sho8] {
    display: flex;
    flex-direction: column;
    gap: 1.2rem;
}

.footer-post[b-uqggy3sho8] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    text-decoration: none;
    padding: 16px;
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.02);
    border: 1px solid rgba(255, 255, 255, 0.05);
    transition: all 0.3s ease;
}

.footer-post:hover[b-uqggy3sho8] {
    background: rgba(255, 255, 255, 0.08);
    border-color: rgba(255, 255, 255, 0.2);
    transform: translateX(10px);
    box-shadow: 0 10px 30px -10px rgba(0,0,0,0.5);
}

.post-date[b-uqggy3sho8] {
    font-size: 0.75rem;
    color: #d32f2f;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.post-title[b-uqggy3sho8] {
    font-size: 1.05rem;
    color: #e2e8f0;
    line-height: 1.4;
    font-weight: 600;
}

.footer-post:hover .post-title[b-uqggy3sho8] {
    color: #ffffff;
}

/* COL 3: SPONSORS (Glass Pills) */
.footer-sponsors-grid[b-uqggy3sho8] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
}

.footer-sponsor-link[b-uqggy3sho8] {
    background: rgba(255, 255, 255, 0.05);
    border-radius: 16px;
    height: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
    transition: all 0.4s ease;
    border: 1px solid rgba(255, 255, 255, 0.05);
    backdrop-filter: blur(5px);
}

.footer-sponsor-link img[b-uqggy3sho8] {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    filter: grayscale(1) brightness(2); /* White logos initially */
    opacity: 0.5;
    transition: all 0.4s ease;
}

.footer-sponsor-link:hover[b-uqggy3sho8] {
    background: #ffffff;
    transform: translateY(-5px);
    box-shadow: 0 0 30px rgba(255,255,255,0.1);
    border-color: white;
}

.footer-sponsor-link:hover img[b-uqggy3sho8] {
    filter: grayscale(0) brightness(1); /* Full color on hover */
    opacity: 1;
}

/* COPYRIGHT */
.copyright[b-uqggy3sho8] {
    margin-top: 6rem;
    text-align: center;
    font-size: 0.9rem;
    color: #64748b;
    padding-top: 2rem;
    border-top: 1px solid rgba(255,255,255,0.05);
    width: 100%;
    grid-column: 1 / -1; /* Span full width */
}

/* RESPONSIVE */
@media (max-width: 992px) {
    .saza-footer[b-uqggy3sho8] {
        padding: 5rem 0 3rem;
    }

    .footer-inner[b-uqggy3sho8] {
        grid-template-columns: 1fr;
        gap: 4rem;
        text-align: center;
    }

    .brand-col[b-uqggy3sho8], .contact-details[b-uqggy3sho8], .contact-item[b-uqggy3sho8] {
        align-items: center;
        justify-content: center;
    }
    
    .social-links[b-uqggy3sho8] {
        justify-content: center;
    }

    .footer-heading[b-uqggy3sho8]::after {
        margin: 10px auto 0;
        background: linear-gradient(90deg, transparent, #d32f2f, transparent);
    }
    
    .posts-list[b-uqggy3sho8] {
        text-align: left;
    }

    .footer-sponsors-grid[b-uqggy3sho8] {
        grid-template-columns: repeat(3, 1fr);
    }
}
/* /Components/Layout/SazaNavbar.razor.rz.scp.css */
.saza-topbar[b-vpslhgms3o], .saza-mainnav[b-vpslhgms3o] {
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.saza-container[b-vpslhgms3o] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 24px;
    box-sizing: border-box;
}

/* TOP BAR */
.saza-topbar[b-vpslhgms3o] {
    background-color: #ffffff;
    border-bottom: 1px solid #e5e7eb;
    font-size: 0.8125rem;
    color: #4b5563;
}

.saza-topbar-inner[b-vpslhgms3o] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 40px;
}

.saza-tagline[b-vpslhgms3o] {
    letter-spacing: 0.08em;
    text-transform: uppercase;
    font-weight: 600;
    font-size: 0.75rem;
    color: #6b7280;
}

.saza-topbar-right[b-vpslhgms3o] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.saza-topbar-link[b-vpslhgms3o] {
    text-decoration: none;
    color: #4b5563;
    transition: color 0.2s ease;
}

    .saza-topbar-link:hover[b-vpslhgms3o] {
        color: #111827;
    }

.saza-divider[b-vpslhgms3o] {
    color: #d1d5db;
}

.saza-topbar-social-label[b-vpslhgms3o] {
    text-transform: uppercase;
    font-size: 0.7rem;
    letter-spacing: 0.12em;
    color: #9ca3af;
    margin-right: 2px;
}

/* MAIN NAVBAR (Default: Solid White for internal pages) */
.saza-mainnav[b-vpslhgms3o] {
    position: sticky;
    top: 0;
    z-index: 40;
    background-color: #ffffff;
    margin-bottom: 0;
    border-bottom: 1px solid #e5e7eb;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
}

.saza-mainnav-inner[b-vpslhgms3o] {
    display: grid;
    grid-template-columns: 1fr auto 1.5fr auto; /* More space for right side */
    align-items: center;
    min-height: 80px; /* Default height */
    gap: 24px;
    transition: min-height 0.4s ease;
}

/* HOME PAGE VARIANT (Transparent Overlay) */
.saza-mainnav.saza-navbar-home[b-vpslhgms3o] {
    background-color: rgba(255, 255, 255, 0.0);
    margin-bottom: -100px;
    border-bottom-color: transparent;
    box-shadow: none;
    min-height: 100px;
}

.saza-mainnav.saza-navbar-home .saza-mainnav-inner[b-vpslhgms3o] {
    min-height: 100px;
}

/* SCROLLED STATE (Applied to both, but mostly affects Home to turn it white) */
.saza-mainnav--scrolled[b-vpslhgms3o] {
    background-color: #ffffff !important;
    border-bottom-color: #e5e7eb !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05) !important;
}

.saza-mainnav--scrolled .saza-mainnav-inner[b-vpslhgms3o] {
    min-height: 80px; /* Shrink to standard */
}

.saza-mainnav-left[b-vpslhgms3o],
.saza-mainnav-right[b-vpslhgms3o] {
    display: flex;
    align-items: center;
    gap: 12px; /* Tighten general gap */
    justify-content: flex-end; 
}

/* Pushed closer to center/logo but with a gap */
.saza-mainnav-left[b-vpslhgms3o] {
    justify-content: flex-end; 
    margin-right: 48px;
}

.saza-logo[b-vpslhgms3o] {
    display: flex;
    justify-content: center;
    transition: transform 0.4s ease;
}

    .saza-logo img[b-vpslhgms3o] {
        height: 60px; /* Default/Scrolled Size */
        width: auto;
        display: block;
        transition: height 0.4s ease;
    }

.saza-mainnav.saza-navbar-home .saza-logo img[b-vpslhgms3o] {
    height: 85px; /* Bigger on Home Top */
}

.saza-mainnav--scrolled .saza-logo img[b-vpslhgms3o] {
    height: 60px; /* Shrink on scroll */
}

/* Link Container to prevent wrapping */
.saza-navlinks[b-vpslhgms3o] {
    display: flex;
    align-items: center;
    gap: 2px;
}

/* NEW LINK STYLES (No underline, modern pill) */
/* Increased specificity and ::deep to ensure styles apply to NavLink content */
.saza-mainnav[b-vpslhgms3o]  .saza-navlink {
    position: relative;
    text-decoration: none !important; /* Force remove underline */
    font-size: 0.9rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #4b5563; /* Medium Grey */
    padding: 8px 16px;
    border-radius: 999px;
    transition: all 0.2s ease;
}

    .saza-mainnav[b-vpslhgms3o]  .saza-navlink:hover {
        color: #111827; /* Darker */
        background-color: #f3f4f6; /* Light Grey Pill */
    }

    .saza-mainnav[b-vpslhgms3o]  .saza-navlink::after {
        display: none; /* Removed underline */
    }

/* Admin Toggle specific (smaller) */
.saza-admin-toggle[b-vpslhgms3o] {
    font-size: 0.8rem; /* Smaller text */
    padding: 6px 12px;
    color: #6b7280;
}

    .saza-admin-toggle:hover[b-vpslhgms3o] {
        background-color: #f3f4f6;
        color: #374151;
    }

/* HOME PAGE LINK STYLES (Initial) */
.saza-mainnav.saza-navbar-home:not(.saza-mainnav--scrolled)[b-vpslhgms3o]  .saza-navlink {
    color: #1f2937; 
    font-weight: 700;
}

.saza-mainnav.saza-navbar-home:not(.saza-mainnav--scrolled)[b-vpslhgms3o]  .saza-navlink:hover {
    background-color: rgba(255, 255, 255, 0.2);
    color: #000000;
}

/* Active State */
.saza-mainnav[b-vpslhgms3o]  .saza-navlink--active {
    color: #111827 !important;
    background-color: #f3f4f6;
}

.saza-mainnav.saza-navbar-home:not(.saza-mainnav--scrolled)[b-vpslhgms3o]  .saza-navlink--active {
    color: #000000 !important;
    background-color: rgba(255, 255, 255, 0.3);
}


.saza-cta[b-vpslhgms3o] {
    text-decoration: none;
    padding: 8px 18px; /* Slightly smaller padding */
    border-radius: 999px;
    border: 1px solid #111827;
    font-size: 0.85rem;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #ffffff;
    background: #111827;
    white-space: nowrap;
    transition: background-color 0.2s, color 0.2s, box-shadow 0.2s, border-color 0.2s;
    justify-self: end;
}

    .saza-cta:hover[b-vpslhgms3o] {
        background-color: #0f172a;
        border-color: #0f172a;
        box-shadow: 0 4px 12px rgba(15, 23, 42, 0.2);
    }

/* CART BUTTON */
.saza-cart-btn[b-vpslhgms3o] {
    background: none;
    border: none;
    color: #374151;
    cursor: pointer;
    position: relative;
    padding: 8px;
    margin-left: 8px; /* Small separation from profile */
    display: flex;
    align-items: center;
    justify-content: center;
    transition: color 0.2s ease, transform 0.2s ease;
}

.saza-cart-btn:hover[b-vpslhgms3o] {
    color: #111827;
    transform: scale(1.05);
}

.saza-mainnav.saza-navbar-home:not(.saza-mainnav--scrolled) .saza-cart-btn[b-vpslhgms3o] {
    color: #1f2937;
}

.saza-mainnav.saza-navbar-home:not(.saza-mainnav--scrolled) .saza-cart-btn:hover[b-vpslhgms3o] {
    color: #000000;
}

.saza-cart-badge[b-vpslhgms3o] {
    position: absolute;
    top: 0;
    right: 0;
    background-color: #ef4444; /* Red 500 */
    color: white;
    font-size: 0.65rem;
    font-weight: 700;
    min-width: 16px;
    height: 16px;
    border-radius: 999px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 4px;
    box-shadow: 0 2px 4px rgba(239, 68, 68, 0.4);
}


/* BURGER + MOBILE MENU */
.saza-burger[b-vpslhgms3o] {
    background: none;
    border: none;
    padding: 6px;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    gap: 5px;
    justify-self: end;
}

.saza-burger-line[b-vpslhgms3o] {
    width: 22px;
    height: 2px;
    background-color: #111827;
    border-radius: 999px;
    transition: transform 0.2s ease, opacity 0.2s ease;
}

    .saza-burger-line.open:nth-child(1)[b-vpslhgms3o] {
        transform: translateY(7px) rotate(45deg);
    }

    .saza-burger-line.open:nth-child(2)[b-vpslhgms3o] {
        opacity: 0;
    }

    .saza-burger-line.open:nth-child(3)[b-vpslhgms3o] {
        transform: translateY(-7px) rotate(-45deg);
    }

.saza-mobile-menu[b-vpslhgms3o] {
    display: flex; /* Always flex layout, visibility controlled by max-height */
    flex-direction: column;
    background-color: #ffffff;
    border-bottom: 1px solid #e5e7eb;
    box-shadow: 0 12px 30px rgba(15, 23, 42, 0.08);
    
    /* Animation Props */
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    padding: 0 24px; /* Collapsed padding */
    transition: max-height 0.4s ease-in-out, opacity 0.4s ease-in-out, padding 0.4s ease;
}

    .saza-mobile-menu.open[b-vpslhgms3o] {
        max-height: 800px; /* Large enough to fit content */
        opacity: 1;
        padding: 12px 24px 20px; /* Restore padding */
    }

/* MOBILE LINK STYLES */
.saza-mobile-menu[b-vpslhgms3o]  .saza-mobile-link {
    text-decoration: none !important;
    padding: 12px 0;
    font-size: 0.95rem;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #374151;
    border-bottom: 1px solid #f3f4f6;
    display: block; /* Ensure full width click area */
}

    .saza-mobile-menu[b-vpslhgms3o]  .saza-mobile-link:last-child {
        border-bottom: none;
    }

.saza-mobile-menu[b-vpslhgms3o]  .saza-mobile-link--active {
    color: #111827;
}

.saza-mobile-menu[b-vpslhgms3o]  .saza-mobile-link-cta {
    margin-top: 16px;
    border-radius: 999px;
    text-align: center;
    border: 1px solid #111827;
    background-color: #111827;
    color: #ffffff !important;
    padding: 12px 0;
}

.saza-desktop-only[b-vpslhgms3o] {
    display: flex;
}

.saza-mobile-only[b-vpslhgms3o] {
    display: none;
}

@media (max-width: 992px) {
    .saza-topbar[b-vpslhgms3o] {
        display: none;
    }

    .saza-topbar-inner[b-vpslhgms3o] {
        justify-content: center;
    }

    .saza-topbar-right[b-vpslhgms3o] {
        display: none;
    }

    .saza-mainnav-inner[b-vpslhgms3o] {
        display: flex; /* Flex instead of Grid for simple mobile layout */
        justify-content: space-between;
        align-items: center;
        min-height: 70px;
        grid-template-columns: none; /* Reset grid */
        gap: 0;
    }

    .saza-mainnav-left[b-vpslhgms3o],
    .saza-mainnav-right[b-vpslhgms3o],
    .saza-desktop-only[b-vpslhgms3o] {
        display: none !important;
    }

    .saza-mobile-only[b-vpslhgms3o] {
        display: flex; /* Burger needs flex */
    }

    .saza-logo[b-vpslhgms3o] {
        justify-content: flex-start;
        margin-right: auto;
    }

        .saza-logo img[b-vpslhgms3o] {
            height: 40px;
        }
}

/* PROFILE AVATAR */
.saza-profile-avatar[b-vpslhgms3o] {
    width: 36px;
    height: 36px;
    background-color: #111827;
    color: #ffffff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 600;
    font-size: 0.9rem;
    transition: background-color 0.2s ease, transform 0.2s ease;
}

.saza-profile-avatar:hover[b-vpslhgms3o] {
    background-color: #0f172a;
    transform: scale(1.05);
}

.saza-profile-avatar-guest[b-vpslhgms3o] {
    background-color: transparent;
    border: 1px solid #d1d5db;
    color: #4b5563;
}

.saza-profile-avatar-guest:hover[b-vpslhgms3o] {
    background-color: #f3f4f6;
    color: #111827;
    border-color: #9ca3af;
}

.saza-mainnav.saza-navbar-home:not(.saza-mainnav--scrolled) .saza-profile-avatar-guest[b-vpslhgms3o] {
    border-color: rgba(255,255,255,0.6);
    color: #1f2937;
}

.saza-mainnav.saza-navbar-home:not(.saza-mainnav--scrolled) .saza-profile-avatar-guest:hover[b-vpslhgms3o] {
    background-color: rgba(255,255,255,0.1);
    color: #000000;
    border-color: #000000;
}

/* PROFILE DROPDOWN CONTAINER - PUSH FAR RIGHT */
.saza-profile-dropdown[b-vpslhgms3o] {
    margin-left: 32px; /* Large separation */
    position: relative;
}
/* Ensure separator line if desired, or just space */
.saza-profile-dropdown[b-vpslhgms3o]::before {
    content: "";
    position: absolute;
    left: -16px;
    top: 50%;
    transform: translateY(-50%);
    height: 20px;
    width: 1px;
    background-color: #e5e7eb;
}
/* Hide separator on transparent home nav if wanted, or keep it subtle */
.saza-mainnav.saza-navbar-home:not(.saza-mainnav--scrolled) .saza-profile-dropdown[b-vpslhgms3o]::before {
    background-color: rgba(0,0,0,0.1); 
}

/* UTILS */
.hide-caret[b-vpslhgms3o]::after {
    display: none !important;
}
/* /Components/Pages/About.razor.rz.scp.css */
/* ABOUT PAGE STYLES */

/* Hero Section */
.about-hero[b-xyc9g24pgw] {
    height: 60vh;
    min-height: 400px;
    background-image: url('images/Gallery/I16.jpeg'); /* Fallback/Base */
    background-size: cover;
    background-position: center;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    color: white;
}

.hero-overlay[b-xyc9g24pgw] {
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background: linear-gradient(rgba(15, 23, 42, 0.4), rgba(15, 23, 42, 0.7));
    backdrop-filter: blur(2px);
}

.hero-content[b-xyc9g24pgw] {
    position: relative;
    z-index: 2;
    max-width: 800px;
}

.hero-title[b-xyc9g24pgw] {
    font-size: 4rem;
    font-weight: 800;
    margin-bottom: 1rem;
    text-shadow: 0 4px 10px rgba(0,0,0,0.3);
    font-family: 'Segoe UI', sans-serif;
    letter-spacing: -1px;
}

.hero-subtitle[b-xyc9g24pgw] {
    font-size: 1.5rem;
    font-weight: 300;
    opacity: 0.9;
    letter-spacing: 0.5px;
}

/* Spacing Util */
.section-spacing[b-xyc9g24pgw] {
    padding: 6rem 0;
}

/* Intro Section */
.about-intro[b-xyc9g24pgw] {
    background: #ffffff;
    overflow: hidden; /* For accents */
}

.intro-grid[b-xyc9g24pgw] {
    display: grid;
    grid-template-columns: 1fr 0.9fr; /* Text wider than image */
    gap: 5rem;
    align-items: center;
}

.section-label[b-xyc9g24pgw] {
    display: block;
    font-size: 0.85rem;
    color: #d32f2f;
    text-transform: uppercase;
    letter-spacing: 2px;
    font-weight: 800;
    margin-bottom: 1.5rem;
    position: relative;
    padding-left: 12px;
    border-left: 3px solid #d32f2f;
}

.section-heading[b-xyc9g24pgw] {
    font-size: 3rem;
    color: #1a3c5e;
    font-weight: 800;
    margin-bottom: 2rem;
    line-height: 1.1;
    letter-spacing: -1px;
}

.lead-text[b-xyc9g24pgw] {
    font-size: 1.25rem;
    color: #1e293b;
    line-height: 1.6;
    margin-bottom: 1.5rem;
    font-weight: 500;
}

.intro-text p[b-xyc9g24pgw] {
    font-size: 1.1rem;
    color: #475569;
    line-height: 1.8;
    margin-bottom: 1.5rem;
}

.marketing-focus[b-xyc9g24pgw] {
    background: #f8fafc;
    border-left: 4px solid #1a3c5e;
    padding: 1.5rem 2rem;
    border-radius: 0 12px 12px 0;
    color: #334155;
    font-style: italic;
    margin: 2rem 0;
}

.marketing-focus strong[b-xyc9g24pgw] {
    color: #1a3c5e;
    font-style: normal;
    font-weight: 700;
}

.intro-actions[b-xyc9g24pgw] {
    display: flex;
    align-items: center;
    gap: 3rem;
    margin-top: 2.5rem;
}

.signature[b-xyc9g24pgw] {
    opacity: 0.7;
    filter: grayscale(100%);
    transition: all 0.3s;
}

.signature:hover[b-xyc9g24pgw] {
    filter: grayscale(0%);
    opacity: 1;
}

.signature-logo[b-xyc9g24pgw] {
    height: 120px; /* Much Bigger */
    width: auto;
}

/* Image Styling (Clean & Professional) */
.intro-image-wrapper[b-xyc9g24pgw] {
    position: relative;
    padding-top: 2rem; /* Space for accent */
    padding-left: 2rem;
    max-width: 480px; /* Limit image width */
    margin: 0 auto; /* Center it in its column if smaller */
}

.image-frame-clean[b-xyc9g24pgw] {
    position: relative;
    z-index: 2;
    border-radius: 4px;
    overflow: hidden;
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
    background: #fff;
}

.ruben-portrait[b-xyc9g24pgw] {
    width: 100%;
    height: auto;
    display: block;
    transition: transform 0.5s ease;
}

.image-frame-clean:hover .ruben-portrait[b-xyc9g24pgw] {
    transform: scale(1.03);
}

.image-accent-bg[b-xyc9g24pgw] {
    position: absolute;
    top: 0; left: 0;
    width: 100%;
    height: 100%;
    background: #f1f5f9; /* Subtle grey block behind */
    z-index: 1;
    transform: translate(-20px, -20px); /* Offset to top-left */
    border-radius: 4px;
}

/* Add a second accent line */
.intro-image-wrapper[b-xyc9g24pgw]::after {
    content: "";
    position: absolute;
    bottom: -20px; right: -20px;
    width: 150px;
    height: 150px;
    border-right: 4px solid #d32f2f;
    border-bottom: 4px solid #d32f2f;
    z-index: 3;
}



/* Mission Section */
.mission-section[b-xyc9g24pgw] {
    position: relative;
    padding: 8rem 0;
    background: #0f172a; /* Fallback */
    overflow: hidden;
}

.mission-bg-image[b-xyc9g24pgw] {
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background-image: url('images/Gallery/I7.jpeg'); /* Use a scenic shot if available, re-using for now */
    background-size: cover;
    background-position: center;
    opacity: 0.3;
    filter: blur(2px);
    transform: scale(1.1); /* Slight zoom for blur edge fix */
}

.mission-content[b-xyc9g24pgw] {
    position: relative;
    z-index: 2;
    display: flex;
    justify-content: flex-end; /* Push card to right */
}

.mission-card[b-xyc9g24pgw] {
    background: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(10px);
    padding: 4rem;
    max-width: 600px;
    border-radius: 4px; /* Crisp corners for contrast */
    box-shadow: 0 25px 50px -12px rgba(0,0,0,0.5);
    border-left: 8px solid #d32f2f;
}

.mission-heading[b-xyc9g24pgw] {
    font-size: 2.2rem;
    color: #1a3c5e;
    font-weight: 800;
    margin-bottom: 1.5rem;
}

.mission-divider[b-xyc9g24pgw] {
    height: 4px;
    width: 60px;
    background: #cbd5e1;
    margin-bottom: 2rem;
}

.mission-card p[b-xyc9g24pgw] {
    font-size: 1.1rem;
    color: #475569;
    line-height: 1.8;
    margin-bottom: 1.5rem;
}

.mission-card strong[b-xyc9g24pgw] {
    color: #0f172a;
    font-weight: 700;
}

/* Values Section (Grand Design) */
.values-section[b-xyc9g24pgw] {
    background: linear-gradient(to bottom, #f8fafc, #f1f5f9);
    text-align: center;
    position: relative;
    padding: 8rem 0;
}

.values-header[b-xyc9g24pgw] {
    margin-bottom: 5rem;
}

.values-grid[b-xyc9g24pgw] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 40px;
}

.value-item[b-xyc9g24pgw] {
    background: #ffffff;
    padding: 4rem 2.5rem;
    border-radius: 30px;
    box-shadow: 
        0 20px 40px -10px rgba(0,0,0,0.05),
        0 0 0 1px rgba(0,0,0,0.02);
    position: relative;
    overflow: hidden;
    transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
    display: flex;
    flex-direction: column;
    align-items: center;
    border-bottom: 4px solid transparent;
}

.value-item:hover[b-xyc9g24pgw] {
    transform: translateY(-15px);
    box-shadow: 0 30px 60px -15px rgba(26, 60, 94, 0.15);
    border-bottom-color: #d32f2f;
}

/* Big Background Step Number */
.value-step[b-xyc9g24pgw] {
    position: absolute;
    top: -20px;
    right: -10px;
    font-size: 10rem;
    font-weight: 900;
    color: #1a3c5e;
    opacity: 0.04;
    font-family: 'Segoe UI', sans-serif;
    line-height: 1;
    z-index: 0;
    transition: transform 0.4s ease;
}

.value-item:hover .value-step[b-xyc9g24pgw] {
    transform: translateX(-10px) translateY(10px);
    color: #d32f2f;
    opacity: 0.08;
}

.value-content[b-xyc9g24pgw] {
    position: relative;
    z-index: 2;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.value-icon-wrapper[b-xyc9g24pgw] {
    width: 90px;
    height: 90px;
    border-radius: 50%;
    background: linear-gradient(135deg, #f8fafc 0%, #e2e8f0 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 2rem;
    color: #1a3c5e;
    transition: all 0.4s ease;
}

.value-item:hover .value-icon-wrapper[b-xyc9g24pgw] {
    background: #1a3c5e;
    color: #ffffff;
    transform: scale(1.1) rotate(5deg);
    box-shadow: 0 10px 20px rgba(26, 60, 94, 0.2);
}

.value-item h3[b-xyc9g24pgw] {
    font-size: 1.8rem;
    color: #1a3c5e;
    margin-bottom: 1rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 2px;
}

.value-line[b-xyc9g24pgw] {
    width: 40px;
    height: 3px;
    background: #d32f2f;
    margin-bottom: 1.5rem;
    transition: width 0.3s ease;
}

.value-item:hover .value-line[b-xyc9g24pgw] {
    width: 80px;
}

.value-item p[b-xyc9g24pgw] {
    color: #64748b;
    line-height: 1.7;
    font-size: 1.05rem;
    max-width: 90%;
}

/* CTA Section (Sexy Finale) */
.about-cta[b-xyc9g24pgw] {
    background: radial-gradient(circle at center top, #1e293b 0%, #020617 100%);
    color: white;
    text-align: center;
    padding: 10rem 0 12rem;
    position: relative;
    overflow: hidden;
}

/* Texture Overlay (Noise) */
.about-cta[b-xyc9g24pgw]::before {
    content: "";
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)' opacity='0.05'/%3E%3C/svg%3E");
    opacity: 0.4;
    pointer-events: none;
}

/* Abstract Light Glow */
.about-cta[b-xyc9g24pgw]::after {
    content: "";
    position: absolute;
    top: -50%; left: 50%;
    transform: translate(-50%, 0);
    width: 80%;
    height: 100%;
    background: radial-gradient(ellipse at center, rgba(56, 189, 248, 0.15) 0%, transparent 70%);
    pointer-events: none;
    z-index: 1;
}

.cta-inner[b-xyc9g24pgw] {
    position: relative;
    z-index: 5;
}

.cta-inner h2[b-xyc9g24pgw] {
    font-family: 'Great Vibes', cursive;
    font-size: 6rem;
    color: #ffffff;
    margin-bottom: 2rem;
    text-shadow: 
        0 0 10px rgba(56, 189, 248, 0.8),
        0 0 20px rgba(56, 189, 248, 0.5),
        0 0 40px rgba(56, 189, 248, 0.3);
    line-height: 1.2;
    transform: rotate(-2deg);
}

.cta-inner p[b-xyc9g24pgw] {
    font-size: 1.4rem;
    max-width: 700px;
    margin: 0 auto 1.5rem;
    line-height: 1.6;
    color: #e2e8f0;
    text-shadow: 0 2px 4px rgba(0,0,0,0.5);
}

.cta-sub[b-xyc9g24pgw] {
    font-size: 1.1rem !important;
    opacity: 0.8;
    margin-bottom: 4rem !important;
    font-weight: 300;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: #94a3b8 !important;
}

.cta-buttons[b-xyc9g24pgw] {
    display: flex;
    justify-content: center;
    gap: 30px;
}

.btn-primary[b-xyc9g24pgw] {
    padding: 1.2rem 3.5rem;
    font-size: 1rem;
    letter-spacing: 2px;
    background: linear-gradient(135deg, #d32f2f 0%, #991b1b 100%);
    box-shadow: 
        0 0 20px rgba(220, 38, 38, 0.4),
        0 0 0 1px rgba(255, 255, 255, 0.1) inset;
    border-radius: 50px;
    position: relative;
    overflow: hidden;
}

.btn-primary:hover[b-xyc9g24pgw] {
    transform: translateY(-5px);
    box-shadow: 0 0 40px rgba(220, 38, 38, 0.6);
}

.btn-secondary[b-xyc9g24pgw] {
    padding: 1.2rem 3.5rem;
    font-size: 1rem;
    letter-spacing: 2px;
    background: transparent;
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-radius: 50px;
    backdrop-filter: blur(5px);
}

.btn-secondary:hover[b-xyc9g24pgw] {
    background: #ffffff;
    color: #0f172a;
    border-color: #ffffff;
    box-shadow: 0 0 30px rgba(255, 255, 255, 0.3);
}

/* Responsive */
@media (max-width: 992px) {
    .intro-grid[b-xyc9g24pgw], .values-grid[b-xyc9g24pgw] {
        grid-template-columns: 1fr;
        gap: 3rem;
    }

    /* "The Man Behind The Brand" (Intro) mobile layout */
    .about-intro.section-spacing[b-xyc9g24pgw] {
        padding: 3.5rem 0;
    }

    .intro-text[b-xyc9g24pgw] {
        text-align: center;
    }

    .intro-text p[b-xyc9g24pgw] {
        font-size: 1rem;
    }

    .section-label[b-xyc9g24pgw] {
        display: inline-block;
        border-left: none;
        padding-left: 0;
        padding-bottom: 6px;
        margin-bottom: 1rem;
        border-bottom: 3px solid #d32f2f;
    }

    .section-heading[b-xyc9g24pgw] {
        font-size: 2.25rem;
        margin-bottom: 1.25rem;
    }

    .lead-text[b-xyc9g24pgw] {
        font-size: 1.05rem;
    }

    .marketing-focus[b-xyc9g24pgw] {
        padding: 1.1rem 1.2rem;
        border-left-width: 3px;
        border-radius: 12px;
        text-align: left;
        margin: 1.5rem 0;
    }

    .intro-actions[b-xyc9g24pgw] {
        flex-direction: column;
        align-items: stretch;
        gap: 1rem;
        margin-top: 1.5rem;
    }

    .about-intro .btn-primary[b-xyc9g24pgw] {
        width: 100%;
        max-width: 360px;
        align-self: center;
        text-align: center;
    }

    .signature[b-xyc9g24pgw] {
        align-self: center;
    }

    .signature-logo[b-xyc9g24pgw] {
        height: 86px;
    }

    .intro-image-wrapper[b-xyc9g24pgw] {
        padding-top: 0;
        padding-left: 0;
        max-width: 380px;
    }

    .image-accent-bg[b-xyc9g24pgw] {
        transform: translate(-12px, -12px);
    }

    .intro-image-wrapper[b-xyc9g24pgw]::after {
        width: 110px;
        height: 110px;
        bottom: -14px;
        right: -14px;
        border-right-width: 3px;
        border-bottom-width: 3px;
    }
    
    .mission-content[b-xyc9g24pgw] {
        justify-content: center;
    }

    .hero-title[b-xyc9g24pgw] {
        font-size: 3rem;
    }
    
    .image-frame[b-xyc9g24pgw] {
        transform: rotate(0);
        margin: 0 auto;
        max-width: 500px;
    }
    
    .stat-card[b-xyc9g24pgw] {
        left: 50%;
        transform: translateX(-50%);
        bottom: -30px;
    }
}

@media (max-width: 480px) {
    .section-heading[b-xyc9g24pgw] {
        font-size: 2rem;
    }

    .hero-title[b-xyc9g24pgw] {
        font-size: 2.4rem;
    }

    .intro-image-wrapper[b-xyc9g24pgw] {
        max-width: 320px;
    }
}
/* /Components/Pages/Admin/AdminBlog.razor.rz.scp.css */
.admin-blog-container[b-x8ld5em4dj] {
    max-width: 1400px;
    margin: 0 auto;
    padding: 2rem;
    color: #1a3c5e;
}

/* Header */
.admin-header[b-x8ld5em4dj] {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    margin-bottom: 3rem;
    padding-bottom: 1.5rem;
    border-bottom: 1px solid #e2e8f0;
}

.eyebrow[b-x8ld5em4dj] {
    font-size: 0.85rem;
    text-transform: uppercase;
    letter-spacing: 2px;
    font-weight: 700;
    color: #d32f2f;
    margin-bottom: 0.5rem;
    display: block;
}

.admin-header h1[b-x8ld5em4dj] {
    font-family: 'Segoe UI', sans-serif;
    font-size: 2.5rem;
    font-weight: 800;
    margin: 0;
    line-height: 1;
}

.action-btn[b-x8ld5em4dj] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.75rem 1.5rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.95rem;
    text-decoration: none;
    transition: all 0.2s;
    cursor: pointer;
}

.action-btn.small[b-x8ld5em4dj] {
    padding: 0.4rem 1rem;
    font-size: 0.85rem;
}

.action-btn.outline[b-x8ld5em4dj] {
    background: transparent;
    border: 2px solid #cbd5e1;
    color: #64748b;
}

.action-btn.outline:hover[b-x8ld5em4dj] {
    border-color: #1a3c5e;
    color: #1a3c5e;
}

.action-btn.primary[b-x8ld5em4dj] {
    background: #1a3c5e;
    color: white;
    border: none;
    min-width: 160px;
}

.action-btn.primary:hover:not(:disabled)[b-x8ld5em4dj] {
    background: #0f2438;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(26, 60, 94, 0.2);
}

.action-btn.primary:disabled[b-x8ld5em4dj] {
    opacity: 0.7;
    cursor: not-allowed;
}

/* Notifications */
.notification[b-x8ld5em4dj] {
    padding: 1rem 1.5rem;
    border-radius: 8px;
    margin-bottom: 2rem;
    display: flex;
    align-items: center;
    gap: 12px;
    font-weight: 500;
}

.notification .icon[b-x8ld5em4dj] {
    font-size: 1.2rem;
}

.notification.success[b-x8ld5em4dj] {
    background: #ecfdf5;
    color: #047857;
    border: 1px solid #a7f3d0;
}

.notification.error[b-x8ld5em4dj] {
    background: #fef2f2;
    color: #b91c1c;
    border: 1px solid #fecaca;
}

/* Editor Layout */
.editor-layout[b-x8ld5em4dj] {
    display: grid;
    grid-template-columns: 1fr 1fr; /* 50/50 split for better preview width */
    gap: 3rem;
    margin-bottom: 4rem;
}

.editor-panel[b-x8ld5em4dj], .preview-panel[b-x8ld5em4dj] {
    min-width: 0; /* Prevent overflow */
}

.panel-header[b-x8ld5em4dj] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.5rem;
}

.panel-header h2[b-x8ld5em4dj] {
    font-size: 1.25rem;
    color: #334155;
    margin: 0;
    font-weight: 700;
}

/* Form Styling */
.admin-form[b-x8ld5em4dj] {
    background: white;
    padding: 2rem;
    border-radius: 12px;
    border: 1px solid #e2e8f0;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05);
}

.form-group[b-x8ld5em4dj] {
    margin-bottom: 1.5rem;
}

.form-row[b-x8ld5em4dj] {
    display: flex;
    gap: 1.5rem;
}

.form-group.half[b-x8ld5em4dj] {
    flex: 1;
}

.form-group label[b-x8ld5em4dj] {
    display: block;
    font-size: 0.9rem;
    font-weight: 600;
    color: #475569;
    margin-bottom: 0.5rem;
}

.form-control[b-x8ld5em4dj] {
    width: 100%;
    padding: 0.75rem 1rem;
    border: 1px solid #cbd5e1;
    border-radius: 6px;
    font-family: inherit;
    font-size: 1rem;
    transition: all 0.2s;
    background: #f8fafc;
}

.form-control:focus[b-x8ld5em4dj] {
    outline: none;
    border-color: #1a3c5e;
    background: white;
    box-shadow: 0 0 0 3px rgba(26, 60, 94, 0.1);
}

.form-control.tall[b-x8ld5em4dj] {
    resize: vertical;
    min-height: 200px;
}

.hint[b-x8ld5em4dj] {
    display: block;
    font-size: 0.8rem;
    color: #94a3b8;
    margin-top: 0.4rem;
    text-align: right;
}

/* Custom File Upload */
.file-upload-wrapper[b-x8ld5em4dj] {
    position: relative;
    overflow: hidden;
}

.file-input[b-x8ld5em4dj] {
    position: absolute;
    top: 0; left: 0; width: 100%; height: 100%;
    opacity: 0;
    cursor: pointer;
    z-index: 2;
}

.file-upload-ui[b-x8ld5em4dj] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.75rem 1rem;
    border: 2px dashed #cbd5e1;
    border-radius: 6px;
    background: #f8fafc;
    transition: all 0.2s;
}

.file-input:hover + .file-upload-ui[b-x8ld5em4dj] {
    border-color: #1a3c5e;
    background: #f1f5f9;
}

.file-placeholder[b-x8ld5em4dj] { color: #64748b; }
.file-name[b-x8ld5em4dj] { font-weight: 500; color: #1a3c5e; }
.file-action[b-x8ld5em4dj] { color: #d32f2f; font-weight: 600; font-size: 0.9rem; }

.form-actions[b-x8ld5em4dj] {
    margin-top: 2rem;
    display: flex;
    justify-content: flex-end;
}

/* Preview Panel & Blog Row Styling */
.preview-panel[b-x8ld5em4dj] {
    position: sticky;
    top: 2rem;
    height: fit-content;
}

.preview-canvas[b-x8ld5em4dj] {
    background: #ffffff; /* White background to mimic page */
    border-radius: 12px;
    padding: 2rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    border: 1px solid #e2e8f0;
    /* Simulate container constraints */
    container-type: inline-size;
}

.preview-note[b-x8ld5em4dj] {
    margin-top: 2rem;
    color: #94a3b8;
    font-size: 0.85rem;
    font-style: italic;
    text-align: center;
}

/* BLOG ROW STYLES (Duplicated from Blog.razor.css for Preview) */
.blog-row[b-x8ld5em4dj] {
    display: flex;
    flex-direction: column; /* Default stack on small container */
    gap: 2rem;
    align-items: center;
    text-align: center;
    width: 100%;
}

@container (min-width: 500px) {
    .blog-row[b-x8ld5em4dj] {
        flex-direction: row; /* Side by side if space permits */
        text-align: left;
        align-items: center;
        gap: 2rem;
    }
    .blog-row.image-right .blog-content[b-x8ld5em4dj] { order: 1; }
    .blog-row.image-right .blog-image-wrapper[b-x8ld5em4dj] { order: 2; }
    
    .blog-content[b-x8ld5em4dj] { 
        align-items: flex-start; 
        text-align: left; 
    }
}

.blog-content[b-x8ld5em4dj] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

.meta-top[b-x8ld5em4dj] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    font-family: 'Segoe UI', sans-serif;
    font-size: 0.8rem;
    color: #d32f2f;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: 0.8rem;
}

@container (min-width: 500px) {
    .meta-top[b-x8ld5em4dj] {
        justify-content: flex-start;
        padding-left: 10px;
        border-left: 3px solid #d32f2f;
    }
}

.blog-title[b-x8ld5em4dj] {
    margin: 0 0 1rem 0;
    line-height: 1.1;
}

.blog-title a[b-x8ld5em4dj] {
    font-size: 1.8rem;
    font-weight: 800;
    color: #1a3c5e;
    text-decoration: none;
    pointer-events: none; /* Disable link in preview */
}

.blog-summary[b-x8ld5em4dj] {
    font-size: 1rem;
    color: #64748b;
    line-height: 1.6;
    margin-bottom: 1.5rem;
}

.read-more-btn[b-x8ld5em4dj] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 0.6rem 1.5rem;
    background: transparent;
    border: 2px solid #1a3c5e;
    color: #1a3c5e;
    border-radius: 50px;
    font-weight: 700;
    text-transform: uppercase;
    font-size: 0.8rem;
    letter-spacing: 1px;
    text-decoration: none;
    pointer-events: none;
}

.blog-image-wrapper[b-x8ld5em4dj] {
    flex: 1;
    position: relative;
    padding: 1rem; /* Space for accent */
    width: 100%;
    max-width: 400px;
}

.image-frame-clean[b-x8ld5em4dj] {
    position: relative;
    z-index: 2;
    border-radius: 4px;
    overflow: hidden;
    box-shadow: 0 15px 30px -8px rgba(0, 0, 0, 0.2);
    background: #fff;
    aspect-ratio: 4/3;
}

.blog-image[b-x8ld5em4dj] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.placeholder-box[b-x8ld5em4dj] {
    background: #e2e8f0;
    display: flex;
    align-items: center;
    justify-content: center;
}
.placeholder-box[b-x8ld5em4dj]::after {
    content: "Image";
    color: #94a3b8;
    font-weight: 600;
}

.image-accent-bg[b-x8ld5em4dj] {
    position: absolute;
    top: 0; left: 0;
    width: 100%;
    height: 100%;
    background: #f1f5f9;
    z-index: 1;
    transform: translate(-10px, -10px);
    border-radius: 4px;
}

.blog-image-wrapper[b-x8ld5em4dj]::after {
    content: "";
    position: absolute;
    bottom: -10px; right: -10px;
    width: 60px;
    height: 60px;
    border-right: 4px solid #d32f2f;
    border-bottom: 4px solid #d32f2f;
    z-index: 3;
}


/* Recent Posts Table */
.recent-posts-section[b-x8ld5em4dj] {
    background: white;
    border-radius: 12px;
    border: 1px solid #e2e8f0;
    padding: 2rem;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05);
}

.section-header h2[b-x8ld5em4dj] {
    font-size: 1.5rem;
    color: #1a3c5e;
    margin-bottom: 1.5rem;
    font-weight: 700;
}

.posts-table-wrapper[b-x8ld5em4dj] {
    overflow-x: auto;
}

.posts-table[b-x8ld5em4dj] {
    width: 100%;
    border-collapse: collapse;
}

.posts-table th[b-x8ld5em4dj] {
    text-align: left;
    font-size: 0.85rem;
    text-transform: uppercase;
    color: #64748b;
    font-weight: 600;
    padding-bottom: 1rem;
    border-bottom: 2px solid #e2e8f0;
}

.posts-table td[b-x8ld5em4dj] {
    padding: 1rem 0;
    border-bottom: 1px solid #f1f5f9;
    vertical-align: middle;
}

.posts-table tr:last-child td[b-x8ld5em4dj] {
    border-bottom: none;
}

.col-image[b-x8ld5em4dj] { width: 80px; }

.table-thumb[b-x8ld5em4dj] {
    width: 60px;
    height: 40px;
    border-radius: 4px;
    background-size: cover;
    background-position: center;
    background-color: #f1f5f9;
}

.col-title[b-x8ld5em4dj] { padding-right: 2rem; }

.title-text[b-x8ld5em4dj] {
    display: block;
    font-weight: 600;
    color: #1a3c5e;
    margin-bottom: 0.2rem;
}

.summary-text[b-x8ld5em4dj] {
    display: block;
    font-size: 0.85rem;
    color: #94a3b8;
}

.actions-cell[b-x8ld5em4dj] {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    align-items: center;
}

.table-action[b-x8ld5em4dj] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.4rem 0.8rem;
    border-radius: 6px;
    font-size: 0.85rem;
    font-weight: 600;
    text-decoration: none;
    transition: all 0.2s;
    border: 1px solid transparent;
    cursor: pointer;
}

.table-action.view[b-x8ld5em4dj] {
    color: #1a3c5e;
    background: #f1f5f9;
}
.table-action.view:hover[b-x8ld5em4dj] { background: #e2e8f0; }

.table-action.edit[b-x8ld5em4dj] {
    color: #0f172a;
    background: #fff;
    border-color: #cbd5e1;
}
.table-action.edit:hover[b-x8ld5em4dj] { border-color: #1a3c5e; }

.table-action.delete[b-x8ld5em4dj] {
    color: #b91c1c;
    background: #fff;
    border-color: #fca5a5;
}
.table-action.delete:hover[b-x8ld5em4dj] { 
    background: #fef2f2; 
    border-color: #ef4444; 
}

.empty-table[b-x8ld5em4dj] {
    text-align: center;
    padding: 3rem;
    color: #94a3b8;
}

/* Responsive */
@media (max-width: 992px) {
    .editor-layout[b-x8ld5em4dj] {
        grid-template-columns: 1fr;
    }
    
    .form-row[b-x8ld5em4dj] {
        flex-direction: column;
        gap: 0;
    }
}
/* /Components/Pages/Admin/Bookings.razor.rz.scp.css */
/* Admin Dashboard Command Center */
.admin-dashboard[b-tuxn3b57dg] {
    padding: 2rem 0 5rem;
    background-color: #f8fafc;
    min-height: 100vh;
    font-family: system-ui, -apple-system, "Segoe UI", sans-serif;
}

.saza-container[b-tuxn3b57dg] {
    max-width: 1600px; /* Wide for side-by-side */
    margin: 0 auto;
    padding: 0 24px;
}

.dashboard-layout[b-tuxn3b57dg] {
    display: grid;
    grid-template-columns: 1fr 400px;
    gap: 30px;
    height: calc(100vh - 120px); /* Fill screen minus header */
}

/* === LEFT: CALENDAR PANEL === */
.calendar-panel[b-tuxn3b57dg] {
    background: #ffffff;
    border-radius: 24px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.05);
    padding: 2rem;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.calendar-header[b-tuxn3b57dg] {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    margin-bottom: 2rem;
}

.header-left h1[b-tuxn3b57dg] {
    font-size: 1rem;
    text-transform: uppercase;
    color: #94a3b8;
    letter-spacing: 2px;
    margin: 0 0 0.5rem;
}

.month-nav[b-tuxn3b57dg] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.month-nav h2[b-tuxn3b57dg] {
    font-size: 2.2rem;
    font-weight: 800;
    color: #1a3c5e;
    margin: 0;
    line-height: 1;
}

.nav-btn[b-tuxn3b57dg], .btn-today[b-tuxn3b57dg] {
    background: #f1f5f9;
    border: none;
    padding: 8px 16px;
    border-radius: 8px;
    font-weight: 600;
    color: #475569;
    cursor: pointer;
    transition: all 0.2s;
}

.nav-btn:hover[b-tuxn3b57dg], .btn-today:hover[b-tuxn3b57dg] {
    background: #e2e8f0;
    color: #1a3c5e;
}

/* Visual Calendar Grid */
.visual-calendar[b-tuxn3b57dg] {
    flex: 1;
    display: flex;
    flex-direction: column;
}

.day-names[b-tuxn3b57dg] {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    text-align: right;
    padding-right: 10px;
    font-weight: 700;
    color: #94a3b8;
    text-transform: uppercase;
    font-size: 0.8rem;
    letter-spacing: 1px;
    margin-bottom: 10px;
}

.days-grid[b-tuxn3b57dg] {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 1px;
    background: #e2e8f0; /* Grid lines */
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    overflow: hidden;
    flex: 1;
}

.day-cell[b-tuxn3b57dg] {
    background: #ffffff;
    min-height: 100px;
    padding: 8px;
    display: flex;
    flex-direction: column;
    cursor: pointer;
    transition: background 0.2s;
    position: relative;
}

.day-cell:hover:not(.empty)[b-tuxn3b57dg] {
    background: #f8fafc;
}

.day-cell.selected[b-tuxn3b57dg] {
    background: #eff6ff; /* Light blue highlight */
    box-shadow: inset 0 0 0 2px #3b82f6;
    z-index: 2;
}

.day-cell.today .day-number[b-tuxn3b57dg] {
    background: #1a3c5e;
    color: white;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.day-number[b-tuxn3b57dg] {
    font-weight: 700;
    color: #64748b;
    font-size: 0.9rem;
    margin-bottom: 4px;
    align-self: flex-end;
}

/* Pills in Calendar */
.day-pills[b-tuxn3b57dg] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    overflow-y: auto;
}

.booking-pill[b-tuxn3b57dg] {
    font-size: 0.75rem;
    padding: 2px 6px;
    border-radius: 4px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-weight: 600;
}

.booking-pill.pending[b-tuxn3b57dg] { background: #fff7ed; color: #c2410c; border-left: 3px solid #f97316; }
.booking-pill.approved[b-tuxn3b57dg] { background: #ecfdf5; color: #15803d; border-left: 3px solid #22c55e; }
.booking-pill.unavailable[b-tuxn3b57dg] { background: #f1f5f9; color: #64748b; border-left: 3px solid #94a3b8; text-decoration: line-through; opacity: 0.7; }

/* === RIGHT: INSPECTOR PANEL === */
.inspector-panel[b-tuxn3b57dg] {
    background: #ffffff;
    border-radius: 24px;
    box-shadow: -10px 0 30px rgba(0,0,0,0.05);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border-left: 1px solid #f1f5f9;
}

.inspector-header[b-tuxn3b57dg] {
    padding: 1.5rem;
    border-bottom: 1px solid #f1f5f9;
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: #f8fafc;
}

.inspector-header h3[b-tuxn3b57dg] {
    margin: 0;
    font-size: 1.1rem;
    color: #1a3c5e;
    font-weight: 700;
}

.badge-count[b-tuxn3b57dg] {
    background: #d32f2f;
    color: white;
    padding: 2px 8px;
    border-radius: 10px;
    font-size: 0.75rem;
    font-weight: 700;
}

.btn-close-inspector[b-tuxn3b57dg] {
    background: transparent;
    border: none;
    font-size: 1.2rem;
    color: #94a3b8;
    cursor: pointer;
}

.inspector-content[b-tuxn3b57dg] {
    flex: 1;
    overflow-y: auto;
    padding: 1.5rem;
}

/* Empty States */
.empty-inbox[b-tuxn3b57dg], .empty-day-state[b-tuxn3b57dg] {
    text-align: center;
    padding: 3rem 1rem;
    color: #94a3b8;
}

.empty-inbox .icon[b-tuxn3b57dg] { font-size: 3rem; margin-bottom: 1rem; }
.empty-inbox p[b-tuxn3b57dg] { font-size: 1.2rem; color: #1a3c5e; margin-bottom: 0.5rem; font-weight: 600; }
.empty-inbox .sub[b-tuxn3b57dg] { font-size: 0.9rem; }

/* Cards in List */
.inbox-list[b-tuxn3b57dg] { display: flex; flex-direction: column; gap: 10px; }

.inbox-card[b-tuxn3b57dg] {
    background: white;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 1rem;
    cursor: pointer;
    transition: all 0.2s;
    display: grid;
    grid-template-columns: 50px 1fr auto;
    gap: 12px;
    align-items: center;
}

.inbox-card:hover[b-tuxn3b57dg] {
    border-color: #3b82f6;
    box-shadow: 0 4px 12px rgba(59, 130, 246, 0.1);
}

.inbox-date[b-tuxn3b57dg] {
    font-size: 0.75rem;
    font-weight: 700;
    text-align: center;
    color: #d32f2f;
    line-height: 1.2;
    text-transform: uppercase;
}

.inbox-info h4[b-tuxn3b57dg] { margin: 0 0 4px; font-size: 0.95rem; color: #0f172a; }
.truncate[b-tuxn3b57dg] { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 0.85rem; color: #64748b; margin: 0; }
.inbox-arrow[b-tuxn3b57dg] { color: #cbd5e1; font-weight: 700; }

/* Detail View */
.booking-detail-card[b-tuxn3b57dg] {
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    padding: 1.5rem;
    margin-bottom: 1rem;
}

.booking-detail-card.pending[b-tuxn3b57dg] { border-left: 4px solid #f97316; }
.booking-detail-card.approved[b-tuxn3b57dg] { border-left: 4px solid #22c55e; }
.booking-detail-card.unavailable[b-tuxn3b57dg] { border-left: 4px solid #94a3b8; background: #f8fafc; }

.detail-header[b-tuxn3b57dg] {
    display: flex;
    justify-content: space-between;
    margin-bottom: 1rem;
}

.status-badge[b-tuxn3b57dg] {
    font-size: 0.75rem;
    text-transform: uppercase;
    font-weight: 700;
    padding: 4px 8px;
    border-radius: 4px;
}
.status-badge.pending[b-tuxn3b57dg] { background: #fff7ed; color: #c2410c; }
.status-badge.approved[b-tuxn3b57dg] { background: #ecfdf5; color: #15803d; }
.status-badge.unavailable[b-tuxn3b57dg] { background: #f1f5f9; color: #475569; }

.detail-time[b-tuxn3b57dg] { font-size: 0.85rem; color: #94a3b8; font-weight: 600; }

.booking-detail-card h4[b-tuxn3b57dg] { font-size: 1.2rem; margin-bottom: 0.5rem; color: #0f172a; }
.detail-desc[b-tuxn3b57dg] { font-size: 0.95rem; color: #475569; line-height: 1.5; margin-bottom: 1.5rem; }

.detail-contact[b-tuxn3b57dg] {
    background: #f8fafc;
    padding: 10px;
    border-radius: 8px;
    font-size: 0.9rem;
    color: #334155;
    margin-bottom: 1.5rem;
}

.detail-actions[b-tuxn3b57dg] {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

.delete-wrapper[b-tuxn3b57dg] {
    display: flex;
    gap: 10px;
}

.btn-approve[b-tuxn3b57dg], .btn-reject[b-tuxn3b57dg], .btn-unblock[b-tuxn3b57dg], .btn-block-day[b-tuxn3b57dg], .btn-add-block[b-tuxn3b57dg], .btn-reset-pending[b-tuxn3b57dg], .btn-delete[b-tuxn3b57dg], .btn-confirm-delete[b-tuxn3b57dg], .btn-cancel-delete[b-tuxn3b57dg] {
    padding: 10px 16px;
    border-radius: 8px;
    border: none;
    font-weight: 600;
    cursor: pointer;
    font-size: 0.9rem;
    transition: opacity 0.2s;
}

.btn-approve[b-tuxn3b57dg] { background: #10b981; color: white; }
.btn-reject[b-tuxn3b57dg] { background: #ef4444; color: white; }
.btn-reset-pending[b-tuxn3b57dg] { background: #f59e0b; color: white; } /* Orange */

.btn-delete[b-tuxn3b57dg] { 
    background: transparent; 
    border: 1px solid #fee2e2; 
    color: #ef4444; 
}
.btn-delete:hover[b-tuxn3b57dg] { background: #fef2f2; }

.btn-confirm-delete[b-tuxn3b57dg] { background: #dc2626; color: white; animation: pulse-b-tuxn3b57dg 1s infinite; }
.btn-cancel-delete[b-tuxn3b57dg] { background: #e5e7eb; color: #374151; }

.btn-unblock[b-tuxn3b57dg] { background: white; border: 1px solid #cbd5e1; color: #64748b; }
.btn-block-day[b-tuxn3b57dg] { background: #f1f5f9; color: #475569; border: 1px dashed #cbd5e1; width: 100%; padding: 1rem; }
.btn-block-day:hover[b-tuxn3b57dg] { border-color: #94a3b8; background: #e2e8f0; }
.btn-add-block[b-tuxn3b57dg] { background: #1a3c5e; color: white; width: 100%; }

@keyframes pulse-b-tuxn3b57dg {
    0% { transform: scale(1); }
    50% { transform: scale(1.05); }
    100% { transform: scale(1); }
}

/* Responsive */
@media (max-width: 992px) {
    .dashboard-layout[b-tuxn3b57dg] {
        grid-template-columns: 1fr;
        height: auto;
    }
    
    .inspector-panel[b-tuxn3b57dg] {
        border-left: none;
        border-top: 1px solid #f1f5f9;
        min-height: 500px;
    }
}
/* /Components/Pages/Blog.razor.rz.scp.css */
.blog-page-container[b-nflpne3cqr] {
    max-width: 1200px;
    margin: 0 auto;
    padding: 6rem 2rem 8rem;
}

/* Headers matching Home Page */
.header-section[b-nflpne3cqr] {
    text-align: center;
    margin-bottom: 6rem;
}

.section-cursive-title[b-nflpne3cqr] {
    font-family: 'Great Vibes', cursive;
    font-weight: normal;
    color: #80d8ff;
    font-size: 4rem;
    margin-bottom: 0.5rem;
    letter-spacing: 2px;
}

.section-bold-subtitle[b-nflpne3cqr] {
    font-family: 'Segoe UI', sans-serif;
    font-weight: 900;
    font-size: 2.5rem;
    text-transform: uppercase;
    color: #1a3c5e;
    margin-bottom: 1rem;
}

/* Decoration matching Home Page */
.section-decoration[b-nflpne3cqr] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 15px;
}

.section-decoration .line[b-nflpne3cqr] {
    width: 80px;
    height: 2px;
    background-color: #1a3c5e;
    border-radius: 2px;
}

.section-decoration .fish-icon[b-nflpne3cqr] {
    height: 60px;
    width: auto;
    object-fit: contain;
}

/* Blog Rows */
.blog-list[b-nflpne3cqr] {
    display: flex;
    flex-direction: column;
    gap: 8rem; /* Large spacing between posts */
}

.blog-row[b-nflpne3cqr] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 5rem;
    align-items: center;
}

.blog-row.image-right .blog-content[b-nflpne3cqr] {
    order: 1;
}
.blog-row.image-right .blog-image-wrapper[b-nflpne3cqr] {
    order: 2;
}

.blog-row.image-left .blog-content[b-nflpne3cqr] {
    order: 2;
}
.blog-row.image-left .blog-image-wrapper[b-nflpne3cqr] {
    order: 1;
}

/* Blog Content Side */
.blog-content[b-nflpne3cqr] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    text-align: left;
}

.meta-top[b-nflpne3cqr] {
    display: flex;
    align-items: center;
    gap: 10px;
    font-family: 'Segoe UI', sans-serif;
    font-size: 0.9rem;
    color: #d32f2f; /* Accent color */
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    margin-bottom: 1rem;
    position: relative;
    padding-left: 12px;
    border-left: 3px solid #d32f2f;
}

.meta-sep[b-nflpne3cqr] {
    color: #cbd5e1;
    font-weight: 400;
}

.blog-title[b-nflpne3cqr] {
    margin: 0 0 1.5rem 0;
    line-height: 1.1;
}

.blog-title a[b-nflpne3cqr] {
    font-size: 2.5rem;
    font-weight: 800;
    color: #1a3c5e;
    text-decoration: none;
    transition: color 0.3s ease;
}

.blog-title a:hover[b-nflpne3cqr] {
    color: #80d8ff;
}

.blog-summary[b-nflpne3cqr] {
    font-size: 1.15rem;
    color: #64748b;
    line-height: 1.7;
    margin-bottom: 2rem;
}

.read-more-btn[b-nflpne3cqr] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 0.8rem 2rem;
    background: transparent;
    border: 2px solid #1a3c5e;
    color: #1a3c5e;
    border-radius: 50px;
    font-weight: 700;
    text-transform: uppercase;
    font-size: 0.9rem;
    letter-spacing: 1px;
    text-decoration: none;
    transition: all 0.3s ease;
}

.read-more-btn:hover[b-nflpne3cqr] {
    background: #1a3c5e;
    color: #ffffff;
    transform: translateY(-3px);
    box-shadow: 0 10px 20px rgba(26, 60, 94, 0.15);
}

/* Fancy Image Wrapper (Ported from About) */
.blog-image-wrapper[b-nflpne3cqr] {
    position: relative;
    padding: 2rem; /* Space for accents */
    /* Center it if simpler */
    margin: 0 auto;
    width: 100%;
    max-width: 550px;
}

.image-frame-clean[b-nflpne3cqr] {
    position: relative;
    z-index: 2;
    border-radius: 4px;
    overflow: hidden;
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
    background: #fff;
    aspect-ratio: 4/3; /* Consistent aspect ratio */
}

.blog-image[b-nflpne3cqr] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.7s ease;
}

.image-frame-clean:hover .blog-image[b-nflpne3cqr] {
    transform: scale(1.05);
}

.image-accent-bg[b-nflpne3cqr] {
    position: absolute;
    top: 0; left: 0;
    width: 100%;
    height: 100%;
    background: #f1f5f9;
    z-index: 1;
    transform: translate(-15px, -15px);
    border-radius: 4px;
}

/* Corner Accent */
.blog-image-wrapper[b-nflpne3cqr]::after {
    content: "";
    position: absolute;
    bottom: -15px; right: -15px;
    width: 100px;
    height: 100px;
    border-right: 4px solid #d32f2f;
    border-bottom: 4px solid #d32f2f;
    z-index: 3;
}


/* Skeleton & Empty States */
.blog-grid-skeleton[b-nflpne3cqr] {
    display: flex;
    flex-direction: column;
    gap: 4rem;
}

.skeleton-row[b-nflpne3cqr] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 4rem;
    align-items: center;
}

.skeleton-img[b-nflpne3cqr] {
    width: 100%;
    aspect-ratio: 4/3;
    background: #e2e8f0;
    border-radius: 8px;
}

.skeleton-txt[b-nflpne3cqr] {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.sk-line[b-nflpne3cqr] { height: 16px; background: #e2e8f0; border-radius: 4px; }
.sk-title[b-nflpne3cqr] { height: 40px; width: 70%; background: #e2e8f0; border-radius: 4px; }

/* Responsive */
@media (max-width: 992px) {
    .blog-row[b-nflpne3cqr] {
        grid-template-columns: 1fr;
        gap: 3rem;
        text-align: center;
    }
    
    .blog-row.image-left .blog-content[b-nflpne3cqr],
    .blog-row.image-right .blog-content[b-nflpne3cqr] {
        order: 2;
    }

    .blog-row.image-left .blog-image-wrapper[b-nflpne3cqr],
    .blog-row.image-right .blog-image-wrapper[b-nflpne3cqr] {
        order: 1;
    }

    .blog-content[b-nflpne3cqr] {
        align-items: center;
        text-align: center;
    }

    .meta-top[b-nflpne3cqr] {
        border-left: none;
        padding-left: 0;
        justify-content: center;
    }

    .section-cursive-title[b-nflpne3cqr] {
        font-size: 3rem;
    }
}
/* /Components/Pages/BlogDetails.razor.rz.scp.css */
/* Modern Editorial Blog Details */

.blog-post-container[b-om1pol8mop] {
    padding-bottom: 8rem;
    background: #ffffff;
    color: #334155;
}

/* Header Section */
.post-header[b-om1pol8mop] {
    padding: 6rem 1rem 4rem;
    text-align: center;
    max-width: 900px;
    margin: 0 auto;
}

.post-meta-top[b-om1pol8mop] {
    font-family: 'Segoe UI', sans-serif;
    font-size: 0.9rem;
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: #d32f2f;
    margin-bottom: 1.5rem;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 15px;
}

.post-title[b-om1pol8mop] {
    font-family: 'Segoe UI', sans-serif; /* Or a serif if available */
    font-size: 3.5rem;
    font-weight: 800;
    color: #1a3c5e;
    line-height: 1.1;
    margin-bottom: 1.5rem;
    letter-spacing: -1px;
}

.post-author-line[b-om1pol8mop] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    font-size: 1rem;
    color: #64748b;
}

.author-avatar[b-om1pol8mop] {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: #cbd5e1;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: bold;
    color: #fff;
    font-size: 0.8rem;
}

/* Featured Image */
.featured-image-container[b-om1pol8mop] {
    max-width: 1100px;
    margin: 0 auto 5rem;
    padding: 0 1.5rem;
}

.featured-image-wrapper[b-om1pol8mop] {
    position: relative;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 20px 40px -10px rgba(0,0,0,0.15);
    aspect-ratio: 16/9;
}

.featured-image[b-om1pol8mop] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* Content Area */
.post-content-body[b-om1pol8mop] {
    max-width: 740px; /* Optimal reading width */
    margin: 0 auto;
    padding: 0 1.5rem;
    font-family: 'Segoe UI', sans-serif; /* Fallback to system fonts */
    font-size: 1.15rem;
    line-height: 1.8;
    color: #334155;
}

/* Content Typography (targets HTML likely injected via rich text editor) */
[b-om1pol8mop] h2 {
    font-size: 2rem;
    color: #1a3c5e;
    margin: 3rem 0 1.5rem;
    font-weight: 700;
    line-height: 1.2;
}

[b-om1pol8mop] h3 {
    font-size: 1.5rem;
    color: #1a3c5e;
    margin: 2.5rem 0 1rem;
    font-weight: 600;
}

[b-om1pol8mop] p {
    margin-bottom: 1.5rem;
}

[b-om1pol8mop] ul, [b-om1pol8mop] ol {
    margin-bottom: 1.5rem;
    padding-left: 1.5rem;
}

[b-om1pol8mop] li {
    margin-bottom: 0.5rem;
}

[b-om1pol8mop] blockquote {
    border-left: 4px solid #d32f2f;
    padding-left: 1.5rem;
    margin: 2.5rem 0;
    font-style: italic;
    font-size: 1.35rem;
    color: #1e293b;
    background: #f8fafc;
    padding: 2rem;
    border-radius: 0 8px 8px 0;
}

[b-om1pol8mop] img {
    max-width: 100%;
    height: auto;
    border-radius: 8px;
    margin: 2rem 0;
    display: block;
}

/* Back/Nav */
.post-footer[b-om1pol8mop] {
    max-width: 740px;
    margin: 6rem auto 0;
    padding: 3rem 1.5rem 0;
    border-top: 1px solid #e2e8f0;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.back-btn[b-om1pol8mop] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #64748b;
    text-decoration: none;
    font-weight: 600;
    transition: color 0.2s;
}

.back-btn:hover[b-om1pol8mop] {
    color: #1a3c5e;
}

/* Loading States */
.loading-container[b-om1pol8mop] {
    max-width: 800px;
    margin: 6rem auto;
    padding: 0 2rem;
    text-align: center;
}
.skeleton-title[b-om1pol8mop] {
    height: 60px;
    background: #e2e8f0;
    border-radius: 8px;
    margin-bottom: 1rem;
}
.skeleton-line[b-om1pol8mop] {
    height: 16px;
    background: #f1f5f9;
    border-radius: 4px;
    margin-bottom: 1rem;
    width: 100%;
}

/* Empty State */
.not-found-container[b-om1pol8mop] {
    text-align: center;
    padding: 8rem 2rem;
    color: #64748b;
}

@media (max-width: 768px) {
    .post-title[b-om1pol8mop] {
        font-size: 2.5rem;
    }
    .post-header[b-om1pol8mop] {
        padding: 4rem 1rem 3rem;
    }
    .featured-image-container[b-om1pol8mop] {
        padding: 0;
    }
    .featured-image-wrapper[b-om1pol8mop] {
        border-radius: 0; /* Full bleed on mobile */
    }
}
/* /Components/Pages/Book.razor.rz.scp.css */
/* BOOKING PAGE STYLES (Grand/Sexy) */

/* Hero Section */
.book-hero[b-86g4xi4c4w] {
    height: 50vh;
    min-height: 350px;
    background-image: url('images/Gallery/I39.jpeg'); /* Use a good action shot */
    background-size: cover;
    background-position: center 20%;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    color: white;
}

.hero-overlay[b-86g4xi4c4w] {
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background: linear-gradient(rgba(15, 23, 42, 0.6), rgba(15, 23, 42, 0.9));
    backdrop-filter: blur(3px);
}

.hero-content[b-86g4xi4c4w] {
    position: relative;
    z-index: 2;
}

.hero-title[b-86g4xi4c4w] {
    font-family: 'Segoe UI', sans-serif;
    font-size: 4rem;
    font-weight: 800;
    margin-bottom: 0.5rem;
    text-transform: uppercase;
    letter-spacing: -1px;
    text-shadow: 0 4px 20px rgba(0,0,0,0.5);
}

.hero-subtitle[b-86g4xi4c4w] {
    font-size: 1.4rem;
    font-weight: 300;
    opacity: 0.9;
    letter-spacing: 1px;
}

/* Content Container */
.book-content[b-86g4xi4c4w] {
    margin-top: -6rem; /* Overlap Hero */
    margin-bottom: 6rem;
    position: relative;
    z-index: 5;
}

/* Main Card */
.booking-card[b-86g4xi4c4w] {
    background: #ffffff;
    border-radius: 30px;
    box-shadow: 
        0 30px 60px -12px rgba(15, 23, 42, 0.25),
        0 0 0 1px rgba(0,0,0,0.02);
    overflow: hidden;
    padding: 0;
}

.booking-grid[b-86g4xi4c4w] {
    display: grid;
    grid-template-columns: 1fr 1.5fr;
    min-height: 600px;
}

/* Date Column (Left) */
.date-column[b-86g4xi4c4w] {
    background: linear-gradient(145deg, #0f172a 0%, #1e293b 100%);
    color: white;
    padding: 3rem;
    display: flex;
    flex-direction: column;
    position: relative;
    overflow: hidden;
}

/* Duration Selector */
.duration-selector[b-86g4xi4c4w] {
    margin-bottom: 2rem;
    position: relative;
    z-index: 2;
}

.duration-label[b-86g4xi4c4w] {
    display: block;
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: #94a3b8;
    margin-bottom: 0.8rem;
    font-weight: 700;
}

.toggle-switch[b-86g4xi4c4w] {
    background: rgba(255, 255, 255, 0.1);
    border-radius: 12px;
    padding: 4px;
    display: flex;
    gap: 4px;
}

.toggle-btn[b-86g4xi4c4w] {
    flex: 1;
    background: transparent;
    border: none;
    color: #cbd5e1;
    padding: 10px;
    border-radius: 8px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s ease;
    font-size: 0.9rem;
}

.toggle-btn:hover[b-86g4xi4c4w] {
    color: white;
}

.toggle-btn.active[b-86g4xi4c4w] {
    background: #d32f2f;
    color: white;
    box-shadow: 0 4px 12px rgba(0,0,0,0.2);
}

/* Custom Calendar */
.custom-calendar[b-86g4xi4c4w] {
    background: rgba(255,255,255,0.05);
    border-radius: 20px;
    padding: 1.5rem;
    position: relative;
    z-index: 2;
    border: 1px solid rgba(255,255,255,0.1);
}

.calendar-header[b-86g4xi4c4w] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.5rem;
    font-weight: 700;
    font-size: 1.1rem;
}

.calendar-header button[b-86g4xi4c4w] {
    background: transparent;
    border: none;
    color: #e2e8f0;
    font-size: 1.2rem;
    cursor: pointer;
    padding: 5px 10px;
    transition: color 0.2s;
}

.calendar-header button:hover[b-86g4xi4c4w] {
    color: #d32f2f;
}

.calendar-days-header[b-86g4xi4c4w] {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    text-align: center;
    font-size: 0.8rem;
    color: #64748b;
    margin-bottom: 0.8rem;
    font-weight: 700;
}

.calendar-grid[b-86g4xi4c4w] {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    row-gap: 8px;
}

.day[b-86g4xi4c4w] {
    aspect-ratio: 1;
    background: transparent;
    border: none;
    color: #e2e8f0;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    cursor: pointer;
    font-size: 0.95rem;
    transition: all 0.2s;
    margin: 2px;
}

.day:hover:not(.disabled)[b-86g4xi4c4w] {
    background: rgba(255,255,255,0.1);
    color: white;
}

.day.selected[b-86g4xi4c4w] {
    background: #d32f2f !important;
    color: white !important;
    box-shadow: 0 4px 10px rgba(211, 47, 47, 0.4);
    transform: scale(1.1);
    font-weight: 700;
}

.day.in-range[b-86g4xi4c4w] {
    background: rgba(211, 47, 47, 0.2);
    color: white;
    border-radius: 0; /* Connects them visually */
    margin: 2px 0; /* Remove horizontal gap */
}

/* Optional: Round the ends of range */
/* This requires complex logic or nth-child selectors that depend on state, 
   simpler to just have them square-ish or slightly rounded */

.day.booked[b-86g4xi4c4w] {
    text-decoration: line-through;
    opacity: 0.3 !important;
    background: rgba(255, 255, 255, 0.05);
    cursor: not-allowed;
    color: #94a3b8;
}

.day.disabled[b-86g4xi4c4w] {
    color: #475569;
    cursor: not-allowed;
    opacity: 0.5;
}

.selected-summary[b-86g4xi4c4w] {
    margin-top: 2rem;
    text-align: center;
    color: #cbd5e1;
    font-size: 0.95rem;
    background: rgba(0,0,0,0.2);
    padding: 1rem;
    border-radius: 12px;
}

.selected-summary strong[b-86g4xi4c4w] {
    color: #fff;
    color: #fbbf24;
}

/* Rest of styles remain ... */
/* Texture for Date Col */
.date-column[b-86g4xi4c4w]::before {
    content: "";
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background-image: radial-gradient(circle at 100% 0%, rgba(255,255,255,0.05) 0%, transparent 50%);
    pointer-events: none;
}

/* Reuse existing details column styles, just update date-picker-wrapper removal */
/* ... */

/* Details Column (Right) */
.details-column[b-86g4xi4c4w] {
    padding: 4rem 3rem;
    background: #ffffff;
}

.section-title[b-86g4xi4c4w] {
    font-size: 2rem;
    font-weight: 800;
    margin-bottom: 0.5rem;
    color: inherit; /* White in left col, Dark in right due to context */
}

.details-column .section-title[b-86g4xi4c4w] {
    color: #1a3c5e;
}

.section-desc[b-86g4xi4c4w] {
    font-size: 1.1rem;
    opacity: 0.8;
    margin-bottom: 2rem;
}

.details-column .section-desc[b-86g4xi4c4w] {
    color: #64748b;
}

.form-group[b-86g4xi4c4w] {
    margin-bottom: 1.5rem;
}

.form-group-row[b-86g4xi4c4w] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
}

.form-group label[b-86g4xi4c4w] {
    display: block;
    font-size: 0.85rem;
    font-weight: 700;
    color: #64748b;
    margin-bottom: 0.5rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.form-control[b-86g4xi4c4w] {
    width: 100%;
    padding: 1rem 1.2rem;
    border-radius: 12px;
    border: 2px solid #f1f5f9;
    font-size: 1rem;
    background: #f8fafc;
    transition: all 0.2s;
}

.form-control:focus[b-86g4xi4c4w] {
    outline: none;
    border-color: #1a3c5e;
    background: white;
    box-shadow: 0 4px 12px rgba(26, 60, 94, 0.1);
}

.book-btn[b-86g4xi4c4w] {
    width: 100%;
    padding: 1.2rem;
    background: linear-gradient(135deg, #1a3c5e 0%, #0f172a 100%);
    color: white;
    border: none;
    border-radius: 14px;
    font-size: 1.1rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    cursor: pointer;
    transition: all 0.3s;
    margin-top: 1rem;
    box-shadow: 0 10px 20px rgba(15, 23, 42, 0.2);
}

.book-btn:hover:not(:disabled)[b-86g4xi4c4w] {
    transform: translateY(-3px);
    background: linear-gradient(135deg, #d32f2f 0%, #b91c1c 100%);
    box-shadow: 0 15px 30px rgba(211, 47, 47, 0.3);
}

.book-btn:disabled[b-86g4xi4c4w] {
    opacity: 0.7;
    cursor: not-allowed;
}

/* Success State */
.success-message[b-86g4xi4c4w] {
    padding: 6rem;
    text-align: center;
    color: #1a3c5e;
}

.success-icon[b-86g4xi4c4w] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100px;
    height: 100px;
    background: #dcfce7;
    color: #16a34a;
    border-radius: 50%;
    margin-bottom: 2rem;
    animation: popIn-b-86g4xi4c4w 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

@keyframes popIn-b-86g4xi4c4w {
    0% { transform: scale(0); opacity: 0; }
    80% { transform: scale(1.1); opacity: 1; }
    100% { transform: scale(1); }
}

.success-message h2[b-86g4xi4c4w] {
    font-size: 2.5rem;
    margin-bottom: 1rem;
    font-weight: 800;
}

.success-message p[b-86g4xi4c4w] {
    font-size: 1.2rem;
    color: #64748b;
    max-width: 500px;
    margin: 0 auto 3rem;
}

.btn-reset[b-86g4xi4c4w] {
    background: transparent;
    border: 2px solid #e2e8f0;
    padding: 0.8rem 2rem;
    border-radius: 50px;
    font-weight: 600;
    color: #64748b;
    cursor: pointer;
    transition: all 0.2s;
}

.btn-reset:hover[b-86g4xi4c4w] {
    border-color: #1a3c5e;
    color: #1a3c5e;
}

/* Responsive */
@media (max-width: 992px) {
    .booking-grid[b-86g4xi4c4w] {
        grid-template-columns: 1fr;
    }
    
    .date-column[b-86g4xi4c4w] {
        padding: 3rem 2rem;
    }
    
    .details-column[b-86g4xi4c4w] {
        padding: 3rem 2rem;
    }
    
    .hero-title[b-86g4xi4c4w] {
        font-size: 3rem;
    }
}
/* /Components/Pages/Contact.razor.rz.scp.css */
/* Contact Page Styles (Premium) */
.contact-header[b-ke5jdzaan3] {
    background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
    color: white;
    padding: 6rem 0 5rem;
    text-align: center;
    position: relative;
    overflow: hidden;
}

/* Geometric Pattern Overlay */
.contact-header[b-ke5jdzaan3]::before {
    content: "";
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background-image: 
        linear-gradient(45deg, rgba(255,255,255,0.03) 25%, transparent 25%), 
        linear-gradient(-45deg, rgba(255,255,255,0.03) 25%, transparent 25%), 
        linear-gradient(45deg, transparent 75%, rgba(255,255,255,0.03) 75%), 
        linear-gradient(-45deg, transparent 75%, rgba(255,255,255,0.03) 75%);
    background-size: 40px 40px;
    pointer-events: none;
}

.contact-header h1[b-ke5jdzaan3] {
    font-size: 3.5rem;
    font-weight: 800;
    margin-bottom: 1rem;
    font-family: 'Segoe UI', sans-serif;
    letter-spacing: -1px;
    position: relative;
    z-index: 2;
}

.contact-header p[b-ke5jdzaan3] {
    font-size: 1.25rem;
    color: #cbd5e1;
    max-width: 600px;
    margin: 0 auto;
    font-weight: 400;
    position: relative;
    z-index: 2;
}

.contact-content[b-ke5jdzaan3] {
    margin-top: -4rem; /* Deeper overlap */
    margin-bottom: 6rem;
    position: relative;
    z-index: 5;
}

.contact-grid[b-ke5jdzaan3] {
    display: grid;
    grid-template-columns: 1.6fr 1fr;
    gap: 40px; /* More breathing room */
}

/* Form Card */
.contact-form-card[b-ke5jdzaan3] {
    background: #ffffff;
    border-radius: 24px;
    padding: 3.5rem;
    box-shadow: 
        0 25px 50px -12px rgba(0, 0, 0, 0.1),
        0 0 0 1px rgba(0,0,0,0.02); /* Subtle border */
}

.contact-form-card h2[b-ke5jdzaan3] {
    font-size: 2rem;
    color: #1e293b;
    margin-bottom: 2.5rem;
    font-weight: 800;
    letter-spacing: -0.5px;
}

.form-group[b-ke5jdzaan3] {
    margin-bottom: 1.8rem;
}

.form-group label[b-ke5jdzaan3] {
    display: block;
    font-weight: 700;
    color: #334155;
    margin-bottom: 0.6rem;
    font-size: 0.9rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.form-control[b-ke5jdzaan3] {
    width: 100%;
    padding: 14px 18px;
    border-radius: 12px;
    border: 2px solid #f1f5f9; /* Thicker, lighter border */
    font-size: 1rem;
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
    background: #f8fafc;
    color: #0f172a;
}

.form-control:focus[b-ke5jdzaan3] {
    outline: none;
    border-color: #d32f2f; /* Brand Accent Focus */
    background: #ffffff;
    box-shadow: 0 4px 12px rgba(211, 47, 47, 0.1);
}

.form-control[b-ke5jdzaan3]::placeholder {
    color: #94a3b8;
}

.submit-btn[b-ke5jdzaan3] {
    width: 100%;
    padding: 16px;
    background: linear-gradient(135deg, #d32f2f 0%, #b91c1c 100%);
    color: white;
    border: none;
    border-radius: 14px;
    font-size: 1.1rem;
    font-weight: 700;
    cursor: pointer;
    transition: all 0.3s ease;
    margin-top: 1.5rem;
    box-shadow: 0 10px 20px -5px rgba(211, 47, 47, 0.4);
    text-transform: uppercase;
    letter-spacing: 1px;
}

.submit-btn:hover:not(:disabled)[b-ke5jdzaan3] {
    transform: translateY(-2px);
    box-shadow: 0 15px 30px -5px rgba(211, 47, 47, 0.5);
}

.submit-btn:disabled[b-ke5jdzaan3] {
    background: #cbd5e1;
    color: #f1f5f9;
    box-shadow: none;
    cursor: not-allowed;
}

/* Success Alert */
.alert-success[b-ke5jdzaan3] {
    background: #ecfdf5;
    border: 1px solid #6ee7b7;
    border-radius: 16px;
    padding: 2rem;
    display: flex;
    gap: 1.2rem;
    align-items: flex-start;
    color: #065f46;
    animation: fadeIn-b-ke5jdzaan3 0.5s ease-out;
}

@keyframes fadeIn-b-ke5jdzaan3 {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
}

.alert-success svg[b-ke5jdzaan3] {
    flex-shrink: 0;
    color: #10b981;
}

/* Info Card */
.contact-info-card[b-ke5jdzaan3] {
    background: linear-gradient(145deg, #1e293b 0%, #0f172a 100%); /* Richer Dark Gradient */
    color: white;
    border-radius: 24px;
    padding: 3.5rem;
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
    display: flex;
    flex-direction: column;
    position: relative;
    overflow: hidden;
}

/* Subtle inner glow */
.contact-info-card[b-ke5jdzaan3]::after {
    content: "";
    position: absolute;
    top: 0; right: 0;
    width: 300px;
    height: 300px;
    background: radial-gradient(circle, rgba(255,255,255,0.05) 0%, transparent 70%);
    border-radius: 50%;
    transform: translate(30%, -30%);
    pointer-events: none;
}

.contact-info-card h3[b-ke5jdzaan3] {
    font-size: 1.6rem;
    margin-bottom: 1rem;
    font-weight: 800;
    font-family: 'Segoe UI', sans-serif;
    position: relative;
    z-index: 2;
}

.info-intro[b-ke5jdzaan3] {
    color: #cbd5e1;
    margin-bottom: 3rem;
    line-height: 1.7;
    font-size: 1.05rem;
    position: relative;
    z-index: 2;
}

.info-item[b-ke5jdzaan3] {
    display: flex;
    align-items: center; /* Center align icons vertically */
    gap: 18px;
    margin-bottom: 2.2rem;
    position: relative;
    z-index: 2;
}

.icon-box[b-ke5jdzaan3] {
    background: rgba(255,255,255,0.1);
    width: 50px;
    height: 50px;
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    backdrop-filter: blur(5px);
    transition: all 0.3s ease;
    border: 1px solid rgba(255,255,255,0.05);
}

.info-item:hover .icon-box[b-ke5jdzaan3] {
    background: #d32f2f;
    transform: scale(1.1);
    box-shadow: 0 10px 20px rgba(0,0,0,0.2);
    border-color: transparent;
}

.info-item label[b-ke5jdzaan3] {
    display: block;
    font-size: 0.8rem;
    color: #94a3b8;
    margin-bottom: 4px;
    text-transform: uppercase;
    font-weight: 700;
    letter-spacing: 0.05em;
}

.info-item a[b-ke5jdzaan3], .info-item span[b-ke5jdzaan3] {
    color: white;
    font-size: 1.1rem;
    font-weight: 600;
    text-decoration: none;
    letter-spacing: 0.5px;
}

.info-item a:hover[b-ke5jdzaan3] {
    color: #93c5fd; /* Light blue hover */
}

.social-section[b-ke5jdzaan3] {
    margin-top: auto;
    border-top: 1px solid rgba(255,255,255,0.1);
    padding-top: 2.5rem;
    position: relative;
    z-index: 2;
}

.social-section h4[b-ke5jdzaan3] {
    font-size: 0.9rem;
    margin-bottom: 1.2rem;
    color: #94a3b8;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    font-weight: 700;
}

.social-icons[b-ke5jdzaan3] {
    display: flex;
    gap: 16px;
}

.social-link[b-ke5jdzaan3] {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: rgba(255,255,255,0.08);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    border: 1px solid rgba(255,255,255,0.05);
}

.social-link:hover[b-ke5jdzaan3] {
    background: #ffffff;
    color: #0f172a;
    transform: translateY(-4px) scale(1.1);
    box-shadow: 0 10px 20px rgba(0,0,0,0.2);
}

/* Responsive */
@media (max-width: 992px) {
    .contact-grid[b-ke5jdzaan3] {
        grid-template-columns: 1fr;
    }

    .contact-info-card[b-ke5jdzaan3] {
        order: 1; /* Keep Form First */
        margin-top: 2rem;
    }
    
    .contact-header[b-ke5jdzaan3] {
        padding: 5rem 1rem 4rem;
    }
    
    .contact-header h1[b-ke5jdzaan3] {
        font-size: 2.5rem;
    }
}
/* /Components/Pages/Home.razor.rz.scp.css */
/* ... existing styles ... */
/* Keep hero-section, cloud-img, discover-section, saza-container, section-cursive-title, section-bold-subtitle, section-decoration */

:global(:root)[b-s4bs6b4zug] {
    --home-sky-start: #a9d6f2;
    --home-sky-end: #e3f4ff;
}

.hero-section[b-s4bs6b4zug] {
    background: linear-gradient(to bottom, var(--home-sky-start, #a9d6f2), var(--home-sky-end, #e3f4ff)); /* Slightly bluer sky */
    min-height: 85vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2rem;
    overflow: hidden;
    position: relative;
    color: #1a3c5e; /* Switch to dark blue text for contrast on light BG */
}

.hero-container[b-s4bs6b4zug] {
    display: flex;
    flex-direction: row;
    max-width: 1400px;
    width: 100%;
    gap: 2rem;
    align-items: center;
    position: relative;
}

.visuals-container[b-s4bs6b4zug] {
    flex: 1.2;
    position: relative;
    height: 600px;
    display: flex;
    align-items: flex-end;
    justify-content: center;
}

.ruben-img[b-s4bs6b4zug] {
    position: absolute;
    left: 2%; /* Slightly more left */
    bottom: 15%; /* Moved up significantly to sit "on" the water */
    height: 85%; /* Slightly larger */
    width: auto;
    z-index: 15;
    filter: drop-shadow(10px 10px 20px rgba(0,0,0,0.3));
}

.pond-img[b-s4bs6b4zug] {
    position: absolute;
    left: -60%; /* Shifted far left to center the curve */
    bottom: -150px; /* Pushed down to create a horizon */
    width: 200%; /* Massive scale */
    height: auto;
    max-width: none;
    z-index: 10;
}

.seagrass-1[b-s4bs6b4zug] {
    position: absolute;
    left: 42%;
    bottom: 90px; /* Upper layer */
    width: 130px;
    z-index: 11; /* Behind Bass (12) */
    opacity: 0.9;
    animation: sway-b-s4bs6b4zug 5s infinite ease-in-out alternate;
    transform-origin: bottom center;
}

.seagrass-2[b-s4bs6b4zug] {
    position: absolute;
    left: 60%;
    bottom: -10px;
    width: 160px;
    z-index: 13; /* Front */
    opacity: 0.95;
    animation: sway-b-s4bs6b4zug 7s infinite ease-in-out alternate-reverse;
    transform-origin: bottom center;
}

.seagrass-3[b-s4bs6b4zug] {
    position: absolute;
    left: -5%;
    bottom: -30px;
    width: 180px;
    z-index: 16; /* Very front */
    opacity: 1;
    animation: sway-b-s4bs6b4zug 6s infinite ease-in-out alternate 1s;
    transform-origin: bottom center;
}

.seagrass-4[b-s4bs6b4zug] {
    position: absolute;
    left: 80%;
    bottom: 80px; /* Moved up a lot */
    width: 200px;
    z-index: 13; /* Front */
    opacity: 0.8;
    animation: sway-b-s4bs6b4zug 8s infinite ease-in-out alternate-reverse 0.5s;
    transform-origin: bottom center;
}

.seagrass-5[b-s4bs6b4zug] {
    position: absolute;
    left: 28%; /* Right of Ruben */
    bottom: 70px; /* Upper layer */
    width: 120px;
    z-index: 11; /* Behind Bass (12) */
    opacity: 0.8;
    animation: sway-b-s4bs6b4zug 5.5s infinite ease-in-out alternate 2s;
    transform-origin: bottom center;
}

@keyframes sway-b-s4bs6b4zug {
    from { transform: rotate(-4deg); }
    to { transform: rotate(4deg); }
}

.bass-wrapper[b-s4bs6b4zug] {
    position: absolute;
    left: 50%;
    bottom: 0;
    z-index: 12; /* In front of upper seagrass (11), behind lower (13) */
    width: 180px;
    pointer-events: none;
}

.bass-img[b-s4bs6b4zug] {
    width: 100%;
    height: auto;
    animation: swimAndJump-b-s4bs6b4zug 10s infinite linear;
    filter: drop-shadow(5px 10px 10px rgba(0,0,0,0.2));
    transform-origin: center;
}

/* Complex Swim & Jump Animation */
@keyframes swimAndJump-b-s4bs6b4zug {
    /* Phase 1: Swim Right */
    0% {
        opacity: 0.7; /* Partially submerged */
        transform: translate(0, 0) scaleX(1);
    }
    15% {
        transform: translate(40px, -5px) scaleX(1);
    }
    
    /* Phase 2: Flip & Swim Left */
    15.1% {
        transform: translate(40px, -5px) scaleX(-1); /* Instant Flip */
    }
    35% {
        transform: translate(-40px, 5px) scaleX(-1);
    }
    
    /* Phase 3: Flip Back & Prepare */
    35.1% {
        transform: translate(-40px, 5px) scaleX(1); /* Flip back */
    }
    40% {
        opacity: 1; /* Surface */
        transform: translate(-40px, 20px) rotate(-10deg) scaleX(1); /* Coil/Dip */
    }

    /* Phase 4: The Jump */
    55% {
        transform: translate(10px, -180px) rotate(-30deg) scaleX(1); /* Peak Ascent */
    }
    
    /* Phase 5: Air Wiggle (The "Something") */
    60% {
        transform: translate(25px, -190px) rotate(10deg) scaleX(1); /* Flop Right */
    }
    65% {
        transform: translate(40px, -180px) rotate(-10deg) scaleX(1); /* Flop Left */
    }

    /* Phase 6: Landing */
    80% {
        opacity: 1;
        transform: translate(100px, 50px) rotate(45deg) scaleX(1); /* Entry */
    }
    
    /* Phase 7: Disappear & Reset */
    85% {
        opacity: 0;
        transform: translate(120px, 100px) rotate(60deg) scaleX(1);
    }
    100% {
        opacity: 0;
        transform: translate(0, 0) scaleX(1);
    }
}

.content-container[b-s4bs6b4zug] {
    flex: 0.9;
    padding: 2rem 2rem 2rem 14rem; /* Further increased left padding for accent */
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    position: relative;
    z-index: 20;
}

.accent-border[b-s4bs6b4zug] {
    position: absolute;
    left: 12rem; /* Adjusted to match new padding */
    top: 15%;
    bottom: 15%;
    width: 4px;
    background: linear-gradient(to bottom, #d32f2f, #1a3c5e);
    border-radius: 4px;
}

.tagline[b-s4bs6b4zug] {
    font-size: 0.9rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 3px;
    color: #78909c;
    margin-bottom: 1.5rem;
    display: block;
    font-family: 'Segoe UI', sans-serif;
}

.headline[b-s4bs6b4zug] {
    font-size: 3rem;
    line-height: 1.1;
    color: #1a3c5e;
    margin-bottom: 3rem;
    font-family: 'Segoe UI', sans-serif;
}

.headline .light[b-s4bs6b4zug] {
    display: block;
    font-weight: 300; /* Light/Thin */
    margin-bottom: 0.2rem;
}

.headline .gradient-pop[b-s4bs6b4zug] {
    display: block;
    font-weight: 900; /* Extra Bold */
    font-size: 4rem; /* Pop Size */
    margin-top: 0.5rem;
    background: linear-gradient(135deg, #b71c1c 0%, #1a3c5e 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent; /* Gradient text magic */
    filter: drop-shadow(0px 2px 4px rgba(0,0,0,0.1)); /* Subtle depth */
}

.cta-button[b-s4bs6b4zug] {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 1rem 3rem;
    background: linear-gradient(135deg, #d32f2f 0%, #b71c1c 100%);
    color: white;
    text-decoration: none;
    font-weight: 600;
    border-radius: 50px; /* Full pill */
    transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275); /* Bouncy transition */
    box-shadow: 0 10px 25px rgba(211, 47, 47, 0.3);
    text-transform: uppercase;
    letter-spacing: 1px;
    font-size: 0.95rem;
}

.cta-button:hover[b-s4bs6b4zug] {
    transform: translateY(-4px) scale(1.02);
    box-shadow: 0 15px 30px rgba(211, 47, 47, 0.4);
}

.arrow-icon[b-s4bs6b4zug] {
    transition: transform 0.3s ease;
}

.cta-button:hover .arrow-icon[b-s4bs6b4zug] {
    transform: translateX(5px);
}

/* Hero mobile layout */
@media (max-width: 640px) {
    .hero-section[b-s4bs6b4zug] {
        min-height: auto;
        padding: 2.25rem 1rem 2rem;
    }

    .hero-container[b-s4bs6b4zug] {
        flex-direction: column;
        gap: 1.25rem;
        align-items: stretch;
    }

    .visuals-container[b-s4bs6b4zug] {
        order: 2;
        height: min(44vh, 360px);
        min-height: 260px;
        margin-top: -0.75rem;
    }

    /* Center the hero artwork so Ruben + pond stay in frame */
    .pond-img[b-s4bs6b4zug] {
        left: 50%;
        bottom: -130px;
        width: 165%;
        transform: translateX(-50%);
    }

    /* Reduce visual clutter and keep grass from covering content */
    .seagrass-1[b-s4bs6b4zug] { left: 56%; bottom: 35px; width: 90px; }
    .seagrass-2[b-s4bs6b4zug] { left: 72%; bottom: -15px; width: 100px; }
    .seagrass-3[b-s4bs6b4zug] { display: none; }
    .seagrass-4[b-s4bs6b4zug] { display: none; }
    .seagrass-5[b-s4bs6b4zug] { display: none; }

    .bass-wrapper[b-s4bs6b4zug] {
        left: 58%;
        bottom: -12px;
        width: 130px;
    }

    .content-container[b-s4bs6b4zug] {
        order: 1;
        padding: 1rem 0.75rem 0.25rem;
        margin-top: 1.15rem;
        align-items: center;
        text-align: center;
    }

    .accent-border[b-s4bs6b4zug] { display: none; }

    .tagline[b-s4bs6b4zug] {
        letter-spacing: 1.5px;
        margin-bottom: 1rem;
    }

    .headline[b-s4bs6b4zug] {
        font-size: 2.2rem;
        margin-top: 0.5rem;
        margin-bottom: 1.5rem;
    }

    .headline .gradient-pop[b-s4bs6b4zug] {
        font-size: 3.1rem;
    }

    .cta-button[b-s4bs6b4zug] {
        width: 100%;
        max-width: 320px;
        justify-content: center;
        padding: 0.95rem 1.5rem;
    }
}

@media (max-width: 480px) {
    .visuals-container[b-s4bs6b4zug] {
        min-height: 240px;
        height: min(42vh, 320px);
        margin-top: -0.5rem;
    }

    .pond-img[b-s4bs6b4zug] {
        width: 175%;
        bottom: -155px;
    }

    .bass-wrapper[b-s4bs6b4zug] {
        bottom: -16px;
        width: 120px;
    }

    .headline[b-s4bs6b4zug] { font-size: 1.95rem; }
    .headline .gradient-pop[b-s4bs6b4zug] { font-size: 2.8rem; }
}

/* Hero artwork tuning for tablet/small widths (keep pond from dominating) */
@media (min-width: 641px) and (max-width: 992px) {
    .visuals-container[b-s4bs6b4zug] {
        height: min(52vh, 420px);
        min-height: 320px;
        margin-top: -0.25rem;
    }

    .pond-img[b-s4bs6b4zug] {
        left: -48%;
        transform: none;
        width: 165%;
        bottom: -115px;
    }

    .seagrass-1[b-s4bs6b4zug] { left: 54%; bottom: 18px; width: 70px; }
    .seagrass-2[b-s4bs6b4zug] { left: 70%; bottom: -18px; width: 78px; }
    .seagrass-4[b-s4bs6b4zug] { display: none; }
    .seagrass-5[b-s4bs6b4zug] { display: none; }

    .bass-wrapper[b-s4bs6b4zug] {
        left: 56%;
        bottom: -6px;
        width: 120px;
    }
}

@media (min-width: 993px) and (max-width: 1000px) {
    .pond-img[b-s4bs6b4zug] {
        width: 165%;
        left: -45%;
        bottom: -125px;
    }

    .seagrass-1[b-s4bs6b4zug] { width: 110px; }
    .seagrass-2[b-s4bs6b4zug] { width: 120px; }
    .seagrass-3[b-s4bs6b4zug] { width: 140px; }
    .seagrass-4[b-s4bs6b4zug] { width: 155px; }
    .seagrass-5[b-s4bs6b4zug] { width: 100px; }

    .bass-wrapper[b-s4bs6b4zug] { width: 160px; }
}

/* Hide hero tagline on mobile/tablet */
@media (max-width: 992px) {
    .hero-section .tagline[b-s4bs6b4zug] { display: none; }
}

.cloud-img[b-s4bs6b4zug] {
    position: absolute;
    z-index: 9;
    opacity: 0.7;
    pointer-events: none;
}

.cloud-1[b-s4bs6b4zug] {
    top: 5%;
    right: 5%;
    width: 250px;
    animation: floatCloud-b-s4bs6b4zug 25s infinite alternate ease-in-out;
}

.cloud-2[b-s4bs6b4zug] {
    top: 8%;
    bottom: auto;
    left: 1%;
    width: 180px;
    opacity: 0.6;
    animation: floatCloud-b-s4bs6b4zug 30s infinite alternate-reverse ease-in-out;
}

.cloud-3[b-s4bs6b4zug] {
    top: -5%;
    left: 35%;
    width: 350px;
    opacity: 0.4;
    animation: floatCloud-b-s4bs6b4zug 45s infinite alternate ease-in-out;
}

@keyframes floatCloud-b-s4bs6b4zug {
    from {
        transform: translateX(0);
    }
    to {
        transform: translateX(-80px);
    }
}

.discover-section[b-s4bs6b4zug] {
    padding: 6rem 2rem;
    background-color: #ffffff;
    text-align: center;
}

/* === SPONSORS SECTION ("Sexy" Modern) === */
.sponsors-section[b-s4bs6b4zug] {
    padding: 7rem 2rem 9rem;
    background: radial-gradient(circle at center top, #ffffff 0%, #f1f5f9 100%);
    text-align: center;
    overflow: hidden; /* For glow effects */
}

.section-label[b-s4bs6b4zug] {
    text-align: center;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.2em;
    font-weight: 800;
    color: #94a3b8;
    margin-bottom: 2rem;
    position: relative;
    display: inline-block;
}

.section-label[b-s4bs6b4zug]::after {
    content: "";
    display: block;
    width: 30px;
    height: 2px;
    background: #d32f2f;
    margin: 8px auto 0;
}

/* === MAIN FEATURE SPONSOR === */
.featured-sponsor-wrapper[b-s4bs6b4zug] {
    max-width: 1000px;
    margin: 0 auto 5rem;
    position: relative;
    perspective: 1000px;
}

/* Glow behind the card */
.featured-sponsor-wrapper[b-s4bs6b4zug]::before {
    content: "";
    position: absolute;
    top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    width: 110%; height: 110%;
    background: radial-gradient(circle, rgba(211, 47, 47, 0.05) 0%, transparent 60%);
    z-index: 0;
    pointer-events: none;
}

.featured-sponsor-card[b-s4bs6b4zug] {
    position: relative;
    display: flex;
    align-items: center;
    background: rgba(255, 255, 255, 0.95); /* Slightly more opaque for better pop */
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border-radius: 30px;
    padding: 0; /* Layout handled by children */
    text-decoration: none;
    color: inherit;
    box-shadow: 
        0 25px 50px -12px rgba(0,0,0,0.15), /* Stronger shadow by default */
        0 0 0 1px rgba(255, 255, 255, 0.5) inset;
    transition: transform 0.4s cubic-bezier(0.34, 1.56, 0.64, 1), box-shadow 0.4s ease;
    overflow: hidden;
    z-index: 1;
    border-bottom: 4px solid transparent; /* Prepare for border transition */
}

.featured-sponsor-card:hover[b-s4bs6b4zug] {
    transform: translateY(-8px) scale(1.01);
    box-shadow: 
        0 35px 70px -15px rgba(0,0,0,0.2),
        0 0 0 1px rgba(255, 255, 255, 0.8) inset;
    border-bottom-color: #d32f2f; /* Solid red line on hover, simpler than gradient sometimes */
}

/* Animated gradient border bottom (Optional, keeping existing or simplifying) */
.featured-sponsor-card[b-s4bs6b4zug]::after {
    content: "";
    position: absolute;
    bottom: 0; left: 0; width: 100%; height: 4px;
    background: linear-gradient(90deg, #d32f2f, #1a3c5e);
    opacity: 0.8; /* Visible by default now */
    transition: opacity 0.3s ease;
}

.featured-sponsor-card:hover[b-s4bs6b4zug]::after {
    opacity: 1;
}

.featured-logo-col[b-s4bs6b4zug] {
    flex: 0 0 45%;
    padding: 2rem; /* Reduced padding to give logo more room */
    background: #ffffff;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    min-height: 300px; /* Ensure height for big logo */
}

/* Diagonal slice separator */
.featured-logo-col[b-s4bs6b4zug]::after {
    content: "";
    position: absolute;
    top: 0; right: -30px; bottom: 0;
    width: 60px;
    background: #ffffff;
    transform: skewX(-10deg);
    z-index: 1;
}

.featured-logo[b-s4bs6b4zug] {
    max-width: 100%;
    max-height: 220px; /* MUCH Bigger */
    width: auto;
    object-fit: contain;
    position: relative;
    z-index: 2;
    transition: transform 0.5s ease;
    filter: drop-shadow(0 10px 20px rgba(0,0,0,0.15)); /* Add depth to the logo itself */
}

.featured-sponsor-card:hover .featured-logo[b-s4bs6b4zug] {
    transform: scale(1.08) rotate(-2deg);
}

.featured-content-col[b-s4bs6b4zug] {
    flex: 1;
    text-align: left;
    padding: 3rem 4rem 3rem 2rem;
    position: relative;
    z-index: 2;
}

.featured-name[b-s4bs6b4zug] {
    font-size: 2.2rem;
    font-weight: 800;
    color: #1a3c5e;
    margin-bottom: 0.5rem;
    letter-spacing: -1px;
    font-family: 'Segoe UI', sans-serif;
}

.featured-desc[b-s4bs6b4zug] {
    font-size: 1.05rem;
    color: #64748b;
    line-height: 1.6;
    margin-bottom: 2.5rem;
    font-weight: 500;
}

/* Premium Button Redesign */
.featured-link[b-s4bs6b4zug] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 1rem 2.5rem;
    background: linear-gradient(135deg, #1a3c5e 0%, #0f172a 100%);
    color: white;
    font-weight: 700;
    font-size: 0.95rem;
    border-radius: 50px;
    text-transform: uppercase;
    letter-spacing: 1px;
    transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    box-shadow: 0 10px 20px -5px rgba(15, 23, 42, 0.3);
    border: 1px solid rgba(255,255,255,0.1);
}

.featured-link:hover[b-s4bs6b4zug] {
    transform: translateY(-3px);
    box-shadow: 0 15px 30px -5px rgba(15, 23, 42, 0.4);
    background: linear-gradient(135deg, #d32f2f 0%, #b91c1c 100%); /* Red on hover */
    color: white;
    width: auto; /* Reset width override if any */
}

.featured-link span[b-s4bs6b4zug] {
    font-size: 1.2em;
    transition: transform 0.3s ease;
}

.featured-link:hover span[b-s4bs6b4zug] {
    transform: translateX(5px);
}

/* === PARTNERS ROW (Single Line) === */
.partners-wrapper[b-s4bs6b4zug] {
    max-width: 1400px;
    margin: 0 auto;
}

.partners-flex-row[b-s4bs6b4zug] {
    display: flex;
    flex-wrap: wrap; /* Allows wrapping on very small screens, but stays row on desktop */
    justify-content: center; /* Center them */
    align-items: stretch;
    gap: 20px;
}

.sponsor-card.mini-card[b-s4bs6b4zug] {
    flex: 1 1 180px; /* Base width, grow/shrink allowed */
    max-width: 220px; /* Don't get too wide */
    background: #ffffff;
    border-radius: 20px;
    padding: 1.5rem;
    text-decoration: none;
    color: inherit;
    box-shadow: 
        0 15px 30px -5px rgba(0,0,0,0.08), /* Deeper shadow by default */
        0 0 0 1px rgba(0,0,0,0.02);
    border: 1px solid transparent;
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    border-bottom: 4px solid transparent; /* Consistent with About page style */
}

.sponsor-card.mini-card:hover[b-s4bs6b4zug] {
    transform: translateY(-6px);
    box-shadow: 0 25px 50px -10px rgba(0,0,0,0.12);
    border-bottom-color: #d32f2f; /* Red bottom on hover */
    z-index: 2;
}

.mini-card .sponsor-logo-area[b-s4bs6b4zug] {
    height: 80px;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 1rem;
}

.mini-card .sponsor-logo[b-s4bs6b4zug] {
    max-width: 120px;
    max-height: 60px;
    width: auto;
    object-fit: contain;
    filter: none; /* No grayscale by default */
    opacity: 1; /* Full visibility by default */
    transition: all 0.4s ease;
}

.mini-card:hover .sponsor-logo[b-s4bs6b4zug] {
    transform: scale(1.1);
}

.mini-card .sponsor-details[b-s4bs6b4zug] {
    text-align: center;
}

.mini-card .sponsor-name[b-s4bs6b4zug] {
    font-size: 0.95rem;
    font-weight: 700;
    color: #334155;
    margin: 0;
}

.saza-container[b-s4bs6b4zug] {
    max-width: 1200px;
    margin: 0 auto;
}

.section-cursive-title[b-s4bs6b4zug] {
    font-family: 'Great Vibes', cursive;
    font-weight: normal;
    color: #80d8ff;
    font-size: 4rem;
    margin-bottom: 0.5rem;
    letter-spacing: 2px;
}

.section-bold-subtitle[b-s4bs6b4zug] {
    font-family: 'Segoe UI', sans-serif;
    font-weight: 900;
    font-size: 2.5rem;
    text-transform: uppercase;
    color: #1a3c5e;
    margin-bottom: 1rem;
}

.section-decoration[b-s4bs6b4zug] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 15px;
    margin-bottom: 3rem;
}

.section-decoration .line[b-s4bs6b4zug] {
    width: 80px;
    height: 2px;
    background-color: #1a3c5e;
    border-radius: 2px;
}

.section-decoration .fish-icon[b-s4bs6b4zug] {
    height: 60px;
    width: auto;
    object-fit: contain;
}

/* CAROUSEL */
.carousel-wrapper[b-s4bs6b4zug] {
    position: relative;
    width: 100%;
    margin-top: 2rem;
}

.carousel-window[b-s4bs6b4zug] {
    overflow: hidden;
    padding: 20px 0; /* Space for shadows */
}

.carousel-track[b-s4bs6b4zug] {
    display: flex;
    gap: 24px;
    transition: transform 0.5s cubic-bezier(0.25, 1, 0.5, 1);
}

.product-card[b-s4bs6b4zug] {
    flex: 0 0 300px; /* Fixed width cards */
    background: #fff;
    border-radius: 16px;
    position: relative;
    display: flex;
    flex-direction: column;
    text-decoration: none;
    color: inherit;
    transition: all 0.3s ease;
    box-shadow: 0 4px 15px rgba(0,0,0,0.05);
}

.product-card:hover[b-s4bs6b4zug] {
    transform: translateY(-8px);
    box-shadow: 0 20px 40px -10px rgba(0,0,0,0.1);
}

.media-wrapper[b-s4bs6b4zug] {
    position: relative;
    border-radius: 16px;
    overflow: hidden;
    aspect-ratio: 1;
    background: #f1f5f9;
    margin-bottom: 16px;
}

.media-wrapper img[b-s4bs6b4zug] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s ease;
}

.product-card:hover .media-wrapper img[b-s4bs6b4zug] {
    transform: scale(1.08);
}

.overlay-actions[b-s4bs6b4zug] {
    position: absolute;
    bottom: 16px;
    left: 0;
    right: 0;
    display: flex;
    justify-content: center;
    gap: 12px;
    opacity: 0;
    transform: translateY(20px);
    transition: all 0.3s ease;
}

.product-card:hover .overlay-actions[b-s4bs6b4zug] {
    opacity: 1;
    transform: translateY(0);
}

.icon-btn[b-s4bs6b4zug] {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: white;
    border: none;
    display: grid;
    place-items: center;
    cursor: pointer;
    font-size: 1.2rem;
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
    transition: all 0.2s;
    color: var(--store-ink);
}

.icon-btn:hover[b-s4bs6b4zug] {
    background: #1a3c5e;
    color: white;
    transform: scale(1.1);
}

.badge-sale[b-s4bs6b4zug] {
    position: absolute;
    top: 12px;
    right: 12px;
    background: #ef4444;
    color: white;
    font-size: 11px;
    font-weight: 700;
    padding: 4px 10px;
    border-radius: 20px;
    letter-spacing: 0.5px;
    z-index: 2;
}

.card-details[b-s4bs6b4zug] {
    text-align: center;
    padding: 0 16px 20px;
}

.card-title[b-s4bs6b4zug] {
    font-size: 1.1rem;
    font-weight: 700;
    color: #1a3c5e;
    margin: 0 0 4px;
}

.card-price[b-s4bs6b4zug] {
    font-size: 1rem;
    color: #64748b;
    font-weight: 500;
}

.card-price .sale[b-s4bs6b4zug] {
    color: #ef4444;
    font-weight: 700;
    margin-right: 6px;
}

.card-price .strike[b-s4bs6b4zug] {
    text-decoration: line-through;
    opacity: 0.6;
    font-size: 0.9em;
}

/* Nav Buttons */
.nav-btn[b-s4bs6b4zug] {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: white;
    border: 1px solid #e2e8f0;
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
    display: grid;
    place-items: center;
    cursor: pointer;
    z-index: 10;
    color: #1a3c5e;
    transition: all 0.2s;
}

.nav-btn:hover:not(:disabled)[b-s4bs6b4zug] {
    background: #1a3c5e;
    color: white;
    transform: translateY(-50%) scale(1.1);
}

.nav-btn:disabled[b-s4bs6b4zug] {
    opacity: 0.5;
    cursor: not-allowed;
}

.nav-prev[b-s4bs6b4zug] { left: -24px; }
.nav-next[b-s4bs6b4zug] { right: -24px; }

/* Carousel: touch-friendly on mobile (swipe) */
@media (max-width: 992px) {
    .carousel-window[b-s4bs6b4zug] {
        overflow-x: auto;
        overflow-y: visible;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
        padding: 8px 0 18px;
    }

    .carousel-window[b-s4bs6b4zug]::-webkit-scrollbar {
        display: none;
    }

    .carousel-track[b-s4bs6b4zug] {
        transform: none !important; /* override inline transform */
        transition: none;
        padding: 0 16px;
    }

    .product-card[b-s4bs6b4zug] {
        flex: 0 0 78vw;
        max-width: 340px;
        scroll-snap-align: center;
    }

    .nav-btn[b-s4bs6b4zug] {
        display: none;
    }
}

/* Book Me & Blog Styles (Restored/Unchanged) */
.book-me-section[b-s4bs6b4zug] {
    position: relative;
    background: linear-gradient(to bottom, var(--home-sky-start, #a9d6f2), var(--home-sky-end, #e3f4ff)); /* Match hero sky */
    padding: 8rem 2rem 10rem 2rem; /* Increased bottom padding for wave overlap space */
    text-align: center;
    clip-path: polygon(0 5vw, 100% 0, 100% 100%, 0 100%); /* Slant: Bottom Left to Top Right */
    margin-top: -5vw; /* Pull up to overlap slightly if needed, or just let it sit */
}

.book-me-section .content-wrapper[b-s4bs6b4zug] {
    max-width: 800px;
    margin: 0 auto;
    position: relative;
    z-index: 5;
}

.book-me-text[b-s4bs6b4zug] {
    font-size: 1.15rem;
    line-height: 1.8;
    color: #1a3c5e;
    margin-top: 2rem;
    margin-bottom: 4rem;
}

.wave-bottom[b-s4bs6b4zug] {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    line-height: 0;
}

.wave-bottom svg[b-s4bs6b4zug] {
    position: relative;
    display: block;
    width: calc(100% + 1.3px);
    height: 100px;
}

.blog-section[b-s4bs6b4zug] {
    padding: 6rem 2rem 8rem 2rem;
    background-color: #ffffff;
    text-align: center;
}

/* === NEW BLOG STYLES (Alternating Rows) === */

.blog-list[b-s4bs6b4zug] {
    display: flex;
    flex-direction: column;
    gap: 8rem; /* Large spacing between posts */
    margin-top: 4rem;
}

.blog-row[b-s4bs6b4zug] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 5rem;
    align-items: center;
    text-align: left; /* Reset text align from section center */
}

.blog-row.image-right .blog-content[b-s4bs6b4zug] {
    order: 1;
}
.blog-row.image-right .blog-image-wrapper[b-s4bs6b4zug] {
    order: 2;
}

.blog-row.image-left .blog-content[b-s4bs6b4zug] {
    order: 2;
}
.blog-row.image-left .blog-image-wrapper[b-s4bs6b4zug] {
    order: 1;
}

/* Blog Content Side */
.blog-content[b-s4bs6b4zug] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    text-align: left;
}

.meta-top[b-s4bs6b4zug] {
    display: flex;
    align-items: center;
    gap: 10px;
    font-family: 'Segoe UI', sans-serif;
    font-size: 0.9rem;
    color: #d32f2f; /* Accent color */
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    margin-bottom: 1rem;
    position: relative;
    padding-left: 12px;
    border-left: 3px solid #d32f2f;
}

.meta-sep[b-s4bs6b4zug] {
    color: #cbd5e1;
    font-weight: 400;
}

.blog-title[b-s4bs6b4zug] {
    margin: 0 0 1.5rem 0;
    line-height: 1.1;
}

.blog-title a[b-s4bs6b4zug] {
    font-size: 2.5rem;
    font-weight: 800;
    color: #1a3c5e;
    text-decoration: none;
    transition: color 0.3s ease;
}

.blog-title a:hover[b-s4bs6b4zug] {
    color: #80d8ff;
}

.blog-summary[b-s4bs6b4zug] {
    font-size: 1.15rem;
    color: #64748b;
    line-height: 1.7;
    margin-bottom: 2rem;
}

.read-more-btn[b-s4bs6b4zug] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 0.8rem 2rem;
    background: transparent;
    border: 2px solid #1a3c5e;
    color: #1a3c5e;
    border-radius: 50px;
    font-weight: 700;
    text-transform: uppercase;
    font-size: 0.9rem;
    letter-spacing: 1px;
    text-decoration: none;
    transition: all 0.3s ease;
}

.read-more-btn:hover[b-s4bs6b4zug] {
    background: #1a3c5e;
    color: #ffffff;
    transform: translateY(-3px);
    box-shadow: 0 10px 20px rgba(26, 60, 94, 0.15);
}

/* Fancy Image Wrapper (Ported from About) */
.blog-image-wrapper[b-s4bs6b4zug] {
    position: relative;
    padding: 2rem; /* Space for accents */
    /* Center it if simpler */
    margin: 0 auto;
    width: 100%;
    max-width: 550px;
}

.image-frame-clean[b-s4bs6b4zug] {
    position: relative;
    z-index: 2;
    border-radius: 4px;
    overflow: hidden;
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
    background: #fff;
    aspect-ratio: 4/3; /* Consistent aspect ratio */
}

.blog-image[b-s4bs6b4zug] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.7s ease;
}

.image-frame-clean:hover .blog-image[b-s4bs6b4zug] {
    transform: scale(1.05);
}

.image-accent-bg[b-s4bs6b4zug] {
    position: absolute;
    top: 0; left: 0;
    width: 100%;
    height: 100%;
    background: #f1f5f9;
    z-index: 1;
    transform: translate(-15px, -15px);
    border-radius: 4px;
}

/* Corner Accent */
.blog-image-wrapper[b-s4bs6b4zug]::after {
    content: "";
    position: absolute;
    bottom: -15px; right: -15px;
    width: 100px;
    height: 100px;
    border-right: 4px solid #d32f2f;
    border-bottom: 4px solid #d32f2f;
    z-index: 3;
}

.blog-cta-row[b-s4bs6b4zug] {
    margin-top: 5rem;
}

/* Mobile responsive */
@media (max-width: 992px) {
    /* ... existing mobile styles ... */
    
    .blog-row[b-s4bs6b4zug] {
        grid-template-columns: 1fr;
        gap: 3rem;
        text-align: center;
    }
    
    .blog-row.image-left .blog-content[b-s4bs6b4zug],
    .blog-row.image-right .blog-content[b-s4bs6b4zug] {
        order: 2;
    }

    .blog-row.image-left .blog-image-wrapper[b-s4bs6b4zug],
    .blog-row.image-right .blog-image-wrapper[b-s4bs6b4zug] {
        order: 1;
    }

    .blog-content[b-s4bs6b4zug] {
        align-items: center;
        text-align: center;
    }

    .meta-top[b-s4bs6b4zug] {
        border-left: none;
        padding-left: 0;
        justify-content: center;
    }

    .blog-title a[b-s4bs6b4zug] {
        font-size: 2rem;
    }
}

/* === ADOPTED ABOUT PAGE STYLES === */

.about-values-section[b-s4bs6b4zug] {
    background: linear-gradient(to bottom, #f8fafc, #f1f5f9);
    text-align: center;
    position: relative;
    padding: 8rem 0;
}

.about-values-header[b-s4bs6b4zug] {
    margin-bottom: 5rem;
}

.about-section-label[b-s4bs6b4zug] {
    display: inline-block;
    font-size: 0.85rem;
    color: #d32f2f;
    text-transform: uppercase;
    letter-spacing: 2px;
    font-weight: 800;
    margin-bottom: 1.5rem;
    position: relative;
    padding-left: 12px;
    border-left: 3px solid #d32f2f;
    text-align: left;
}

/* Center aligned variant for the header */
.about-values-header .about-section-label[b-s4bs6b4zug] {
    display: inline-block;
    border-left: none;
    border-bottom: 3px solid #d32f2f;
    padding-left: 0;
    padding-bottom: 5px;
}

.about-section-heading[b-s4bs6b4zug] {
    font-size: 3rem;
    color: #1a3c5e;
    font-weight: 800;
    margin-bottom: 2rem;
    line-height: 1.1;
    letter-spacing: -1px;
    font-family: 'Segoe UI', sans-serif;
}

@media (max-width: 992px) {
    .about-section-heading[b-s4bs6b4zug] {
        font-size: 2.5rem;
    }
}