/*
 * 解憂殿下：Bulma 主題化
 * 透過 Bulma 1.0 的 CSS 變數 API（--bulma-*）改色、改字體、改圓角，
 * 版面盡量交給 Bulma 原生元件（columns / card / panel / message / media / icon / notification / footer）。
 * 這裡只保留 Bulma 沒有對應元件的品牌專屬樣式。
 */

:root {
    /* 舊紙底色（scheme）：page 用 main-ter，卡片／導覽列用較亮的 main */
    --bulma-scheme-h: 36deg;
    --bulma-scheme-s: 30%;
    --bulma-scheme-main-l: 99%;
    --bulma-scheme-main-bis-l: 95%;
    --bulma-scheme-main-ter-l: 91%;
    --bulma-background-l: 92%;
    --bulma-border-l: 79%;
    --bulma-border-weak-l: 90%;
    --bulma-body-background-color: var(--bulma-scheme-main-ter);

    /* 內文墨色 */
    --bulma-text-h: 27deg;
    --bulma-text-s: 14%;
    --bulma-text-l: 42%;
    --bulma-text-strong-l: 16%;
    --bulma-text-title-l: 14%;
    --bulma-text-weak-l: 46%;

    /* 朱砂紅：主品牌色 */
    --bulma-primary-h: 5deg;
    --bulma-primary-s: 47%;
    --bulma-primary-l: 38%;

    /* 深朱砂：連結、burger、focus */
    --bulma-link-h: 3deg;
    --bulma-link-s: 46%;
    --bulma-link-l: 25%;

    /* 鼠尾草綠：次要強調（hover、下一場、社群） */
    --bulma-success-h: 131deg;
    --bulma-success-s: 10%;
    --bulma-success-l: 32%;

    /* 赤陶：特殊活動場次 */
    --bulma-info-h: 15deg;
    --bulma-info-s: 41%;
    --bulma-info-l: 48%;

    /* 淡金：精神理念、裝飾線 */
    --bulma-warning-h: 32deg;
    --bulma-warning-s: 36%;
    --bulma-warning-l: 46%;

    /* 已過場次的沉靜灰褐 */
    --bulma-dark-h: 27deg;
    --bulma-dark-s: 10%;
    --bulma-dark-l: 30%;

    /* 字體 */
    --bulma-family-primary: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans TC", "Microsoft JhengHei", sans-serif;
    --bulma-family-secondary: "Noto Serif TC", "Songti TC", "PMingLiU", serif;
    --bulma-title-family: var(--bulma-family-secondary);
    --bulma-subtitle-family: var(--bulma-family-secondary);

    /* 圓角：WordPress 式官網感，避免過度圓潤 */
    --bulma-radius-small: 4px;
    --bulma-radius: 6px;
    --bulma-radius-medium: 8px;
    --bulma-radius-large: 8px;

    /* LINE 品牌綠：Bulma 語意色沒有對應，單獨留一組 */
    --jieyou-line: #06c755;
    --jieyou-line-dark: #078a3d;
    --rule: hsla(var(--bulma-scheme-h), var(--bulma-scheme-s), 55%, 0.4);
}

.wp-site-blocks > *,
.site-main,
.wp-block-post-content,
.wp-block-html {
    margin-block-start: 0;
}

.site-main,
.wp-block-post-content {
    max-width: none;
}

.skip-link {
    position: absolute;
    left: 1rem;
    top: 1rem;
    z-index: 100;
    transform: translateY(-140%);
    padding: 0.55rem 0.8rem;
    border: 1px solid hsl(var(--bulma-primary-h), var(--bulma-primary-s), var(--bulma-primary-l));
    border-radius: var(--bulma-radius);
    background: var(--bulma-scheme-main);
    color: var(--bulma-text-strong);
}

.skip-link a {
    color: inherit;
}

.skip-link:focus,
.skip-link:focus-within {
    transform: none;
}

.top-strip {
    height: 4px;
    background: linear-gradient(
        90deg,
        hsl(var(--bulma-link-h), var(--bulma-link-s), var(--bulma-link-l)) 0 46%,
        hsl(var(--bulma-success-h), var(--bulma-success-s), var(--bulma-success-l)) 46% 82%,
        hsl(var(--bulma-warning-h), var(--bulma-warning-s), var(--bulma-warning-l)) 82% 100%
    );
}

.site-header {
    position: sticky;
    top: 0;
    z-index: 40;
    border-bottom: 1px solid var(--rule);
    background: hsl(var(--bulma-scheme-h), var(--bulma-scheme-s), var(--bulma-scheme-main-l));
}

.site-header-inner {
    min-height: 4rem;
}

.site-branding {
    gap: 0.65rem;
}

.brand-logo img {
    border-radius: var(--bulma-radius);
}

