/* Configured total prices, with a shared monthly tariff. */
.detail-primary[aria-disabled="true"] { opacity: .5; pointer-events: none; }
.fusion-row .fusion-term { line-height: 1.8; }
.fusion-row[hidden], .plan-card[hidden] { display: none !important; }

.product-design-page .fusion-panel { height: auto; }
.product-design-page .fusion-row { display: grid; grid-template-columns: 140px minmax(150px, 1fr) minmax(130px, 1fr) minmax(270px, 1.6fr); align-items: center; gap: 24px; height: auto; padding: 24px; }
.product-design-page .fusion-row .fusion-price, .product-design-page .fusion-row > p { width: auto; margin: 0; }
.product-design-page .fusion-row .fusion-term { white-space: normal; }
.tariff-grid { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 4px 12px; text-align: right; }
.tariff-grid > span:nth-child(3n + 1) { text-align: left; }
.tariff-grid b { color: #d63c00; }
@media(max-width: 980px) { .product-design-page .fusion-row { grid-template-columns: 1fr 1fr; gap: 18px; }.product-design-page .fusion-row .fusion-term { grid-column: 1 / -1; } }
@media(max-width: 420px) { .product-design-page .fusion-row { grid-template-columns: 1fr; padding: 18px; }.product-design-page .fusion-row .fusion-summary { display: none; } }

.product-detail-page .detail-fusion-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.product-detail-page .detail-term-summary, .product-detail-page .detail-benefit-summary { width: auto; min-width: 0; white-space: normal; }
.product-detail-page .product-card-topline b { font-size: calc(var(--detail-card-size) * .08); }
@media(max-width: 420px) { .product-detail-page .detail-fusion-facts { gap: 12px; } }


/* Compare both prices directly, then select the matching business intent. */
.product-detail-page .detail-tariff-options { max-width: 560px; margin-top: 28px; }
.detail-choice-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; margin-bottom: 12px; }
.product-detail-page .detail-choice-heading h2 { color: #49372e; font: 600 14px/22px var(--detail-semibold); }
.detail-choice-heading > span { color: #a39287; font: 400 12px/20px var(--detail-regular); }
.detail-business-choices { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.detail-business-choice { position: relative; display: flex; flex-direction: column; min-width: 0; min-height: 140px; padding: 20px 18px 17px; border: 1px solid #eadbd1; border-radius: 12px; background: rgba(255, 255, 255, .72); cursor: pointer; transition: border-color .16s, background-color .16s; }
.detail-business-choice:hover { border-color: #eaa081; }
.detail-business-choice.is-selected { border-color: #ed623c; background: #fff1e9; box-shadow: inset 0 0 0 1px #ed623c; }
.detail-choice-title { padding-right: 26px; color: #5d483d; font: 500 15px/22px var(--detail-medium); }
.detail-choice-input { position: absolute; top: 19px; right: 17px; width: 20px; height: 20px; margin: 0; opacity: 0; }
.detail-choice-indicator { position: absolute; top: 20px; right: 18px; width: 18px; height: 18px; border: 1px solid #d8c7bc; border-radius: 50%; background: #fff; }
.detail-business-choice.is-selected .detail-choice-indicator { border-color: #e9472b; background: #e9472b; }
.detail-business-choice.is-selected .detail-choice-indicator::after { position: absolute; top: 2px; left: 5px; width: 5px; height: 9px; border-right: 2px solid #fff; border-bottom: 2px solid #fff; transform: rotate(45deg); content: ""; }
.detail-choice-input:focus-visible ~ .detail-choice-indicator { outline: 2px solid #e9472b; outline-offset: 4px; }
.detail-choice-price { display: flex; align-items: baseline; flex-wrap: wrap; column-gap: 3px; margin-top: 15px; color: #655044; font: 500 34px/38px "D-DIN Pro", Arial, sans-serif; }
.detail-business-choice.is-selected .detail-choice-title, .detail-business-choice.is-selected .detail-choice-price { color: #e9472b; }
.detail-choice-price .detail-choice-currency { font-size: 20px; }
.detail-choice-price small { margin-left: 6px; color: #aa9384; font: 400 11px/18px var(--detail-regular); }
.detail-choice-note { display: block; margin-top: 8px; color: #9b8678; font: 400 11px/18px var(--detail-regular); overflow-wrap: anywhere; }
.detail-business-choice.is-unavailable { background: #f8f4f1; border-color: #eee5df; cursor: default; }
.detail-business-choice.is-unavailable .detail-choice-price { color: #b4a399; font: 400 16px/38px var(--detail-regular); }
.detail-business-choice.is-unavailable .detail-choice-title, .detail-business-choice.is-unavailable .detail-choice-note { color: #b4a399; }
.product-detail-page .detail-monthly-line { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-top: 14px; color: #9e8b7e; font: 400 12px/20px var(--detail-regular); }
.detail-monthly-line b { color: #736055; font-weight: 500; }
.detail-selection-announcement { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.detail-term-group { margin-bottom: 22px; }
.detail-selection-label { display: block; margin-bottom: 10px; color: #49372e; font: 600 14px/22px var(--detail-semibold); }
.detail-term-options { display: flex; flex-wrap: wrap; gap: 8px; }
.detail-term-options button { flex: 0 1 90px; min-height: 36px; padding: 6px 14px; border: 1px solid #eadbd2; border-radius: 6px; color: #8b7c72; background: rgba(255, 255, 255, .65); font: 400 13px/20px var(--detail-regular); cursor: pointer; }
.detail-term-options button[aria-pressed="true"] { border-color: #ed9472; color: #e9472b; background: #fff1e9; }
.detail-term-options button:focus-visible { outline: 2px solid #e9472b; outline-offset: 3px; }
.detail-tariff-loading, .detail-pricing-error { grid-column: 1 / -1; padding: 24px 0; color: #9b8678; font-size: 13px; }
.product-detail-page .detail-actions { margin-top: 22px; }
.product-detail-page .detail-tariff-disclaimer { max-width: 560px; margin-top: 12px; color: #ac9b8e; font: 400 11px/18px var(--detail-regular); }
.product-detail-page .detail-fusion-facts { margin-top: 26px; }
@media(max-width: 760px) {
  .product-detail-page .detail-tariff-options { margin-top: 24px; }
  .detail-business-choices { gap: 10px; }
  .detail-business-choice { min-height: 130px; padding: 17px 14px 14px; border-radius: 10px; }
  .detail-choice-input { top: 17px; right: 13px; }
  .detail-choice-indicator { top: 18px; right: 14px; width: 16px; height: 16px; }
  .detail-business-choice.is-selected .detail-choice-indicator::after { top: 1px; left: 4px; }
  .detail-choice-price { margin-top: 13px; font-size: 30px; line-height: 34px; }
  .detail-choice-note { font-size: 10px; line-height: 17px; }
  .detail-choice-heading > span { font-size: 11px; }
  .detail-term-options { gap: 7px; }
  .detail-term-options button { flex: 1 1 60px; padding: 6px 8px; font-size: 12px; }
}

/* Highlight the lower configured price; show the other type as a secondary detail. */
.term-card .term-card-total { display: flex; flex-wrap: wrap; align-items: baseline; white-space: nowrap; }
.term-card-total i { display: inline-flex; align-items: baseline; gap: 9px; }
.term-card-price-kind { color: #b07b64; font: 400 11px/18px "PingFang SC", sans-serif; }
/* Keep legacy selectors while cached pages transition to the price-neutral names. */
.product-design-page .term-card-secondary, .product-design-page .term-card-renewal { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0 4px; margin-top: 5px; color: #a08374; font: 400 12px/20px "PingFang SC", sans-serif; }
.term-card-secondary b, .term-card-renewal b, .plan-card .plan-card-secondary-price { color: #8a6756; font: 500 17px/20px "D-DIN Pro", Arial, sans-serif; }
.term-card .term-card-price-unavailable { color: #ad8f7d; font-size: 22px; }
.plan-card > .plan-card-price { right: 30px; }
.plan-card .plan-card-total { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 12px; line-height: 1.15; }
.plan-card .plan-card-secondary, .plan-card .plan-card-renewal { flex-basis: 100%; color: #a56e59; font: 400 12px/18px "PingFang SC", sans-serif; }
.card-installation-suffix { color: #a08374; font: 600 11px/18px "PingFang SC", sans-serif; white-space: nowrap; }
.term-card-total > .card-installation-suffix { flex-basis: 100%; }
.plan-card .home-card-prices, .term-card .home-card-prices { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin: 0; }
.term-card .term-card-pricing { margin-top: 26px; }
.home-card-price-option { min-width: 0; color: #8a6756; }
.home-card-price-option dt { color: #937666; font: 500 12px/18px "PingFang SC", sans-serif; }
.home-card-price-option dd { display: flex; align-items: baseline; gap: 2px; margin: 4px 0 0; font: 500 28px/32px "D-DIN Pro", Arial, sans-serif; }
.home-card-price-currency { font-size: 18px; }
.home-card-price-option.is-lowest, .home-card-price-option.is-lowest dt { color: #e9472b; }
.home-card-price-option.is-unavailable, .home-card-price-option.is-unavailable dt { color: #b39c8d; }
.home-card-price-unavailable { font: 400 14px/32px "PingFang SC", sans-serif; }
.plan-card .home-card-installation-note, .term-card .home-card-installation-note { margin: 8px 0 0; font: 600 11px/18px "PingFang SC", sans-serif; }
.home-card-installation-note .card-installation-suffix { white-space: normal; overflow-wrap: anywhere; }
.plan-card .home-pricing-message { margin: 0; color: #a08374; font: 400 12px/20px "PingFang SC", sans-serif; }
/* Group the reference monthly tariff with the title; make the lower total the focal point. */
.term-card { background-image: linear-gradient(rgba(255, 250, 248, .28), rgba(255, 250, 248, .28)), url("assets/lanhu-hd/bg_product1@2x.png"); }
.term-card > span { color: #3e3029; font-size: 15px; font-weight: 600; line-height: 22px; }
.term-card-featured > em { top: 0; right: 0; }
.term-card > small { margin-top: 18px; color: #86776d; font-size: 13px; }
.term-card > small b { color: #685a51; font-size: 17px; }
.term-card .home-card-price-option { color: #70584b; }
.term-card .home-card-price-option dt { color: inherit; line-height: 20px; }
.term-card .home-card-price-option dd { display: block; height: 40px; margin-top: 6px; font-size: 36px; line-height: 40px; white-space: nowrap; }
.term-card .home-card-price-amount { font-size: 26px; }
.term-card .home-card-price-currency { margin-right: 2px; font-size: 16px; }
.term-card .home-card-price-option.is-lowest { color: #e9472b; }
.term-card .home-card-price-option.is-lowest dt { font-weight: 600; }
.term-card .home-card-price-option.is-lowest .home-card-price-amount { font-size: 36px; }
.term-card .home-card-price-option.is-unavailable { color: #a08c7e; }
.term-card .home-card-installation-note { margin-top: 14px; }
.term-card .card-installation-suffix { color: #816c5e; font-size: 12px; }
@media(min-width: 761px) and (max-width: 980px) { .term-card-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media(max-width: 1240px) { .plan-card > .plan-card-price { right: 22px; } }
@media(max-width: 760px) {
  .term-card-price-kind { font-size: 10px; }
  .product-design-page .term-card-secondary, .product-design-page .term-card-renewal { margin-top: 4px; font-size: 11px; }
  .term-card-secondary b, .term-card-renewal b, .plan-card .plan-card-secondary-price { font-size: 16px; }
  .plan-card .plan-card-secondary, .plan-card .plan-card-renewal { font-size: 11px; }
  .card-installation-suffix { font-size: 10px; }
  .plan-card > .plan-card-price { bottom: 68px; }
  .term-card > span { font-size: 13px; line-height: 18px; }
  .term-card > small { margin-top: 14px; }
  .term-card .term-card-pricing { margin-top: 22px; }
  .term-card .home-card-prices { gap: 12px; }
  .term-card .home-card-price-option dd { height: 36px; font-size: 30px; line-height: 36px; }
  .term-card .home-card-price-amount { font-size: 22px; }
  .term-card .home-card-price-option.is-lowest .home-card-price-amount { font-size: 30px; }
  .term-card .home-card-price-currency { font-size: 15px; }
  .term-card .home-card-installation-note { margin-top: 12px; }
  .term-card .card-installation-suffix { font-size: 11px; }
}
@media(max-width: 360px) {
  .term-card .home-card-prices { gap: 8px; }
  .term-card .home-card-price-option dd { height: 32px; font-size: 26px; line-height: 32px; }
  .term-card .home-card-price-amount { font-size: 20px; }
  .term-card .home-card-price-option.is-lowest .home-card-price-amount { font-size: 24px; }
  .term-card .home-card-price-currency { margin-right: 1px; font-size: 13px; }
}
