/*
 * 尚儀教育有聲雲－全前台共用頁首頁尾統一版
 * 以 2026-07-23 首頁 72px 單層頁首與深藍頁尾為唯一視覺基準。
 * 保留 header.ascx 原有登入、SSO、IP、書房、出版社及智慧推薦功能。
 */
:root{
    --sy-shell-blue:#073763;
    --sy-shell-blue-dark:#062b4d;
    --sy-shell-orange:#ff8500;
    --sy-shell-orange-dark:#d96a00;
    --sy-shell-border:#ead8bd;
}

.sy-index-legacy-header,
.sy-index-legacy-footer{display:none!important;}

/* V2b：首頁是真正的共用母版；一般頁不再另套一層網站外框。 */
html,body{max-width:100%!important;}
body{
    margin:0!important;
    background:#fffaf2!important;
    color:#263247;
    overflow-x:hidden!important;
}
body>form{
    width:100%!important;
    max-width:none!important;
    min-height:100vh!important;
    margin:0!important;
    padding:0!important;
}
body>form>.syh-v22:first-of-type{display:block!important;}
body>form>.syf-v23:last-of-type{display:block!important;}
.syh-v22+main,
.syh-v22~main{width:100%!important;max-width:none!important;}

.syh-v22{
    position:sticky!important;
    top:0!important;
    z-index:500!important;
    min-height:72px!important;
    background:rgba(255,255,255,.97)!important;
    box-shadow:0 6px 22px rgba(15,35,65,.08)!important;
    backdrop-filter:blur(12px);
    font-family:"Microsoft JhengHei","Noto Sans TC",Arial,sans-serif!important;
}
.syh-v22 *{box-sizing:border-box;}
.syh-v22-top{background:transparent!important;border:0!important;}
.syh-v22-top-inner{
    width:min(1180px,calc(100% - 40px))!important;
    max-width:1180px!important;
    height:72px!important;
    min-height:72px!important;
    margin:0 auto!important;
    padding:0!important;
    display:flex!important;
    align-items:center!important;
    gap:16px!important;
}
.syh-v22-brand{
    flex:0 0 auto!important;
    min-width:220px!important;
    margin:0!important;
}
.syh-v22-brand>a{display:flex!important;align-items:center!important;gap:10px!important;text-decoration:none!important;}
.syh-v22-logo-mark{
    width:38px!important;
    height:38px!important;
    display:grid!important;
    place-items:center!important;
    border:3px solid var(--sy-shell-orange)!important;
    border-radius:13px!important;
    background:#fff!important;
    color:var(--sy-shell-orange)!important;
    font-size:0!important;
    box-shadow:none!important;
}
.syh-v22-logo-mark:before{content:"☁";font-size:22px!important;line-height:1!important;}
.syh-v22-logo-mark i{display:none!important;}
.syh-v22-title{color:var(--sy-shell-blue)!important;font-size:25px!important;font-weight:900!important;letter-spacing:.02em!important;}
.syh-v22-subtitle{display:none!important;}
.syh-v22-search,
.syh-v22-search-toggle,
.syh-v22-actions .syh-v22-lite-link,
.syh-v22-actions .syh-v22-cta{display:none!important;}
.syh-v22-actions{order:3!important;margin-left:auto!important;display:flex!important;align-items:center!important;}
.syh-v22-member-toggle{
    min-height:42px!important;
    padding:9px 17px!important;
    border:1px solid #d9a35b!important;
    border-radius:999px!important;
    background:#fff!important;
    color:var(--sy-shell-blue)!important;
    font-weight:900!important;
}
.syh-v22-member-toggle:hover{border-color:var(--sy-shell-orange)!important;color:var(--sy-shell-orange-dark)!important;}
.syh-v22-nav-row{
    position:relative!important;
    flex:1 1 auto!important;
    min-width:0!important;
    order:2!important;
    border:0!important;
    background:transparent!important;
}
.syh-v22-nav{
    position:static!important;
    transform:none!important;
    width:100%!important;
    height:72px!important;
    display:flex!important;
    justify-content:center!important;
    align-items:center!important;
    gap:18px!important;
    margin:0!important;
    padding:0!important;
    white-space:nowrap!important;
}
.syh-v22-nav a{
    padding:8px 0!important;
    border:0!important;
    background:transparent!important;
    color:#142033!important;
    font-size:15px!important;
    font-weight:800!important;
    white-space:nowrap!important;
    text-decoration:none!important;
}
.syh-v22-nav a:hover,.syh-v22-nav a.is-active{color:var(--sy-shell-orange-dark)!important;}
.syh-v22-nav a:after{display:none!important;}
.syh-v22-nav a[data-active="home"],
.syh-v22-nav a[data-active="tour"]{display:none!important;}
.syh-v22-accesskey{position:absolute!important;left:-9999px!important;}
.syh-v22-mobile-panel{z-index:520!important;}
.syh-v22-legacy-data{display:none!important;}