.brand-title,
.brand-title a {
    color: hsl(var(--bulma-link-h), var(--bulma-link-s), var(--bulma-link-l));
    font-family: var(--bulma-family-secondary);
    font-weight: 700;
    text-decoration: none;
}

.primary-navigation {
    font-weight: 700;
}

.primary-navigation .wp-block-navigation-item__content {
    border-bottom: 2px solid transparent;
    color: var(--bulma-text-strong);
}

.primary-navigation .wp-block-navigation-item__content:hover,
.primary-navigation .wp-block-navigation-item__content:focus {
    border-bottom-color: hsl(var(--bulma-success-h), var(--bulma-success-s), var(--bulma-success-l));
    color: hsl(var(--bulma-success-h), var(--bulma-success-s), var(--bulma-success-l));
}

.primary-navigation .current-menu-item > .wp-block-navigation-item__content,
.primary-navigation .current-menu-ancestor > .wp-block-navigation-item__content,
.primary-navigation .wp-block-navigation-item__content.is-active-page,
.primary-navigation .wp-block-navigation-item__content[aria-current="page"] {
    border-bottom-color: hsl(var(--bulma-success-h), var(--bulma-success-s), var(--bulma-success-l));
    color: hsl(var(--bulma-success-h), var(--bulma-success-s), var(--bulma-success-l));
}

.page-hero {
    padding: 2.75rem 0 1.5rem;
    border-bottom: 1px solid var(--rule);
    background: var(--bulma-scheme-main-bis);
}

.page-hero .title {
    margin-top: 0.4rem;
}

.page-hero-lead {
    max-width: 46rem;
    margin-top: 0.75rem;
    color: var(--bulma-text-weak);
}

.map-embed {
    position: relative;
    width: 100%;
    padding-top: 56.25%;
    overflow: hidden;
}

.map-embed iframe {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
}

.news-item {
    position: relative;
    display: block;
    padding: 1.1rem 2.75rem 1.1rem 1.35rem;
    text-decoration: none;
}

.news-item + .news-item {
    margin-top: 0.9rem;
}

.news-item-top {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    margin-bottom: 0.45rem;
}

.news-item-tag {
    display: inline-flex;
    align-items: center;
    padding: 0.2rem 0.55rem;
    font-size: 0.72rem;
    font-weight: 800;
}

.news-item-date {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    color: var(--bulma-text-weak);
    font-size: 0.85rem;
}

.news-item-date svg {
    width: 14px;
    height: 14px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.news-item-title {
    display: block;
    font-weight: 700;
    color: var(--bulma-text-strong);
}

.news-item-excerpt {
    display: block;
    margin-top: 0.45rem;
    color: var(--bulma-text-weak);
    font-size: 0.92rem;
}

.news-item-arrow {
    position: absolute;
    top: 1.2rem;
    right: 1.2rem;
    width: 1.15rem;
    height: 1.15rem;
    color: var(--bulma-text-weak);
}

.section-heading.is-centered {
    text-align: center;
}

.svc-card {
    display: flex;
    flex-direction: column;
    height: 100%;
    overflow: hidden;
    text-decoration: none;
}

.svc-card-media {
    position: relative;
    aspect-ratio: 16 / 10;
}

.svc-card-media img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    padding: 1.1rem;
}

.svc-card-body {
    display: flex;
    flex-direction: column;
    flex-grow: 1;
    padding: 1.1rem 1.25rem 1.35rem;
}

.svc-card-title {
    margin-bottom: 0.4rem;
    font-family: var(--bulma-family-secondary);
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--bulma-text-strong);
}

.svc-card-desc {
    flex-grow: 1;
    margin-bottom: 0.85rem;
    color: var(--bulma-text-weak);
    font-size: 0.92rem;
}

.svc-card-price {
    font-weight: 800;
    color: hsl(var(--bulma-primary-h), var(--bulma-primary-s), var(--bulma-primary-l));
}

.section-kicker {
    display: block;
    margin-bottom: 0.65rem;
    color: hsl(var(--bulma-success-h), var(--bulma-success-s), var(--bulma-success-l));
    font-size: 0.82rem;
    font-weight: 800;
}

.title.hero-title {
    font-size: 4.25rem;
    line-height: 1.1;
}

.subtitle.hero-tagline {
    color: hsl(var(--bulma-link-h), var(--bulma-link-s), var(--bulma-link-l));
    font-family: var(--bulma-family-secondary);
}

.hero#home {
    background-color: var(--bulma-scheme-main-ter);
}

.card {
    --bulma-card-radius: var(--bulma-radius-large);
}

.wp-block-columns.columns {
    gap: 0;
}

.wp-block-column.column {
    flex-basis: auto;
}

.is-full-height {
    height: 100%;
}

