/* =========================================================================
   MANF INFINITY LTD — Additional stylesheet (main.css)
   Enhancements: Google Font application, scroll reveal animations,
   sticky-header shrink, search form and misc polish. Loaded after style.css.
   ========================================================================= */

/* Apply the loaded Google Fonts (falls back to system fonts in style.css) */
body {
    font-family: 'Source Sans 3', 'Segoe UI', -apple-system, BlinkMacSystemFont, Arial, sans-serif;
}

h1, h2, h3, h4, h5, h6,
.site-title,
.service-card .icon,
.service-detail .num,
.error-404 .huge,
.stat-row .stat .num {
    font-family: 'Playfair Display', Georgia, 'Times New Roman', serif;
}

/* -------------------------------------------------------------------------
   Sticky header shrink effect
   ------------------------------------------------------------------------- */
.site-header {
    transition: box-shadow 0.3s ease, background 0.3s ease;
}
.site-header.is-scrolled {
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.4);
    background: rgba(28, 28, 28, 0.98);
    backdrop-filter: blur(6px);
}

/* -------------------------------------------------------------------------
   Scroll reveal animations
   ------------------------------------------------------------------------- */
.reveal {
    opacity: 0;
    transform: translateY(28px);
    transition: opacity 0.7s ease, transform 0.7s ease;
    will-change: opacity, transform;
}
.reveal.is-visible {
    opacity: 1;
    transform: translateY(0);
}

/* Stagger cards a little for a polished feel */
.services-grid .service-card:nth-child(2).reveal { transition-delay: 0.08s; }
.services-grid .service-card:nth-child(3).reveal { transition-delay: 0.16s; }
.services-grid .service-card:nth-child(4).reveal { transition-delay: 0.24s; }
.services-grid .service-card:nth-child(5).reveal { transition-delay: 0.32s; }

@media (prefers-reduced-motion: reduce) {
    .reveal {
        opacity: 1;
        transform: none;
        transition: none;
    }
    html { scroll-behavior: auto; }
}

/* -------------------------------------------------------------------------
   Search form (header widget / results)
   ------------------------------------------------------------------------- */
.search-form {
    display: flex;
    gap: 8px;
}
.search-form .search-field {
    flex: 1 1 auto;
}
.search-form .search-submit {
    flex: 0 0 auto;
    background: var(--gold);
    color: var(--ink);
    border: 2px solid var(--gold);
    padding: 0 22px;
    border-radius: 8px;
    font-weight: 700;
    cursor: pointer;
    transition: var(--transition);
}
.search-form .search-submit:hover {
    background: var(--gold-dark);
    border-color: var(--gold-dark);
    color: var(--white);
}

/* -------------------------------------------------------------------------
   Post cards in listings
   ------------------------------------------------------------------------- */
.card-post {
    background: #fff;
    border-radius: var(--radius);
    box-shadow: var(--shadow);
    padding: 30px;
    margin-bottom: 30px;
    transition: var(--transition);
}
.card-post:hover { box-shadow: var(--shadow-hover); }
.card-post .post-thumbnail { margin: -30px -30px 22px; }
.card-post .post-thumbnail img {
    border-radius: var(--radius) var(--radius) 0 0;
    width: 100%;
    object-fit: cover;
}

/* -------------------------------------------------------------------------
   Post navigation
   ------------------------------------------------------------------------- */
.post-navigation {
    display: flex;
    justify-content: space-between;
    gap: 20px;
    margin: 34px 0;
    flex-wrap: wrap;
}
.post-navigation a {
    display: block;
    background: var(--grey-light);
    padding: 14px 20px;
    border-radius: 8px;
    max-width: 48%;
    transition: var(--transition);
}
.post-navigation a:hover { background: var(--gold-light); }
.post-navigation .nav-subtitle {
    display: block;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: var(--grey);
}
.post-navigation .nav-title { font-weight: 700; color: var(--ink); }

/* -------------------------------------------------------------------------
   Comments
   ------------------------------------------------------------------------- */
.comments-area {
    margin-top: 40px;
    padding-top: 30px;
    border-top: 2px solid var(--grey-light);
}
.comment-list { list-style: none; padding: 0; }
.comment-list .comment { margin-bottom: 22px; }
.comment-body {
    background: #fff;
    padding: 20px;
    border-radius: var(--radius);
    box-shadow: var(--shadow);
}

/* -------------------------------------------------------------------------
   Fallback contact form spacing
   ------------------------------------------------------------------------- */
.manf-fallback-form label { font-weight: 600; display: block; }
.manf-fallback-form p { margin-bottom: 16px; }

/* -------------------------------------------------------------------------
   Utility
   ------------------------------------------------------------------------- */
.page-links { margin-top: 20px; font-weight: 700; }
.page-links a {
    display: inline-block;
    padding: 4px 12px;
    background: var(--grey-light);
    border-radius: 6px;
    margin: 0 4px;
}