/*
  玲瓏閣｜明亮易讀版
  獨立載入於「玲瓏閣_明亮易讀版.html」，不影響正式 index.html。
*/

body.luxury-comparison.bright-readable {
  --bright-paper: #e4dacb;
  --bright-muted: #c8b9a5;
  --bright-gold: #ddc18c;
  --bright-bronze: #bd966f;
  background: #17120f !important;
  color: var(--bright-paper) !important;
}

/* 抬高整體黑階，保留夜色，不讓頁面變成淺色網站。 */
body.luxury-comparison.bright-readable .story-section,
body.luxury-comparison.bright-readable .section-ju,
body.luxury-comparison.bright-readable .section-create,
body.luxury-comparison.bright-readable .section-about {
  background-color: #211a16 !important;
}
body.luxury-comparison.bright-readable .story-section::after {
  background: linear-gradient(90deg, rgba(8, 5, 3, .58), rgba(16, 10, 6, .12) 50%, rgba(8, 5, 3, .54)) !important;
}
body.luxury-comparison.bright-readable .story-section::before {
  opacity: .88 !important;
}
body.luxury-comparison.bright-readable .section-fate {
  background: radial-gradient(ellipse at 74% 56%, rgba(174, 118, 57, .16), transparent 42%), linear-gradient(180deg, #211a16 0%, #2a211b 54%, #18130f 100%) !important;
}
body.luxury-comparison.bright-readable .section-ju {
  background: radial-gradient(circle at 50% 70%, rgba(190, 137, 71, .15), transparent 43%), linear-gradient(180deg, #211a16 0%, #2a211b 52%, #18130f 100%) !important;
}
body.luxury-comparison.bright-readable .section-shi {
  background: radial-gradient(ellipse at 66% 53%, rgba(126, 98, 72, .22), transparent 43%), linear-gradient(180deg, #211a16 0%, #29211d 52%, #18130f 100%) !important;
}
body.luxury-comparison.bright-readable .section-create {
  background: radial-gradient(circle at 52% 54%, rgba(216, 169, 91, .16), transparent 40%), linear-gradient(180deg, #211a16 0%, #2a211b 52%, #18130f 100%) !important;
}
body.luxury-comparison.bright-readable .section-about {
  background: linear-gradient(180deg, #211a16 0%, #2a211b 55%, #18130f 100%) !important;
}

/* Hero：山景與文字的可讀性同步上提。 */
body.luxury-comparison.bright-readable .hero-premium {
  background: linear-gradient(180deg, #211a16 0%, #2a211b 54%, #18130f 100%) !important;
}
body.luxury-comparison.bright-readable .hero-premium .bg-mountain {
  background-position: center 45% !important;
  background-size: cover !important;
  opacity: .9 !important;
  filter: contrast(1.04) saturate(.82) brightness(.98) !important;
  transform: scale(1.14) translateY(-2%) !important;
  -webkit-mask-image: radial-gradient(ellipse at 70% 52%, #000 0 48%, rgba(0, 0, 0, .88) 65%, rgba(0, 0, 0, .32) 83%, transparent 100%) !important;
  mask-image: radial-gradient(ellipse at 70% 52%, #000 0 48%, rgba(0, 0, 0, .88) 65%, rgba(0, 0, 0, .32) 83%, transparent 100%) !important;
}
body.luxury-comparison.bright-readable .hero-premium .bg-ink {
  opacity: .64 !important;
}
body.luxury-comparison.bright-readable .hero-premium .bg-veil {
  opacity: .53 !important;
}
body.luxury-comparison.bright-readable .hero-premium .copy .lead,
body.luxury-comparison.bright-readable .hero-premium .copy .desc {
  color: var(--bright-muted) !important;
}
body.luxury-comparison.bright-readable .hero-premium .copy .desc {
  opacity: .94 !important;
}

@keyframes brightReadableCardinalPulse {
  0%, 100% { fill: rgba(220, 191, 140, .94); opacity: .9; }
  50% { fill: rgba(255, 252, 240, 1); opacity: 1; }
}
body.luxury-comparison.bright-readable .hero-premium .cardinal text {
  animation: brightReadableCardinalPulse 6.8s ease-in-out infinite !important;
  filter: drop-shadow(0 0 6px rgba(255, 236, 193, .24)) !important;
}
body.luxury-comparison.bright-readable .hero-premium .bagua-marks {
  opacity: .68 !important;
}
body.luxury-comparison.bright-readable .hero-premium .bagua-marks text,
body.luxury-comparison.bright-readable .hero-premium .orbit-text.outer text,
body.luxury-comparison.bright-readable .hero-premium .orbit-text.inner text {
  /* 與二十八星宿的靜止刻字一致：暖銅金，不混白。 */
  fill: rgb(188, 148, 92) !important;
  opacity: .62 !important;
}
/* 八卦比星宿略亮一階，但仍維持霧金刻字，而非近白色。 */
body.luxury-comparison.bright-readable .hero-premium .bagua-marks text {
  fill: rgb(220, 178, 110) !important;
  opacity: .88 !important;
}
/* 坎、離、震、巽等八宮：僅次於天地人時，作為羅盤的第二閱讀層。 */
body.luxury-comparison.bright-readable .hero-premium .palace text {
  fill: rgb(239, 194, 112) !important;
  opacity: .94 !important;
  filter: drop-shadow(0 0 3px rgba(246, 200, 119, .20)) !important;
}
@keyframes brightReadableMansionLabelPulse {
  0%, 100% { fill: rgba(225, 215, 199, .66); opacity: .5; filter: none; }
  5.6% { fill: rgba(255, 239, 200, 1); opacity: 1; filter: drop-shadow(0 0 7px rgba(250, 217, 151, .48)); }
  12.4% { fill: rgba(241, 230, 209, .9); opacity: .86; filter: drop-shadow(0 0 2px rgba(231, 190, 110, .16)); }
  18% { fill: rgba(225, 215, 199, .66); opacity: .52; filter: none; }
}
body.luxury-comparison.bright-readable .hero-premium .xiu-stars .xiu-label {
  animation-name: brightReadableMansionLabelPulse !important;
}

/* 閱讀層級：正文先清楚，再保留金色給標題與行動。 */
body.luxury-comparison.bright-readable .chapter-lead,
body.luxury-comparison.bright-readable .section-copy p,
body.luxury-comparison.bright-readable .center-title p,
body.luxury-comparison.bright-readable .quote-side p,
body.luxury-comparison.bright-readable .need-list li,
body.luxury-comparison.bright-readable .need-list h2,
body.luxury-comparison.bright-readable .about-card p,
body.luxury-comparison.bright-readable .footer-contact p,
body.luxury-comparison.bright-readable .footer-contact a,
body.luxury-comparison.bright-readable .service-modal-prose p,
body.luxury-comparison.bright-readable .brand-modal-content p {
  color: var(--bright-muted) !important;
  opacity: 1 !important;
}
body.luxury-comparison.bright-readable .hero-premium .copy .lead,
body.luxury-comparison.bright-readable .hero-premium .copy .desc,
body.luxury-comparison.bright-readable .section-ju .center-title p:not(.eyebrow),
body.luxury-comparison.bright-readable .section-shi .quote-side p:not(.eyebrow) {
  color: rgba(207, 193, 171, .88) !important;
}
body.luxury-comparison.bright-readable .section-fate .section-title h2,
body.luxury-comparison.bright-readable .section-ju .center-title h2,
body.luxury-comparison.bright-readable .section-shi .quote-side h2,
body.luxury-comparison.bright-readable .section-create .create-copy h2,
body.luxury-comparison.bright-readable .section-about .section-title h2,
body.luxury-comparison.bright-readable .section-shi .quote-lines p,
body.luxury-comparison.bright-readable .about-card > span,
body.luxury-comparison.bright-readable .service-modal-title,
body.luxury-comparison.bright-readable .brand-modal-title {
  color: var(--bright-gold) !important;
}
body.luxury-comparison.bright-readable .eyebrow,
body.luxury-comparison.bright-readable .chapter-mark,
body.luxury-comparison.bright-readable .chapter-mark span,
body.luxury-comparison.bright-readable .about-card em,
body.luxury-comparison.bright-readable .footer-motto {
  color: var(--bright-bronze) !important;
  opacity: 1 !important;
}

/* 02、03、05：材質明一階，邊界仍然克制。 */
body.luxury-comparison.bright-readable .section-ju .service-gallery-v6 .art-card > span {
  color: rgba(235, 228, 217, .78) !important;
  transition: color .46s ease !important;
}
body.luxury-comparison.bright-readable .section-ju .service-gallery-v6 .art-card > em {
  color: rgba(217, 207, 191, .62) !important;
  transition: color .46s ease !important;
}
body.luxury-comparison.bright-readable .section-ju .service-gallery-v6 .art-card:hover > span,
body.luxury-comparison.bright-readable .section-ju .service-gallery-v6 .art-card:focus-visible > span {
  color: #d8be8c !important;
}
body.luxury-comparison.bright-readable .section-ju .service-gallery-v6 .art-card:hover > em,
body.luxury-comparison.bright-readable .section-ju .service-gallery-v6 .art-card:focus-visible > em {
  color: rgba(216, 190, 140, .9) !important;
}
body.luxury-comparison.bright-readable .section-ju .service-gallery-v6 .art-medallion {
  background:
    radial-gradient(circle at 44% 34%, rgba(216, 190, 140, .15), transparent 31%),
    radial-gradient(circle, rgba(58, 45, 34, .92), rgba(29, 22, 17, .96) 72%) !important;
  box-shadow:
    inset 0 0 0 1px rgba(216, 190, 140, .38),
    inset 0 0 38px rgba(185, 145, 110, .06),
    0 18px 46px rgba(0, 0, 0, .38) !important;
}
body.luxury-comparison.bright-readable .section-ju .service-gallery-v6 .artifact-disc {
  fill: rgba(43, 34, 27, .86) !important;
  stroke: rgba(216, 190, 140, .42) !important;
}
body.luxury-comparison.bright-readable .section-ju .service-gallery-v6 .paper {
  fill: rgba(68, 54, 42, .6) !important;
}
body.luxury-comparison.bright-readable .section-ju .service-gallery-v6 .art-name .art-medallion {
  background:
    radial-gradient(circle at 48% 34%, rgba(216, 190, 140, .15), transparent 31%),
    radial-gradient(circle, rgba(63, 49, 37, .92), rgba(29, 22, 17, .96) 72%) !important;
}
body.luxury-comparison.bright-readable .section-shi .shi-galaxy-field,
body.luxury-comparison.bright-readable .section-shi .shi-galaxy-field svg {
  opacity: .94 !important;
}
body.luxury-comparison.bright-readable .section-shi .classic-quote {
  background: radial-gradient(ellipse at 52% 50%, rgba(216, 190, 140, .10), transparent 62%) !important;
}
body.luxury-comparison.bright-readable .section-shi .quote-side::after {
  content: none !important;
  display: none !important;
}
body.luxury-comparison.bright-readable .section-shi .quote-lines p {
  color: rgba(222, 210, 191, .9) !important;
  text-shadow: 0 1px 14px rgba(0, 0, 0, .26) !important;
}
body.luxury-comparison.bright-readable .section-create .large-quote {
  color: rgba(218, 201, 172, .72) !important;
  text-shadow: 0 1px 16px rgba(0, 0, 0, .24) !important;
}
body.luxury-comparison.bright-readable .section-create .need-list h2,
body.luxury-comparison.bright-readable .section-create .need-list li {
  color: rgba(216, 190, 140, .86) !important;
}
body.luxury-comparison.bright-readable .section-create .need-list li span {
  color: rgba(216, 190, 140, .9) !important;
  border-color: rgba(185, 145, 110, .66) !important;
}
body.luxury-comparison.bright-readable .section-about .about-card {
  border-color: rgba(205, 167, 114, .42) !important;
  background:
    linear-gradient(110deg, rgba(236, 228, 216, .035), transparent 38%),
    linear-gradient(180deg, rgba(47, 35, 26, .88), rgba(23, 16, 12, .92)) !important;
}
body.luxury-comparison.bright-readable .section-about .about-card:hover {
  border-color: rgba(221, 193, 140, .68) !important;
  background:
    linear-gradient(110deg, rgba(216, 190, 140, .07), transparent 38%),
    linear-gradient(180deg, rgba(55, 40, 29, .92), rgba(28, 19, 14, .94)) !important;
}

/* 04：新場景在關門時仍能隱約辨識；開門後才完整透亮。 */
body.luxury-comparison.bright-readable .section-create .fortune-gate-window {
  background: #120c08 !important;
  box-shadow: inset 0 0 18px rgba(0, 0, 0, .38), 0 0 28px rgba(185, 145, 110, .13) !important;
}
body.luxury-comparison.bright-readable .section-create .fortune-scenery img {
  opacity: .42 !important;
  filter: saturate(.94) contrast(1.04) brightness(.9) !important;
}
body.luxury-comparison.bright-readable .section-create .fortune-gate-window::before {
  opacity: .46 !important;
}
body.luxury-comparison.bright-readable .section-create .fortune-gate-scene:hover .fortune-scenery img,
body.luxury-comparison.bright-readable .section-create .fortune-gate-scene:focus-within .fortune-scenery img,
body.luxury-comparison.bright-readable .section-create .fortune-gate-scene.is-open .fortune-scenery img,
body.luxury-comparison.bright-readable .section-create .fortune-gate-scene.is-journey-visible .fortune-scenery img {
  opacity: 1 !important;
  filter: saturate(1.02) contrast(1.04) brightness(1.03) !important;
}
body.luxury-comparison.bright-readable .section-create .fortune-gate-scene:hover .fortune-gate-window::before,
body.luxury-comparison.bright-readable .section-create .fortune-gate-scene:focus-within .fortune-gate-window::before,
body.luxury-comparison.bright-readable .section-create .fortune-gate-scene.is-open .fortune-gate-window::before,
body.luxury-comparison.bright-readable .section-create .fortune-gate-scene.is-journey-visible .fortune-gate-window::before {
  opacity: .04 !important;
}

/* 04：門闔上時才靜靜換景；推門後鎖住此刻的天地。 */
body.luxury-comparison.bright-readable .section-create .fortune-scenery {
  isolation: isolate;
}
body.luxury-comparison.bright-readable .section-create .fortune-scenery img {
  will-change: opacity, filter, transform;
}
body.luxury-comparison.bright-readable .section-create .fortune-scenery.is-scene-changing img:not(.fortune-scene-next) {
  opacity: 0 !important;
  filter: saturate(.94) contrast(1.04) brightness(.9) !important;
  transition: opacity .86s cubic-bezier(.32,.72,.2,1) !important;
}
body.luxury-comparison.bright-readable .section-create .fortune-scenery .fortune-scene-next {
  position: absolute !important;
  inset: 0 !important;
  z-index: 2 !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  opacity: 0 !important;
  filter: saturate(.94) contrast(1.04) brightness(.9) !important;
  transform: none !important;
  pointer-events: none !important;
  transition: opacity .86s cubic-bezier(.32,.72,.2,1) !important;
}
body.luxury-comparison.bright-readable .section-create .fortune-scenery .fortune-scene-next.is-visible {
  opacity: .42 !important;
}

@media (prefers-reduced-motion: reduce) {
  body.luxury-comparison.bright-readable .section-create .fortune-scenery.is-scene-changing img:not(.fortune-scene-next),
  body.luxury-comparison.bright-readable .section-create .fortune-scenery .fortune-scene-next {
    transition: none !important;
  }
}

/* CTA 維持金線邀請感，不改成亮色填滿按鈕。 */
body.luxury-comparison.bright-readable .reserve,
body.luxury-comparison.bright-readable .btn.secondary {
  color: var(--bright-gold) !important;
  border-color: rgba(221, 193, 140, .72) !important;
  background: rgba(31, 21, 14, .30) !important;
  box-shadow: inset 0 1px 0 rgba(240, 232, 219, .09) !important;
}
body.luxury-comparison.bright-readable .btn.primary,
body.luxury-comparison.bright-readable .consultation-submit {
  color: #f0d8a6 !important;
  border-color: rgba(222, 188, 130, .76) !important;
  background: linear-gradient(118deg, #5d432d 0%, #896845 50%, #4c3627 100%) !important;
  box-shadow: inset 0 1px 0 rgba(255, 240, 201, .15), 0 8px 24px rgba(33, 20, 11, .22) !important;
}
body.luxury-comparison.bright-readable .small-gold-btn {
  color: #e6ca93 !important;
  border-color: rgba(228, 191, 122, .68) !important;
  background: transparent !important;
  box-shadow: none !important;
}
body.luxury-comparison.bright-readable .reserve:hover,
body.luxury-comparison.bright-readable .btn.secondary:hover,
body.luxury-comparison.bright-readable .small-gold-btn:hover {
  color: #f1d9a7 !important;
  border-color: rgba(241, 217, 167, .88) !important;
  background: rgba(185, 145, 110, .07) !important;
}
body.luxury-comparison.bright-readable .btn.primary:hover,
body.luxury-comparison.bright-readable .consultation-submit:hover {
  color: #f7e2b6 !important;
  border-color: #f0d4a0 !important;
  background: linear-gradient(118deg, #704f32 0%, #9b754a 50%, #5b3f2c 100%) !important;
}

body.luxury-comparison.bright-readable .modal-panel:not(.brand-modal-panel) {
  border-color: rgba(205, 167, 114, .54) !important;
  background:
    linear-gradient(105deg, rgba(236, 228, 216, .04) 0 1px, transparent 1px 20px),
    linear-gradient(180deg, rgba(52, 38, 28, .985), rgba(20, 14, 10, .99)) !important;
}
body.luxury-comparison.bright-readable .site-footer {
  background: #100b08 !important;
  border-top-color: rgba(205, 167, 114, .35) !important;
}
body.luxury-comparison.bright-readable .footer-contact a:hover {
  color: #f0d7a1 !important;
}

@media (max-width: 760px) {
  body.luxury-comparison.bright-readable .section-copy p,
  body.luxury-comparison.bright-readable .about-card p,
  body.luxury-comparison.bright-readable .footer-contact p,
  body.luxury-comparison.bright-readable .footer-contact a {
    font-size: 16px !important;
    line-height: 2 !important;
  }
  body.luxury-comparison.bright-readable .hero-premium .bg-mountain {
    opacity: .76 !important;
    filter: contrast(1.03) saturate(.78) brightness(.88) !important;
  }
}

/* 校閱長文版：把 Hero 與 04 從展示字改為可安靜閱讀的主張。 */
body.luxury-comparison.bright-readable .hero-premium .copy {
  width: min(44vw, 720px) !important;
  max-width: 720px !important;
}
body.luxury-comparison.bright-readable .hero-premium .copy h1 {
  font-size: clamp(25px, 1.45vw, 30px) !important;
  line-height: 1.65 !important;
  letter-spacing: 0 !important;
  text-wrap: pretty;
}
body.luxury-comparison.bright-readable .hero-premium .copy .lead {
  max-width: 600px !important;
  font-size: clamp(14px, .82vw, 16px) !important;
  line-height: 2 !important;
  letter-spacing: 0 !important;
}
body.luxury-comparison.bright-readable .hero-premium .copy .desc {
  max-width: 620px !important;
  font-size: clamp(13px, .76vw, 15px) !important;
  line-height: 2 !important;
  letter-spacing: 0 !important;
}

body.luxury-comparison.bright-readable .section-create .create-copy {
  max-width: min(31vw, 470px) !important;
}
body.luxury-comparison.bright-readable .section-create .create-copy .large-quote {
  max-width: 31ch !important;
  font-size: clamp(20px, 1.4vw, 26px) !important;
  line-height: 1.8 !important;
  letter-spacing: 0 !important;
}

@media (max-width: 760px) {
  body.luxury-comparison.bright-readable .hero-premium .copy {
    width: calc(100% - 48px) !important;
    max-width: none !important;
  }
  body.luxury-comparison.bright-readable .hero-premium .copy h1 {
    font-size: clamp(23px, 6.4vw, 29px) !important;
    line-height: 1.56 !important;
  }
  body.luxury-comparison.bright-readable .hero-premium .copy .lead {
    font-size: 14px !important;
    line-height: 1.9 !important;
  }
  body.luxury-comparison.bright-readable .hero-premium .copy .desc {
    font-size: 13px !important;
    line-height: 1.9 !important;
  }
  body.luxury-comparison.bright-readable .section-create .create-copy {
    max-width: none !important;
  }
  body.luxury-comparison.bright-readable .section-create .create-copy .large-quote {
    max-width: 100% !important;
    font-size: clamp(18px, 4.6vw, 21px) !important;
    line-height: 1.82 !important;
  }
}