.icon svg {
    width: 100%;
    height: 100%;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.profile-card {
    position: relative;
    text-align: center;
}

.social-icon-row {
    display: flex;
    flex-wrap: wrap;
    gap: 1.1rem;
}

.social-icon-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 60px;
    height: 60px;
    border-radius: 50%;
}

.social-icon-badge img {
    width: 28px;
    height: 28px;
    object-fit: contain;
}

.calendar-image {
    overflow: hidden;
}

.calendar-image img {
    display: block;
    width: 100%;
    height: auto;
}

.schedule-group + .schedule-group {
    margin-top: 2.5rem;
}

.schedule-group-title {
    margin-bottom: 1rem;
}

a.info-card {
    display: block;
    text-decoration: none;
}

.price {
    margin-bottom: 0.6rem;
}

/* 同一列的卡片／訊息框高度看齊，避免文字長短不一造成底邊參差不齊 */
.info-card,
.calendar-card,
#knowledge .message,
#line-booking .box {
    height: 100%;
}

.gallery-section {
    margin-bottom: 1rem;
}

.gallery-carousel {
    position: relative;
}

.gallery-carousel-viewport {
    overflow: hidden;
}

.gallery-carousel-track {
    display: flex;
    cursor: grab;
    touch-action: pan-y;
    transition: transform 420ms ease;
}

.gallery-carousel-track:active {
    cursor: grabbing;
}

.gallery-slide {
    position: relative;
    flex: 0 0 100%;
    aspect-ratio: 16 / 9;
    margin: 0;
    line-height: 0;
}

.gallery-slide img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    -webkit-user-drag: none;
    user-select: none;
    pointer-events: none;
}

.gallery-slide figcaption {
    position: absolute;
    inset-inline: 0;
    bottom: 0;
    padding: 0.9rem 1.1rem;
    background: linear-gradient(0deg, hsla(var(--bulma-scheme-h), var(--bulma-scheme-s), var(--bulma-scheme-invert-l), 0.6), transparent);
    color: #fff;
    font-family: var(--bulma-family-secondary);
    font-size: 1.05rem;
    font-weight: 700;
    line-height: 1.4;
    text-align: left;
}

.gallery-carousel-nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    display: inline-grid;
    place-items: center;
    width: 2.75rem;
    aspect-ratio: 1;
    border: none;
    border-radius: 50%;
    background: hsla(var(--bulma-scheme-h), var(--bulma-scheme-s), var(--bulma-scheme-invert-l), 0.4);
    color: #fff;
    cursor: pointer;
}

.gallery-carousel-nav:hover,
.gallery-carousel-nav:focus-visible {
    background: hsla(var(--bulma-scheme-h), var(--bulma-scheme-s), var(--bulma-scheme-invert-l), 0.62);
}

.gallery-carousel-nav svg {
    width: 1.4rem;
    height: 1.4rem;
    fill: none;
    stroke: currentColor;
    stroke-width: 2.4;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.gallery-carousel-nav.is-prev {
    left: 0.9rem;
}

.gallery-carousel-nav.is-next {
    right: 0.9rem;
}

@media screen and (max-width: 768px) {
    .gallery-carousel-nav {
        width: 2.25rem;
    }

    .gallery-slide figcaption {
        font-size: 0.92rem;
    }
}

.footer.site-footer {
    --bulma-footer-background-color: hsl(27deg, 16%, 16%);
    padding-bottom: 5.4rem;
}

.footer.site-footer,
.footer.site-footer a {
    color: hsla(30, 40%, 96%, 0.86);
}

.footer.site-footer a:hover {
    color: #fff;
}

.footer-inner {
    margin-bottom: 0;
}

.line-bubble {
    position: fixed;
    right: 1.2rem;
    bottom: calc(1.2rem + env(safe-area-inset-bottom));
    z-index: 60;
    display: inline-grid;
    width: 66px;
    aspect-ratio: 1;
    place-items: center;
    border: 3px solid #fff;
    border-radius: 50%;
    background: var(--jieyou-line);
    color: #fff;
    text-decoration: none;
    box-shadow: 0 8px 20px rgba(6, 90, 40, 0.24);
}

.line-bubble a {
    display: grid;
    width: 100%;
    height: 100%;
    place-items: center;
    fill: #fff;
    font-family: Arial, sans-serif;
    font-size: 0.78rem;
    font-weight: 900;
    color: #fff;
    text-decoration: none;
}

@media screen and (max-width: 768px) {
    .hero-title {
        font-size: 2.8rem;
    }

    .line-bubble {
        width: 60px;
        right: 0.85rem;
        bottom: calc(0.85rem + env(safe-area-inset-bottom));
    }

    .footer-inner .has-text-align-right {
        text-align: left;
    }
}