/* Styles that only apply to contact.html */

/* GLOBAL LIGHT THEME OVERRIDES */
        body, html, main, #content-block {
            background-color: #fbfaf7 !important; /* Warm Cream White */
            color: #333 !important;
        }

        /* --- Header Styles for Light Theme --- */
        #header, .header-main {
            background-color: #fbfaf7 !important;
        }

        /* Menu Links - Dark Text */
        nav .menu a {
            color: #222 !important;
            text-shadow: none !important;
            font-weight: 400;
            letter-spacing: 0.5px;
        }

        /* Header logo color */
        header .header-logo img,
        header .header-logo svg image {
            filter: brightness(0) saturate(100%) invert(78%) sepia(9%) saturate(210%) hue-rotate(353deg) brightness(95%) contrast(86%) !important;
        }

        /* Mobile Burger Menu - Dark */
        .burger-button div span {
            background-color: #222 !important;
        }

        /* --- Contact Page Specifics --- */
        .contact-section {
            padding: 140px 0 80px;
        }

        .contact-title {
            font-family: "Times New Roman", Times, serif; /* Elegant Serif */
            font-size: 56px;
            font-weight: 400;
            color: #1a1a1a;
            margin-bottom: 25px;
            letter-spacing: -1px;
        }

        .contact-desc {
            font-size: 16px;
            line-height: 1.8;
            color: #666; /* Softer grey for body text */
            margin-bottom: 60px;
            max-width: 480px;
            font-weight: 300;
        }

        /* Info Labels (Address, Contact) */
        .info-label {
            font-size: 18px;
            color: #1a1a1a;
            margin-bottom: 20px;
            font-weight: 500;
            font-family: sans-serif;
        }

        /* Info Content */
        .info-content {
            font-family: "Noto Serif TC", sans-serif;
            font-size: 15px;
            color: #666;
            line-height: 1.6;
            margin-bottom: 8px;
            font-weight: 300;
        }

        .info-content a {
            color: #666;
            text-decoration: none;
            transition: color 0.3s;
            border-bottom: 1px solid transparent;
        }

        .info-content a:hover {
            color: #000;
            border-bottom-color: #000;
        }

        /* Social Circles (contact page body section only) */
        .social-circles {
            display: flex;
            gap: 12px;
        }
        .social-circles a {
            display: flex;
            align-items: center;
            justify-content: center;
            width: 42px;
            height: 42px;
            border: 1px solid #333;
            border-radius: 50%;
            color: #333;
            text-decoration: none;
            transition: all 0.3s;
            font-size: 18px;
        }
        .social-circles a:hover {
            background-color: #333;
            color: #fff;
        }

        /* Image Styling */
        .contact-image-wrapper {
            position: relative;
            width: 100%;
            height: 600px; /* Taller presence */
            overflow: hidden;
            /* Curved bottom-left corner to match design */
            border-bottom-left-radius: 200px;
        }

        .contact-image-wrapper img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            display: block;
        }

        /* Responsive Fixes */
        @media (max-width: 991px) {
            .contact-title { font-size: 42px; }
            .contact-image-wrapper { height: 400px; margin-top: 40px; border-bottom-left-radius: 100px; }
        }
        @media (max-width: 575px) {
            .contact-section { padding: 130px 0 40px; }
            .contact-title { font-size: 28px !important; letter-spacing: 0; }
            .contact-desc { font-size: 14px; margin-bottom: 30px; }
            .info-label { font-size: 16px; }
            .info-content { font-size: 14px; }
            .contact-image-wrapper { height: 280px; border-bottom-left-radius: 60px; }
            .social-circles a { width: 36px; height: 36px; font-size: 16px; }
        }

        /* ===== Footer color to #c0b7b0 (same as your project styling) ===== */
        #footer,
        #footer p,
        #footer a,
        #footer i {
            color: #c0b7b0 !important;
        }
        #footer {
            border-top: 1px solid #c0b7b0 !important;
        }
        .back-to-top::after { display: none !important; }
#footer img {
            filter: brightness(0) saturate(100%) invert(78%) sepia(9%) saturate(210%) hue-rotate(353deg) brightness(95%) contrast(86%);
        }

/* Footer 3-column layout overrides */
#footer .social { justify-content: flex-end !important; }
#footer .footer-icon { display: flex; justify-content: center; }
@media (max-width: 767px) {
    #footer .social { justify-content: center !important; margin-top: 15px !important; }
    #footer .text-end { text-align: center !important; }
    #footer .footer-content-outer { justify-content: center; }
}

#footer .social a,
#footer .social-icon a {
    border-color: #c0b7b0 !important;
}
/* FIX: Force correct FA 6 Brands font for social icons */
#footer .fa-brands {
    font-family: "Font Awesome 6 Brands" !important;
    font-weight: 400 !important;
}