/**
Theme Name: Jingrui Design Core
Author: Jingrui Design
Author URI: https://ray-shi.jingruidesign.com/
Description: 本專案為 靜睿設計所 (Jingrui Design Studio) 獨家構建的企業級 WordPress 子主題架構，旨在為所有客戶專案奠定堅實的數位地基。作為驅動網站的核心引擎，本系統深度整合了高規格的安全性防護、SEO 結構優化與極致的載入效能。

我們透過標準化的開發邏輯，有效解決父主題更新可能帶來的兼容性風險，確保長期運維的穩定性與擴充彈性。這不僅是一套程式碼，更是靜睿設計所貫徹「慢構」精神，將設計美學與技術工藝完美結合，對每一份交付品質的絕對承諾。
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: jingrui-design-core
Template: astra
*/





/**
 * ==============================================================================
 * Project: 宏祥會計師律師代書聯合事務所
 * Feature: 首頁六大選單區塊 - 品牌紅變色、上推與呼吸感動畫
 * ==============================================================================
 */

/* ------------------------------------------------------------------------------
 * 1. 選單連結外層 (a 標籤)：設定背景變色與位移動畫基準
 * ------------------------------------------------------------------------------ */
#in_menu_box a {
    transition: background-color 0.4s ease, transform 0.4s ease !important;
    overflow: hidden; /* 防止放大動畫超出身體 */
}

/* 確保內部元件預設有過場動畫 */
#in_menu_box .elementor-icon-box-title span,
#in_menu_box .elementor-icon-box-icon,
#in_menu_box svg {
    transition: all 0.4s cubic-bezier(0.25, 0.1, 0.25, 1) !important;
    will-change: transform, color, filter;
}

/* ------------------------------------------------------------------------------
 * 2. 【滑入效果】背景變紅、文字變白、上推位移
 * ------------------------------------------------------------------------------ */
#in_menu_box a:hover {
    /* 👇 【細節一】背景變成品牌點綴色：珊瑚磚紅 */
    background-color: #D2695E !important;
    
    /* 可依據 Elementor 設定，若需要可在此強制加上全域陰影保護色 */
    box-shadow: 0px 16px 32px rgba(210, 105, 94, 0.2) !important; 
}

/* 👇 【細節二】文字標題變成白色 */
#in_menu_box a:hover .elementor-icon-box-title span {
    color: #FFFFFF !important;
}

/* 【上推動畫】圖示外層上推 8px */
#in_menu_box a:hover .elementor-icon-box-icon {
    transform: translateY(-8px) !important;
}

/* ------------------------------------------------------------------------------
 * 3. 【SVG 強制白化】與 【呼吸感動畫】
 * ------------------------------------------------------------------------------ */
#in_menu_box a:hover .elementor-icon svg {
    /* 👇 【細節三：關鍵黑魔法】不管原色，強制將 SVG 變成純白色 */
    filter: brightness(0) invert(1) !important; 

    /* 【呼吸動畫】疊加無窮迴圈的呼吸感 (微幅縮放) */
    animation: svg-breathing 2s ease-in-out 0.1s infinite alternate !important;
}

/* ------------------------------------------------------------------------------
 * 4. 定義呼吸感動畫的 Keyframes (移除了紅色背景上的陰影，看起來更純粹)
 * ------------------------------------------------------------------------------ */
@keyframes svg-breathing {
    0% {
        transform: scale(1);
    }
    100% {
        transform: scale(1.05); /* 微幅放大 5%，展現律動生命力 */
    }
}





/**
 * ==============================================================================
 * Project: 宏祥會計師律師代書聯合事務所
 * Feature: 主選單強制覆蓋 (圖上字下 + 10%虛線分隔 + SVG強制白化 + 終極防禦干擾)
 * ==============================================================================
 */

/* ------------------------------------------------------------------------------
 * 1. 強制覆蓋原生排版：改為「圖上字下」
 * ------------------------------------------------------------------------------ */
