/* 原站 orchestras.css 的 inline <style>，原樣搬移，勿改（佔位符法：版面照原站） */
:root{
            --brand-red:#C20F2F; /* Vienna 風格紅 */
            --brand-black:#111111;
            --brand-gold:#b18b33;
            --text:#222222;
            --bg:#ffffff;
            --muted:#6b7280;
            --ring:#e5e7eb;
        }
        *{box-sizing:border-box}
        html,body{margin:0;padding:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,"Noto Sans TC","PingFang TC","Hiragino Sans GB",sans-serif;color:var(--text);background:var(--bg);}

        .container{max-width:1100px;margin:0 auto;padding:0 20px}

        /* Top bar */
        .topbar{background:var(--brand-black);color:#fff}
        .topbar .container{display:flex;align-items:center;gap:24px;padding:10px 20px}
        .brand{display:flex;align-items:center;gap:12px;font-weight:700;letter-spacing:.5px}
        .brand .logo{width:28px;height:28px;border-radius:4px;background:linear-gradient(135deg,var(--brand-red),#7a0518)}
        .nav{margin-left:auto;display:flex;gap:18px;flex-wrap:wrap}

        .cta{background:var(--brand-red);color:#fff;padding:8px 14px;border-radius:4px;font-weight:700}


        /* Hero */
        .hero{position:relative;color:#fff;border-bottom:1px solid #222;}
        .hero::before{
            content:"";
            position:absolute;
            inset:0;
            background:url('bg3.jpg') no-repeat;
            background-size:cover;          /* 保持铺满 */
            background-position:center 63%; /* X、Y 位置：示例为水平居中、垂直 30% */
        }
        .hero::after{content:"";position:absolute;inset:0;}
        .hero .wrap{position:relative;z-index:1;padding:64px 0}
        .hero h1{margin:0 0 10px;font-size:30px;letter-spacing:.12em}
        .hero p{margin:0;opacity:.95;max-width:760px}

        /* Section + cards */
        section{padding:44px 0;border-top:1px solid #eee}
        h2.section-title{font-size:22px;letter-spacing:.12em;text-transform:uppercase;margin:0 0 16px 0}
        .subtitle{color:var(--muted);margin:-6px 0 18px}

        .filters{display:grid;grid-template-columns:repeat(12,1fr);gap:14px;background:#fff;border:1px solid var(--ring);border-radius:12px;padding:14px}
        .filters .col-3{grid-column:span 3}
        .filters .col-6{grid-column:span 6}
        .filters .col-12{grid-column:span 12}
        .field{display:flex;flex-direction:column;gap:6px}
        .label{font-size:12px;color:#374151}
        .input,.select{border:1px solid var(--ring);border-radius:8px;padding:10px 12px;background:#fafafa}
        .btn-line{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--brand-red);color:var(--brand-red);padding:10px 14px;border-radius:8px;font-weight:700}
        .btn-fill{display:inline-flex;align-items:center;gap:8px;background:var(--brand-red);color:#fff;padding:10px 16px;border-radius:8px;font-weight:700;border:1px solid var(--brand-red)}

        .grid{display:grid;grid-template-columns:repeat(12,1fr);gap:18px;margin-top:20px}
        .col-4{grid-column:span 4}
        @media (max-width:980px){ .col-4{grid-column:span 6} }
        @media (max-width:680px){ .filters .col-3,.filters .col-6{grid-column:span 12} .col-4{grid-column:span 12} }

        .card{position:relative;background:#fff;border:1px solid #e6e3dc;border-radius:14px;overflow:hidden}
        .card::before{content:"";position:absolute;inset:0;background:radial-gradient(120% 120% at 0% 0%, rgba(177,139,51,.08), transparent 60%);pointer-events:none}
        .card .cover{height:140px;background:#111 url('https://images.unsplash.com/photo-1495954484750-af469f2f9be5?q=80&w=1200&auto=format&fit=crop') center/cover no-repeat;filter:grayscale(20%)}
        .card .body{padding:16px}
        .crest{width:64px;height:64px;border-radius:50%;border:2px solid #e7d9b3;background:#fff;overflow:hidden;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 0 rgba(0,0,0,.04);margin-top:-32px}
        .crest img{width:100%;height:100%;object-fit:cover}
        .title{margin:10px 0 6px;font-size:18px;font-weight:800;letter-spacing:.3px}
        .meta{display:flex;flex-wrap:wrap;gap:10px 14px;color:#4b5563;font-size:13px}
        .badge{display:inline-flex;align-items:center;gap:6px;border:1px solid #e7d9b3;color:#806a2b;background:#fffdfa;padding:4px 8px;border-radius:999px;font-size:12px}
        .actions{margin-top:14px;display:flex;gap:10px}
        .divider{height:1px;background:linear-gradient(90deg,#e9e2cf,transparent);margin:12px 0}
        .kvs{display:flex;gap:12px;flex-wrap:wrap;font-size:12px;color:#6b7280}

        .pagination{display:flex;gap:10px;justify-content:center;margin-top:24px}
        .page{border:1px solid var(--ring);padding:8px 12px;border-radius:8px;background:#fff}
        .page.active{border-color:var(--brand-red);color:#fff;background:var(--brand-red)}

        /* Responsive */
        @media (max-width:900px){
            .kpi{grid-template-columns:repeat(2,1fr)}
            .col-6{grid-column:span 12}
            .hero .wrap{padding:26px 26px}
        }