.syf-v23{
    margin-top:28px!important;
    padding:0!important;
    background:var(--sy-shell-blue)!important;
    color:#fff!important;
    font-family:"Microsoft JhengHei","Noto Sans TC",Arial,sans-serif!important;
}
.syf-v23-main{background:transparent!important;padding:42px 0 18px!important;}
.syf-v23-inner{width:min(1180px,calc(100% - 40px))!important;max-width:1180px!important;margin:0 auto!important;padding-left:0!important;padding-right:0!important;}
.syf-v23-grid{display:grid!important;grid-template-columns:2fr 1fr 1fr 1.6fr!important;gap:34px!important;}
.syf-v23 h2,.syf-v23 h3{color:#fff!important;margin:0 0 12px!important;}
.syf-v23 p,.syf-v23 a{color:#d6e3f0!important;}
.syf-v23 a{display:block!important;margin:7px 0!important;text-decoration:none!important;}
.syf-v23 a:hover{color:#fff!important;text-decoration:underline!important;}
.syf-v23-logo,.syf-v23-social{display:none!important;}
.syf-v23-bottom{
    border-top:1px solid rgba(255,255,255,.18)!important;
    margin-top:28px!important;
    padding-top:18px!important;
    justify-content:center!important;
    text-align:center!important;
    color:#bdd0e1!important;
}
.syf-v23-gotop{background:#fff!important;color:var(--sy-shell-blue)!important;border:1px solid #d9a35b!important;}

@media (max-width:1100px){
    .syh-v22-top-inner{gap:12px!important;}
    .syh-v22-nav{gap:12px!important;}
    .syh-v22-nav a{font-size:13px!important;}
    .syh-v22-title{font-size:20px!important;}
    .syh-v22-brand{min-width:190px!important;}
    .syh-v22-member-toggle{padding-left:12px!important;padding-right:12px!important;}
}
@media (max-width:1000px){
    .syh-v22-top-inner{width:min(100% - 24px,1180px)!important;}
    .syh-v22-actions,.syh-v22-nav-row{display:none!important;}
    .syh-v22-menu-toggle{display:flex!important;margin-left:auto!important;}
    .syh-v22-mobile-panel{
        left:12px!important;
        right:12px!important;
        top:72px!important;
        width:auto!important;
        max-height:calc(100vh - 84px)!important;
        overflow:auto!important;
        border-radius:18px!important;
        box-shadow:0 18px 45px rgba(7,55,99,.18)!important;
    }
    .syh-v22.is-open .syh-v22-mobile-panel{display:block!important;}
    .syh-v22-brand{min-width:0!important;}
    .syh-v22-title{font-size:21px!important;}
    .syf-v23-grid{grid-template-columns:1fr 1fr!important;}
}
@media (max-width:560px){
    .syh-v22-title{font-size:19px!important;}
    .syh-v22-logo-mark{width:36px!important;height:36px!important;}
    .syf-v23-inner{width:min(100% - 28px,1180px)!important;}
    .syf-v23-grid{grid-template-columns:1fr!important;}
}