#ast-desktop-header .main-header-menu .menu-item > .menu-link {
    display: flex !important;
    flex-direction: column !important; 
    align-items: center !important;
    justify-content: center !important;
    padding: 15px 25px !important; 
    line-height: 1.4 !important;
    text-decoration: none !important; 
    box-shadow: none !important;
}

/* 徹底隱藏 Astra 下拉小箭頭 */
#ast-desktop-header .main-header-menu .menu-item > .menu-link .ast-icon.icon-arrow {
    display: none !important;
}

/* ------------------------------------------------------------------------------
 * 2. 建立精緻分隔線 (10% 高度虛線)
 * ------------------------------------------------------------------------------ */
#ast-desktop-header .main-header-menu .menu-item {
    position: relative !important;
}

#ast-desktop-header .main-header-menu .menu-item:not(:last-child)::after {
    content: "";
    position: absolute !important;
    right: 0 !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 0px !important; 
    border-right: 1px dashed #EFECE5 !important; 
    height: 10% !important; 
    background-color: transparent !important;
    pointer-events: none !important;
}

/* ------------------------------------------------------------------------------
 * 3. 圖示佔位空間 (裝甲級防禦定位 + Mask 強制白化黑魔法)
 * ------------------------------------------------------------------------------ */
#ast-desktop-header .main-header-menu .menu-item > .menu-link::before,
#ast-desktop-header .main-header-menu .menu-item:hover > .menu-link::before {
    content: "";
    display: block !important;
    
    /* 解除 Astra 底線的 absolute 干擾 */
    position: relative !important;
    top: auto !important; left: auto !important; right: auto !important; bottom: auto !important;
    
    /* 鎖死寬高，防止 Astra Hover 變形 */
    width: 28px !important;
    height: 28px !important;
    min-width: 28px !important; 
    margin-bottom: 8px !important;
    margin-top: 0 !important; margin-left: 0 !important; margin-right: 0 !important;
    
    /* 👇 【強制白化】透過背景色填滿純白，搭配下方的 mask-image 切出形狀 */
    background-color: #FFFFFF !important; 
    
    border: none !important;
    box-shadow: none !important;
    
    /* 將背景圖改用 mask-image 處理 */
    -webkit-mask-size: contain !important;
    -webkit-mask-repeat: no-repeat !important;
    -webkit-mask-position: center !important;
    mask-size: contain !important;
    mask-repeat: no-repeat !important;
    mask-position: center !important;
    
    /* 只針對位移做平滑動畫，保持顏色不變 */
    transition: transform 0.3s cubic-bezier(0.25, 0.1, 0.25, 1) !important; 
}

/* ------------------------------------------------------------------------------
 * 4. 綁定各單元專屬圖示 (使用 mask-image 載入路徑)
 * ------------------------------------------------------------------------------ */
.icon_about > .menu-link::before { 
    -webkit-mask-image: url('images/menu/icon_about.svg') !important; 
    mask-image: url('images/menu/icon_about.svg') !important; 
}
.icon_team > .menu-link::before { 
    -webkit-mask-image: url('images/menu/icon_team.svg') !important; 
    mask-image: url('images/menu/icon_team.svg') !important; 
}
.icon_solutions > .menu-link::before { 
    -webkit-mask-image: url('images/menu/icon_solutions.svg') !important; 
    mask-image: url('images/menu/icon_solutions.svg') !important; 
}
.icon_global-network > .menu-link::before { 
    -webkit-mask-image: url('images/menu/icon_global-network.svg') !important; 
    mask-image: url('images/menu/icon_global-network.svg') !important; 
}
.icon_insights > .menu-link::before { 
    -webkit-mask-image: url('images/menu/icon_insights.svg') !important; 
    mask-image: url('images/menu/icon_insights.svg') !important; 
}
.icon_contact > .menu-link::before { 
    -webkit-mask-image: url('images/menu/icon_contact.svg') !important; 
    mask-image: url('images/menu/icon_contact.svg') !important; 
}

