/* ===== 子页面共用样式 - 新映画 ===== */
body.subpage{opacity:1;background:#f7f5f2}
body.subpage .page-for-preloading{min-height:100vh;background:#f7f5f2}

/* 子页导航：与首页 main-color 一致（半透明）；滚到白区时 bainav 金色 */
body.subpage #fixed-menu-top.main-color .top-logo{
    background-color:rgb(69 69 69 / 5%);
    border-bottom:none;
    box-shadow:none;
    transition:background-color .3s
}
body.subpage #fixed-menu-top.bainav .top-logo,
body.subpage #fixed-menu-top.main-color.bainav .top-logo{
    background-color:#D1A862 !important;
    background:#D1A862 !important
}
body.subpage #nav-area.bainav{
    background-color:#C3A468
}
body.subpage #fixed-menu-top #mod-home-navigation ul a.active,
body.subpage #fixed-menu-top #mod-home-navigation ul a:hover{color:#ffda81}

/* ===== 页面英雄区（金色，对齐首页 intro） ===== */
.page-hero{
    position:relative;
    min-height:42vh;
    display:flex;
    align-items:flex-end;
    justify-content:center;
    padding:120px 24px 72px;
    background:linear-gradient(153deg,#b49558 0%,#bc9657 42%,#c0995a 75%,#c8a068 100%);
    overflow:hidden
}
.page-hero::before{
    content:"";
    position:absolute;
    inset:0;
    background:
        radial-gradient(ellipse 70% 55% at 75% 25%,rgba(255,255,255,.12) 0%,transparent 55%),
        radial-gradient(ellipse 50% 40% at 10% 85%,rgba(0,0,0,.08) 0%,transparent 50%);
    pointer-events:none
}
.page-hero::after{
    content:"";
    position:absolute;
    bottom:0;left:0;right:0;
    height:1px;
    background:linear-gradient(90deg,transparent,rgba(255,255,255,.35),transparent)
}
.page-hero-inner{
    position:relative;
    z-index:1;
    width:100%;
    max-width:1100px;
    text-align:center
}
.page-hero .eyebrow{
    display:inline-block;
    font-size:13px;
    letter-spacing:.28em;
    text-transform:uppercase;
    color:rgba(255,255,255,.85);
    margin-bottom:18px;
    font-weight:500
}
.page-hero h1{
    font-size:48px;
    font-weight:700;
    color:#fff;
    letter-spacing:.08em;
    line-height:1.25;
    margin:0 0 16px
}
.page-hero .lead{
    font-size:18px;
    color:rgba(255,255,255,.88);
    line-height:1.7;
    max-width:650px;
    margin:0 auto;
    font-weight:300
}

/* ===== 内容区 ===== */
.page-section{
    padding:88px 24px;
    background:#f7f5f2
}
.page-section.dark{
    background:#111;
    color:#eee
}
.page-section.gold{
    background:linear-gradient(153deg,#b49558 0%,#bc9657 42%,#c0995a 75%,#c8a068 100%);
    color:#fff
}
.page-wrap{
    max-width:1160px;
    margin:0 auto
}
.section-head{
    text-align:center;
    margin-bottom:56px
}
.section-head .tag{
    display:inline-block;
    font-size:12px;
    letter-spacing:.22em;
    color:#b89558;
    margin-bottom:12px
}
.section-head h2{
    font-size:34px;
    font-weight:700;
    color:#2c3340;
    letter-spacing:.04em;
    margin:0 0 12px;
    line-height:1.3
}
.page-section.dark .section-head h2,
.page-section.gold .section-head h2{color:#fff}
.section-head p{
    font-size:16px;
    color:#888;
    line-height:1.7;
    max-width:520px;
    margin:0 auto
}
.page-section.dark .section-head p{color:rgba(255,255,255,.55)}
.page-section.gold .section-head .tag{
    color:rgba(255,255,255,.9);
    letter-spacing:.28em
}
.page-section.gold .section-head p{color:rgba(255,255,255,.88)}

/* ===== 服务卡片网格 ===== */
.svc-grid{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:28px
}
.svc-card{
    background:#fff;
    border-radius:16px;
    padding:40px 32px;
    box-shadow:0 4px 24px rgba(40,30,10,.06);
    transition:transform .35s ease,box-shadow .35s ease;
    border:1px solid rgba(0,0,0,.04);
    position:relative;
    overflow:hidden
}
.svc-card::before{
    content:"";
    position:absolute;
    top:0;left:0;right:0;
    height:3px;
    background:linear-gradient(90deg,#d5a75f,#b89558);
    opacity:0;
    transition:opacity .3s
}
.svc-card:hover{
    transform:translateY(-6px);
    box-shadow:0 16px 40px rgba(40,30,10,.12)
}
.svc-card:hover::before{opacity:1}
.svc-card .svc-icon{
    width:56px;height:56px;
    border-radius:14px;
    background:linear-gradient(135deg,rgba(213,167,95,.15),rgba(184,149,88,.08));
    display:flex;align-items:center;justify-content:center;
    font-size:24px;color:#b89558;
    margin-bottom:22px
}
.svc-card h3{
    font-size:22px;
    font-weight:700;
    color:#2c3340;
    margin:0 0 12px;
    letter-spacing:.02em
}
.svc-card p{
    font-size:15px;
    color:#666;
    line-height:1.75;
    margin:0 0 18px
}
.svc-card ul{
    list-style:none;
    padding:0;margin:0
}
.svc-card ul li{
    font-size:14px;
    color:#555;
    line-height:1.9;
    padding-left:18px;
    position:relative
}
.svc-card ul li::before{
    content:"";
    position:absolute;
    left:0;top:50%;
    transform:translateY(-50%);
    width:6px;height:6px;
    border-radius:50%;
    background:#d5a75f
}

/* ===== 流程步骤 ===== */
.process-row{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:20px;
    counter-reset:step
}
.process-item{
    text-align:center;
    padding:28px 16px;
    position:relative
}
.process-item::before{
    counter-increment:step;
    content:counter(step,decimal-leading-zero);
    display:block;
    font-size:42px;
    font-weight:300;
    color:rgba(184,149,88,.35);
    letter-spacing:.05em;
    margin-bottom:12px;
    line-height:1
}
.process-item h4{
    font-size:17px;
    font-weight:700;
    color:#2c3340;
    margin:0 0 8px
}
.page-section.dark .process-item h4{color:#fff}
.page-section.gold .process-item h4{color:#fff}
.process-item p{
    font-size:13px;
    color:#888;
    line-height:1.6;
    margin:0
}
.page-section.dark .process-item p{color:rgba(255,255,255,.5)}
.page-section.gold .process-item p{color:rgba(255,255,255,.82)}
.page-section.gold .process-item::before{
    color:rgba(255,255,255,.35)
}

/* ===== 影像拍摄特色 ===== */
.film-features{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:32px;
    align-items:center
}
.film-features.reverse{direction:rtl}
.film-features.reverse > *{direction:ltr}
.film-visual{
    border-radius:20px;
    min-height:320px;
    background:linear-gradient(145deg,#1c1814,#2a231c);
    position:relative;
    overflow:hidden;
    display:flex;
    align-items:center;
    justify-content:center
}
.film-visual::before{
    content:"";
    position:absolute;
    width:200px;height:200px;
    border-radius:50%;
    border:1px solid rgba(213,167,95,.25);
    animation:pulse-ring 4s ease-in-out infinite
}
.film-visual::after{
    content:"\f008";
    font-family:"Font Awesome 6 Free";
    font-weight:900;
    font-size:48px;
    color:rgba(213,167,95,.5);
    position:relative;z-index:1
}
@keyframes pulse-ring{
    0%,100%{transform:scale(1);opacity:.6}
    50%{transform:scale(1.15);opacity:.25}
}
.film-text h3{
    font-size:26px;
    font-weight:700;
    color:#2c3340;
    margin:0 0 14px
}
.film-text p{
    font-size:15px;
    color:#666;
    line-height:1.8;
    margin:0 0 16px
}
.film-text .tags{
    display:flex;flex-wrap:wrap;gap:8px
}
.film-text .tags span{
    display:inline-block;
    padding:6px 14px;
    border-radius:20px;
    background:rgba(213,167,95,.12);
    color:#9a7a3e;
    font-size:13px
}

/* ===== 案例网格 ===== */
.case-filters{
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    gap:10px;
    margin-bottom:40px
}
.case-filters button{
    border:1px solid rgba(184,149,88,.35);
    background:transparent;
    color:#8a6e3a;
    padding:8px 20px;
    border-radius:24px;
    font-size:14px;
    cursor:pointer;
    transition:all .25s;
    font-family:inherit
}
.case-filters button:hover,
.case-filters button.active{
    background:#b89558;
    border-color:#b89558;
    color:#fff
}
.case-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:24px
}
.case-card{
    border-radius:14px;
    overflow:hidden;
    background:#fff;
    box-shadow:0 4px 20px rgba(40,30,10,.06);
    transition:transform .3s,box-shadow .3s
}
.case-card:hover{
    transform:translateY(-4px);
    box-shadow:0 12px 32px rgba(40,30,10,.12)
}
.case-thumb{
    height:180px;
    /*background:linear-gradient(135deg,#2a231c,#1a1510);*/
    display:flex;
    align-items:center;
    justify-content:center;
    position:relative
}
.case-thumb .case-cat{
    position:absolute;
    top:14px;left:14px;
    font-size:11px;
    letter-spacing:.1em;
    padding:4px 10px;
    border-radius:4px;
    background:rgba(213,167,95,.9);
    color:#fff
}
.case-thumb .case-letter{
    font-size:48px;
    font-weight:300;
    color:rgba(213,167,95,.35);
    /*letter-spacing:.1em*/
}
.case-body{
    padding:22px 20px 26px
}
.case-body h3{
    font-size:17px;
    font-weight:700;
    color:#2c3340;
    margin:0 0 6px
}
.case-body p{
    font-size:13px;
    color:#888;
    line-height:1.6;
    margin:0
}

/* ===== 响应式 ===== */
@media (max-width:991px){
    .page-hero{min-height:36vh;padding:100px 20px 56px}
    .page-hero h1{font-size:36px}
    .page-hero .lead{font-size:16px}
    .page-section{padding:64px 20px}
    .section-head{margin-bottom:40px}
    .section-head h2{font-size:28px}
    .svc-grid{grid-template-columns:1fr;gap:20px}
    .process-row{grid-template-columns:repeat(2,1fr);gap:12px}
    .film-features,
    .film-features.reverse{grid-template-columns:1fr;direction:ltr;gap:24px}
    .film-visual{min-height:220px}
    .case-grid{grid-template-columns:repeat(2,1fr);gap:16px}
}
@media (max-width:600px){
    .page-hero{padding:88px 16px 48px}
    .page-hero h1{font-size:28px;letter-spacing:.04em}
    .page-hero .eyebrow{font-size:11px;letter-spacing:.2em}
    .page-hero .lead{font-size:14px}
    .page-section{padding:48px 16px}
    .section-head h2{font-size:24px}
    .svc-card{padding:28px 22px}
    .svc-card h3{font-size:18px}
    .process-row{grid-template-columns:1fr 1fr}
    .process-item::before{font-size:32px}
    .case-grid{grid-template-columns:1fr}
    .case-thumb{height:160px}
}
