.front-site--b {
    --front-ink: #263b35;
    --front-ink-soft: #4d6259;
    --front-muted: #7c8a80;
    --front-paper: #fffdf8;
    --front-canvas: #f5f1e9;
    --front-canvas-deep: #ebe5d9;
    --front-line: #e3ddd1;
    --front-line-strong: #cfc4b3;
    --front-primary: #4b6a5c;
    --front-primary-deep: #29483d;
    --front-primary-soft: #e7eee7;
    --front-accent: #c96751;
    --front-accent-soft: #fae9df;
    --front-success: #477253;
    --front-success-soft: #e7f0e6;
    --front-danger: #ad4d45;
    --front-danger-soft: #fbe9e5;
    --front-shadow: 0 20px 54px rgba(62, 64, 45, 0.13);
    --front-shadow-soft: 0 8px 22px rgba(62, 64, 45, 0.08);
    --front-radius: 4px 19px 4px 19px;
    font-family: "PingFang TC", "Noto Sans TC", "Microsoft JhengHei", system-ui, sans-serif;
}

.front-site--b .front-site-header {
    border-bottom-color: #d8d0c2;
    background: rgba(255, 253, 248, 0.96);
}

.front-site--b .front-utility {
    background: var(--front-primary-deep);
}

.front-site--b .front-brand__mark {
    border-radius: 7px 18px 7px 18px;
    background: linear-gradient(145deg, #78917e, #29483d);
    box-shadow: 0 9px 17px rgba(41, 72, 61, 0.2);
}

.front-site--b .front-brand__copy strong,
.front-site--b .front-page-intro h1,
.front-site--b .front-section__head h2,
.front-site--b .front-card__header h2,
.front-site--b .front-card__header h3,
.front-site--b .front-detail-hero__copy h1,
.front-site--b .front-detail-section h2,
.front-site--b .front-auth-aside h2,
.front-site--b .front-auth-card h1,
.front-site--b .front-status-panel h1,
.front-site--b .front-modal__copy h2 {
    font-family: "Noto Serif TC", "Songti TC", "PMingLiU", serif;
}

.front-site--b .front-nav__link:hover,
.front-site--b .front-nav__link[aria-current="page"] {
    background: var(--front-accent-soft);
    color: var(--front-accent);
}

.front-site--b .front-nav__link[aria-current="page"] {
    box-shadow: inset 0 -2px 0 var(--front-accent);
}

.front-site--b .front-nav-toggle {
    border-radius: 6px 12px 6px 12px;
    background: var(--front-paper);
}

.front-site--b .front-side-menu__intro {
    background:
        radial-gradient(circle at 88% 18%, rgba(201, 103, 81, 0.7), transparent 7rem),
        linear-gradient(145deg, #587866, #29483d);
}

.front-site--b .front-button {
    border-radius: 5px 12px 5px 12px;
}

.front-site--b .front-button--primary {
    background: var(--front-primary-deep);
    box-shadow: 0 8px 17px rgba(41, 72, 61, 0.19);
}

.front-site--b .front-button--primary:hover {
    background: #19372e;
}

.front-site--b .front-button--quiet {
    background: var(--front-accent-soft);
    color: #9b4838 !important;
}

.front-site--b .front-button--quiet:hover {
    background: #f5d9ca;
}

.front-site--b .front-side-menu__note {
    background: var(--front-accent-soft);
    color: #8e4538;
    border-radius: 4px 13px 4px 13px;
}

.front-site--b .front-rail__card {
    border-color: #e3c9bb;
    background: linear-gradient(145deg, #fff7ef, #f3e7da);
}

.front-site--b .front-rail__card--plain {
    border-color: var(--front-line);
    background: var(--front-paper);
}

.front-site--b .front-rail__kicker {
    color: var(--front-accent);
}

.front-site--b .front-rail__card h2 {
    font-family: "Noto Serif TC", "Songti TC", "PMingLiU", serif;
}

.front-site--b .front-home-hero {
    border-radius: 5px 27px 5px 27px;
    background: var(--front-primary-deep);
}

/* hero 底色就是 --front-primary-deep，而主要按鈕預設也是同一個顏色，
   等於深綠壓深綠、看不出是按鈕。hero 內改用暖色系底＋深綠字，
   對比 7.6:1（按鈕對底色也是 7.6:1）。其他淺底頁面維持原本的深綠按鈕。 */
.front-site--b .front-home-hero .front-button--primary {
    background: #ffd8c7;
    box-shadow: 0 8px 17px rgba(20, 38, 30, 0.28);
    color: var(--front-primary-deep) !important;
}

.front-site--b .front-home-hero .front-button--primary:hover {
    background: #ffcbb4;
    color: var(--front-primary-deep) !important;
}

.front-site--b .front-hero__slide {
    grid-template-columns: minmax(0, 0.92fr) minmax(260px, 1.08fr);
}

.front-site--b .front-hero__copy {
    order: 2;
}

.front-site--b .front-hero__visual {
    order: 1;
    background: #5b7566;
}

.front-site--b .front-hero__visual::after {
    background: linear-gradient(90deg, transparent, rgba(41, 72, 61, 0.52) 75%), linear-gradient(0deg, rgba(41, 72, 61, 0.35), transparent 42%);
}

.front-site--b .front-hero__placeholder {
    background:
        radial-gradient(circle at 26% 28%, rgba(201, 103, 81, 0.78) 0 4%, transparent 4.5%),
        radial-gradient(circle at 27% 27%, rgba(248, 231, 218, 0.22) 0 15%, transparent 15.5%),
        linear-gradient(145deg, #718d79, #29483d 72%);
}

.front-site--b .front-hero__arrow {
    border-radius: 5px 12px 5px 12px;
    background: rgba(41, 72, 61, 0.46);
}

.front-site--b .front-hero__dot.is-active {
    background: transparent;
}

.front-site--b .front-hero__dot.is-active::before {
    background: #ffd8c7;
}

.front-site--b .front-section__kicker,
.front-site--b .front-eyebrow,
.front-site--b .front-page-intro__kicker {
    color: var(--front-accent);
}

.front-site--b .front-course-card:hover {
    border-color: #d6b2a5;
}

.front-site--b .front-course-card__placeholder {
    background:
        radial-gradient(circle at 25% 35%, rgba(252, 218, 197, 0.42) 0 7%, transparent 7.5%),
        linear-gradient(145deg, #78917e, #29483d);
}

.front-site--b .front-news-list a:hover {
    background: #fff8f0;
}

.front-site--b .front-news-note {
    border-color: #e3c9bb;
    background: linear-gradient(145deg, #fff7ef, #f3e7da);
}

.front-site--b .front-news-note__mark {
    border-radius: 6px 15px 6px 15px;
    background: var(--front-accent);
}

.front-site--b .front-news-row__date {
    background: var(--front-accent-soft);
    color: #9b4838;
}

.front-site--b .front-detail-hero {
    border-radius: 5px 23px 5px 23px;
    background: var(--front-primary-deep);
}

.front-site--b .front-detail-hero__visual {
    background: #5b7566;
}

.front-site--b .front-detail-hero__placeholder {
    background: linear-gradient(145deg, #78917e, #29483d);
}

.front-site--b .front-price-card,
.front-site--b .front-summary {
    border-color: #e2c8bc;
    background: linear-gradient(145deg, #fff8f1, #f3e6da);
}

.front-site--b .front-price-card__value,
.front-site--b .front-summary__total strong {
    color: #9b4838;
}

.front-site--b .front-price-card .front-button--primary {
    background: var(--front-accent);
}

.front-site--b .front-price-card .front-button--primary:hover {
    background: #a74e3e;
}

.front-site--b .front-content-body a {
    color: var(--front-accent);
}

.front-site--b .front-pagination li.active a,
.front-site--b .front-pagination li.active span,
.front-site--b .front-pagination li a:hover,
.front-site--b .front-news-categories a:hover,
.front-site--b .front-news-categories a[aria-current="page"] {
    border-color: var(--front-accent);
    background: var(--front-accent);
}

.front-site--b .front-auth-aside {
    border-radius: 5px 25px 5px 25px;
    background:
        radial-gradient(circle at 15% 80%, rgba(201, 103, 81, 0.62), transparent 9rem),
        linear-gradient(145deg, #29483d, #5b7566);
}

.front-site--b .front-auth-card {
    border-radius: 5px 20px 5px 20px;
}

.front-site--b .front-auth-card .front-eyebrow {
    color: var(--front-accent);
}

.front-site--b .front-summary,
.front-site--b .front-price-card {
    border-radius: 5px 19px 5px 19px;
}

.front-site--b .front-payment-option input:checked + label {
    border-color: var(--front-accent);
    background: var(--front-accent-soft);
    box-shadow: 0 0 0 2px rgba(201, 103, 81, 0.1);
}

.front-site--b .front-payment-option input:checked + label::before {
    border-color: var(--front-accent);
}

.front-site--b .front-status-panel {
    border-radius: 5px 25px 5px 25px;
}

.front-site--b .front-status-panel__mark {
    border-radius: 5px 18px 5px 18px;
}

.front-site--b .front-modal__dialog {
    border-radius: 5px 23px 5px 23px;
}

.front-site--b .front-modal__visual {
    background: linear-gradient(145deg, #78917e, #29483d);
}

.front-site--b .front-modal__close {
    border-radius: 5px 12px 5px 12px;
    background: rgba(41, 72, 61, 0.82);
}

@media (max-width: 767px) {
    .front-site--b .front-hero__slide {
        display: block;
    }

    .front-site--b .front-hero__copy,
    .front-site--b .front-hero__visual {
        order: initial;
    }
}

/* ── 輔助文字加深：連最深的 canvas-deep 背景也維持 AA（≥4.5:1） ── */
.front-site--b {
    --front-muted: #566359;
}

/* ── 焦點外框隨主題換膚：淺色底用深磚紅、深綠與頁尾區塊用淺杏色 ── */
.front-site--b :focus-visible {
    outline-color: #8a4434;
}

.front-site--b .front-home-hero :focus-visible,
.front-site--b .front-hero :focus-visible,
.front-site--b .front-site-footer :focus-visible {
    outline-color: #ffd8c7;
}

/* ── 報名 CTA：預設即用白字對比達 AA 的深磚紅（5.5:1），hover 再加深 ── */
.front-site--b .front-price-card .front-button--primary {
    background: #a74e3e;
}

.front-site--b .front-price-card .front-button--primary:hover {
    background: #8f4234;
}

/* ── 訂單中間狀態徽章配合暖色系 ── */
.front-site--b .front-status--pending {
    border-color: #d9bd83;
    background: #f7eed7;
    color: #74521a;
}

/* ── 購物車件數徽章用主題 accent，避免綠底綠字 ── */
.front-site--b .front-cart-badge {
    background: #a74e3e;
}