/* ------------------------------------------------------------------------------
 * 5. 滑鼠懸停互動 (Hover Effect)
 * ------------------------------------------------------------------------------ */
/* 滑入時只做 Y 軸上推，顏色維持白色不變 */
#ast-desktop-header .main-header-menu .menu-item:hover > .menu-link::before {
    transform: translateY(-4px) !important;
}






/* 當首頁「尚未」進入固定選單狀態時，隱藏最上方的桌機版靜態標頭 */
body.home:not(.ast-primary-sticky-header-active) #masthead #ast-desktop-header {
    display: none !important;
}

/* 若手機版一開始也要隱藏，捲動才出現，請加上這段 */
body.home:not(.ast-primary-sticky-header-active) #masthead #ast-mobile-header {
    display: none !important;
}

/*搜尋結果樣式優化*/







/**
 * ==============================================================================
 * Project: 宏祥會計師律師代書聯合事務所
 * Author: Ray Shih (施睿皇) - Jingrui Design Studio
 * Email: n8822314n@gmail.com
 * Contact: services@jingruidesign.com
 * Created: 2026-05-18 16:15
 * * Copyright (c) 2026 Jingrui Design Studio. All rights reserved.
 * * Unauthorized use, reproduction, or distribution is prohibited.
 * ==============================================================================
 */

/*
 * 更新日誌：
 * [2026-05-18 16:15 V1.0.6] 強化 SVG 權重，並引入 transform: scaleY() 作為控制斜率的絕對保險，解決高度無法改變的問題。
 * [2026-05-18 14:55 V1.0.5] 調整 SVG 遮罩比例。
 */

/* ------------------------------------------------------------------------------
 * 1. 核心容器：清除內距防裁切，並加上邊緣圓角
 * ------------------------------------------------------------------------------ */
#index_banner {
    position: relative !important;
    overflow: hidden !important;
    padding: 0 !important; 
    border-radius: 16px !important;
}

/* ------------------------------------------------------------------------------
 * 2. SVG 遮罩層絕對定位與包裝層淨空
 * ------------------------------------------------------------------------------ */
#index_banner .elementor-widget-html {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    z-index: 999 !important;
    pointer-events: none !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 0 !important; 
}

/* 防呆：確保 Elementor 內建容器不會干擾高度 */
#index_banner .elementor-widget-html .elementor-widget-container {
    height: auto !important;
    line-height: 0 !important;
}

/* ------------------------------------------------------------------------------
 * 4. RWD 平板版與手機版斷點設定
 * ------------------------------------------------------------------------------ */

@media screen and (max-width: 767px) {

    #index_banner {
        border-radius: 0 0 10px 10px !important;
    }
}










/**
 * ==============================================================================
 * Project: 宏祥會計師律師代書聯合事務所
 * Author: Ray Shih (施睿皇) - Jingrui Design Studio
 * Email: n8822314n@gmail.com
 * Contact: services@jingruidesign.com
 * Created: 2026-05-18 15:47
 * * Copyright (c) 2026 Jingrui Design Studio. All rights reserved.
 * * Unauthorized use, reproduction, or distribution is prohibited.
 * ==============================================================================
 */

/*
 * 更新日誌：
 * [2026-05-18 15:47 V1.0.0] 建立首頁 .index_banner_text 左至右循環跑馬燈動畫設定。
 */

/* ------------------------------------------------------------------------------
 * 1. 跑馬燈外層容器：隱藏溢出，強制文字維持單行
 * ------------------------------------------------------------------------------ */
.index_banner_text {
    overflow: hidden !important; /* 絕對防呆：裁切掉超出畫面的文字，避免下方跑出橫向卷軸 */
    white-space: nowrap !important; /* 強制文字不換行，保持長條狀 */
    width: 100%;
    display: flex;
    align-items: center;
}

/* ------------------------------------------------------------------------------
 * 2. 跑馬燈文本模組：綁定動畫與硬體加速
 * ------------------------------------------------------------------------------ */
.index_banner_text .elementor-widget-heading {
    display: inline-block;
    /* * 執行跑馬燈動畫 
     * 20s: 跑完一次的時間，數字越大速度越「慢」，可依喜好微調
     * linear: 勻速移動，確保過程中不會忽快忽慢
     * infinite: 無限循環
     */
    animation: marquee-ltr 120s linear infinite;
    will-change: transform; /* 提示瀏覽器啟用 GPU 硬體加速，讓滑動更絲滑 */
}

/* ------------------------------------------------------------------------------
 * 3. 定義由左至右 (Left to Right) 的動畫軌跡
 * ------------------------------------------------------------------------------ */
@keyframes marquee-ltr {
    0% {
        /* 從畫面最左側的「視線外」出發 (-100% 代表向左退一個文字本身的寬度) */
        transform: translateX(-100%);
    }
    100% {
        /* 移動到畫面最右側的「視線外」 (100vw 代表整個螢幕的寬度) */
        transform: translateX(100vw);
    }
}

/* ------------------------------------------------------------------------------
 * 4. (選用) 友善互動：滑鼠懸停時暫停跑馬燈
 * ------------------------------------------------------------------------------ */
.index_banner_text:hover .elementor-widget-heading {
    animation-play-state: paused; /* 讓使用者可以停下來看清楚文字 */
}







/* 1. 整個無結果區塊的置中與間距優化 */
.no-results.not-found .page-content {
    max-width: 600px;
    margin: 40px auto;
    padding: 30px;
    text-align: center;
}

/* 2. 提示文字的美化 (SEO 跳出率防護) */
.no-results.not-found .page-content p {
    font-size: 1.1rem;
    color: #555555;
    margin-bottom: 25px;
    line-height: 1.6;
}

/* 3. 搜尋表單容器改用 Flexbox 排版 */
.no-results.not-found .search-form {
    display: flex;
    align-items: center;
    position: relative;
    width: 100%;
    max-width: 500px;
    margin: 0 auto;
}

/* 4. 處理 Label 以填滿空間 */
.no-results.not-found .search-form label {
    width: 100%;
    margin: 0;
    position: relative;
    display: flex;
}

/* 5. 隱藏不必要的螢幕閱讀器文字，但不影響無障礙訪問 */
.no-results.not-found .search-form .screen-reader-text {
    border: 0;
    clip: rect(1px, 1px, 1px, 1px);
    clip-path: inset(50%);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
    word-wrap: normal !important;
}

/* 6. 搜尋輸入框美化 (Mac Safari 視覺優化) */
.no-results.not-found .search-field {
    width: 100%;
    padding: 15px 50px 15px 20px; /* 右側留空間給 SVG 按鈕 */
    font-size: 1rem;
    color: #333;
    background-color: #ffffff;
    border: 2px solid #eaeaea;
    border-radius: 30px;
    outline: none;
    transition: all 0.3s ease;
    -webkit-appearance: none; /* 移除 Safari 預設樣式 */
}

/* 延伸技術：使用 :focus-within 提升互動感 */
.no-results.not-found .search-field:focus {
    border-color: #4facfe;
    box-shadow: 0 0 0 3px rgba(79, 172, 254, 0.2);
}

/* 7. 內建 SVG 放大鏡按鈕美化 (絕對定位至右側) */
.no-results.not-found .search-form button.search-submit.ast-search-submit {
    position: absolute;
    right: 5px;
    top: 50%;
    transform: translateY(-50%);
    background: transparent;
    border: none;
    padding: 10px;
    cursor: pointer;
    color: #888;
    transition: color 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: none;
}

.no-results.not-found .search-form button.search-submit:hover {
    color: #4facfe;
}

.no-results.not-found .search-form button.search-submit svg {
    width: 20px;
    height: 20px;
    fill: currentColor;
}

/* 8. 隱藏 WP 預設多餘的醜陋 Submit 按鈕 */
.no-results.not-found .search-form > input[type="submit"] {
    display: none; /* 隱藏它，我們已經有 SVG 按鈕了 */
}