:root {
  --ink: #263632;
  --ink-soft: #4d5a55;
  --paper: #f6f4ef;
  --paper-deep: #ebe8df;
  --sage: #a9b9a4;
  --sage-dark: #708775;
  --sage-pale: #dbe4d8;
  --terracotta: #c57d68;
  --gold: #b89863;
  --white: #fffdfa;
  --line: rgba(38, 54, 50, 0.16);
  --shadow: 0 24px 65px rgba(38, 54, 50, 0.12);
  --serif: "Noto Serif TC", "Songti TC", serif;
  --sans: "Noto Sans TC", "PingFang TC", sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--paper); color: var(--ink); font-family: var(--sans); font-size: 15px; line-height: 1.7; }
button, input, textarea { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
a { color: inherit; text-decoration: none; }
button { border: 0; background: none; cursor: pointer; color: inherit; }
.site-shell { overflow: hidden; }
.section-pad { padding-left: clamp(24px, 7vw, 108px); padding-right: clamp(24px, 7vw, 108px); }
.site-header { height: 82px; padding: 0 clamp(24px, 7vw, 108px); display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid rgba(38, 54, 50, 0.08); position: sticky; top: 0; z-index: 20; background: rgba(246, 244, 239, .92); backdrop-filter: blur(16px); }
.brand { display: inline-flex; align-items: center; gap: 11px; }
.brand-logo { width: 148px; height: 58px; object-fit: contain; mix-blend-mode: multiply; display: block; }
.brand-copy { display: flex; flex-direction: column; line-height: 1.05; }
.brand-copy strong { font-family: var(--serif); font-size: 17px; letter-spacing: .08em; }
.brand-copy small { color: var(--ink-soft); font-size: 8px; letter-spacing: .14em; text-transform: uppercase; margin-top: 5px; }
.desktop-nav { display: flex; gap: clamp(20px, 3vw, 45px); margin-left: 90px; }
.desktop-nav a, .text-button { color: var(--ink-soft); font-size: 13px; transition: color .2s ease; }
.desktop-nav a:hover, .text-button:hover { color: var(--terracotta); }
.header-actions { display: flex; align-items: center; gap: 24px; }
.language-toggle { padding: 5px 8px; border: 1px solid var(--line); color: var(--ink-soft); font-size: 10px; letter-spacing: .12em; transition: color .2s ease, border-color .2s ease, background .2s ease; }
.language-toggle:hover { color: var(--terracotta); border-color: var(--terracotta); background: rgba(197,125,104,.06); }
.text-button { padding: 8px 0; }
.header-cta { border-bottom: 1px solid var(--ink); font-size: 13px; padding-bottom: 4px; }
.header-cta span, .button span, .card-arrow span, .inline-link span { display: inline-block; margin-left: 9px; transition: transform .2s ease; }
.header-cta:hover span, .button:hover span, .card-arrow:hover span, .inline-link:hover span { transform: translate(3px, -3px); }

.hero { min-height: 690px; padding-top: clamp(74px, 10vw, 135px); padding-bottom: 45px; display: grid; grid-template-columns: minmax(0, 1.03fr) minmax(360px, .97fr); column-gap: 5vw; position: relative; }
.hero:before { content: ""; position: absolute; width: 42vw; height: 42vw; max-width: 660px; max-height: 660px; top: -24vw; left: -14vw; border-radius: 50%; background: rgba(219, 228, 216, .58); z-index: -1; }
.eyebrow, .section-kicker, .tiny-label, .stage-overline, .cart-label { font-size: 10px; letter-spacing: .2em; text-transform: uppercase; color: var(--sage-dark); font-weight: 700; }
.eyebrow-line { display: inline-block; width: 32px; height: 1px; vertical-align: middle; background: var(--terracotta); margin-right: 8px; }
h1, h2, h3, p { margin-top: 0; }
h1, h2, h3 { font-family: var(--serif); font-weight: 600; line-height: 1.18; }
h1 { font-size: clamp(46px, 6.5vw, 88px); letter-spacing: -.06em; margin: 23px 0 27px; }
h1 em, h2 em { font-style: normal; color: var(--terracotta); }
.hero-description { max-width: 480px; color: var(--ink-soft); font-size: 16px; line-height: 2; }
.hero-actions { display: flex; align-items: center; gap: 26px; margin-top: 38px; }
.button { min-height: 49px; display: inline-flex; align-items: center; justify-content: center; padding: 0 23px; font-size: 13px; letter-spacing: .05em; transition: transform .2s ease, background .2s ease, color .2s ease; }
.button:hover { transform: translateY(-2px); }
.button-primary { background: var(--ink); color: var(--white); }
.button-primary:hover { background: var(--terracotta); }
.button-quiet { padding-left: 0; padding-right: 0; border-bottom: 1px solid var(--line); }
.hero-note { margin-top: 36px; color: var(--ink-soft); font-size: 11px; letter-spacing: .12em; }
.spark { color: var(--terracotta); font-size: 18px; margin-right: 9px; }
.hero-visual { min-height: 490px; position: relative; display: flex; align-items: center; justify-content: center; }
.hero-orbit { position: absolute; border: 1px solid rgba(112, 135, 117, .34); border-radius: 50%; transform: rotate(-27deg); }
.orbit-one { width: 430px; height: 550px; }
.orbit-two { width: 320px; height: 460px; transform: rotate(39deg); border-color: rgba(197, 125, 104, .25); }
.hero-card-main { width: min(78%, 342px); min-height: 415px; padding: 28px 29px 24px; background: var(--sage); color: var(--white); box-shadow: var(--shadow); transform: rotate(4deg); position: relative; z-index: 2; display: flex; flex-direction: column; justify-content: space-between; background-image: radial-gradient(circle at 86% 15%, rgba(255,255,255,.18) 0 2px, transparent 3px), radial-gradient(circle at 12% 79%, rgba(255,255,255,.13) 0 1px, transparent 2px); }
.hero-card-main:after { content: ""; position: absolute; inset: 12px; border: 1px solid rgba(255,255,255,.34); pointer-events: none; }
.card-topline, .hero-card-footer { display: flex; justify-content: space-between; position: relative; z-index: 1; font-size: 9px; letter-spacing: .16em; }
.card-date { opacity: .8; }
.hero-monogram { font: 900 70px/1 var(--serif); letter-spacing: -.09em; text-align: center; position: relative; z-index: 1; }
.hero-monogram-big { font-size: clamp(35px, 4vw, 52px); letter-spacing: .02em; white-space: nowrap; }
.hero-monogram-big span { color: #f2c7a9; font: 400 27px var(--sans); margin: 0 6px; vertical-align: 6%; }
.hero-monogram span { color: #f2c7a9; font: 400 23px var(--sans); vertical-align: 36%; margin: 0 3px; }
.hero-card-main p { font: 500 23px/1.55 var(--serif); letter-spacing: .02em; position: relative; z-index: 1; margin: 0 10px; }
.hero-card-main p strong { color: #f5d3c2; font-weight: 600; }
.floating-stamp { position: absolute; z-index: 3; width: 122px; height: 122px; border-radius: 50%; right: 3%; top: 8%; background: var(--terracotta); color: var(--white); display: flex; flex-direction: column; justify-content: center; align-items: center; transform: rotate(12deg); box-shadow: 12px 17px 0 rgba(255,255,255,.55); }
.floating-stamp span { font-size: 13px; letter-spacing: .12em; }
.floating-stamp strong { font: 600 23px var(--serif); }
.floating-stamp small { font-size: 7px; letter-spacing: .14em; margin-top: 4px; opacity: .8; }
.hero-sprig { position: absolute; color: var(--sage-dark); font-size: 130px; font-family: var(--serif); z-index: 1; opacity: .75; }
.sprig-left { left: 2%; bottom: 9%; transform: rotate(-34deg); }
.sprig-right { right: 0; bottom: -7%; transform: rotate(134deg) scale(.65); color: var(--terracotta); }
.hero-bottom { grid-column: 1 / -1; border-top: 1px solid var(--line); display: flex; gap: clamp(40px, 9vw, 140px); padding-top: 23px; margin-top: 3px; }
.hero-stat { display: flex; align-items: start; gap: 14px; }
.hero-stat strong { color: var(--terracotta); font: 500 19px var(--serif); }
.hero-stat span { font-size: 11px; line-height: 1.55; color: var(--ink-soft); }

.intro { padding-top: 116px; padding-bottom: 123px; background: var(--white); }
.section-kicker { display: flex; align-items: center; gap: 14px; }
.section-kicker > span:first-child { color: var(--terracotta); font-family: var(--serif); font-size: 16px; letter-spacing: 0; }
.kicker-rule { width: 44px; height: 1px; background: var(--line); }
.intro-grid { display: grid; grid-template-columns: 1.06fr .94fr; gap: 6vw; margin-top: 43px; align-items: end; }
h2 { font-size: clamp(38px, 5vw, 65px); letter-spacing: -.055em; margin-bottom: 0; }
.intro-body { max-width: 405px; color: var(--ink-soft); line-height: 2; }
.inline-link { display: inline-block; color: var(--terracotta); font-size: 13px; margin-top: 18px; border-bottom: 1px solid rgba(197,125,104,.4); padding-bottom: 4px; }
.path-cards { display: grid; grid-template-columns: repeat(4, 1fr); gap: 13px; margin-top: 76px; }
.path-card { min-height: 305px; padding: 23px 21px 22px; background: var(--paper); display: flex; flex-direction: column; border: 1px solid transparent; transition: transform .25s ease, border-color .25s ease; }
.path-card:hover { transform: translateY(-7px); border-color: var(--sage); }
.path-card-featured { background: var(--ink); color: var(--white); }
.path-card-light { background: var(--sage-pale); }
.path-number { font-size: 9px; letter-spacing: .17em; opacity: .62; }
.path-icon { color: var(--terracotta); font-size: 33px; line-height: 1; margin: 54px 0 14px; }
.path-card h3 { font-size: 23px; margin: 0 0 9px; }
.path-card p { color: var(--ink-soft); font-size: 12px; line-height: 1.75; margin-bottom: 17px; }
.path-card-featured p { color: rgba(255,255,255,.68); }
.card-arrow { margin-top: auto; font-size: 11px; text-align: left; letter-spacing: .08em; color: var(--terracotta); padding: 0; }

.promise-band { background: var(--sage); color: var(--white); display: grid; grid-template-columns: .85fr 1.15fr; gap: 8vw; padding-top: 98px; padding-bottom: 98px; }
.promise-band .eyebrow { color: rgba(255,255,255,.67); }
.promise-band h2 { margin-top: 32px; }
.promise-band h2 em { color: #f4ccba; }
.promise-list { border-top: 1px solid rgba(255,255,255,.35); }
.promise-item { display: grid; grid-template-columns: 65px 1fr; gap: 17px; padding: 29px 0 26px; border-bottom: 1px solid rgba(255,255,255,.35); }
.promise-index { color: #f4ccba; font: 600 17px var(--serif); }
.promise-item h3 { font: 600 21px var(--serif); margin-bottom: 6px; }
.promise-item p { color: rgba(255,255,255,.75); font-size: 12px; margin: 0; }

.planner-section { padding-top: 116px; padding-bottom: 122px; background: var(--paper); }
.planner-heading { display: flex; justify-content: space-between; align-items: end; gap: 35px; margin-top: 39px; }
.planner-heading h2 { max-width: 650px; }
.planner-heading p { color: var(--ink-soft); max-width: 430px; font-size: 13px; margin: 21px 0 0; }
.planner-badge { padding: 10px 0; font-size: 10px; color: var(--sage-dark); letter-spacing: .1em; white-space: nowrap; }
.badge-dot { width: 7px; height: 7px; background: var(--terracotta); border-radius: 50%; display: inline-block; margin-right: 7px; }
.planner-steps { margin-top: 52px; display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.planner-step { padding: 17px 14px 14px 0; position: relative; text-align: left; color: var(--ink-soft); }
.planner-step + .planner-step { padding-left: 14px; border-left: 1px solid var(--line); }
.planner-step:after { content: ""; position: absolute; left: 0; bottom: -1px; height: 3px; width: 0; background: var(--terracotta); transition: width .3s ease; }
.planner-step.is-active { color: var(--ink); }
.planner-step.is-active:after { width: 100%; }
.step-number { font: 600 16px var(--serif); color: var(--terracotta); margin-right: 10px; }
.step-name { font-size: 13px; }
.step-meta { display: block; font-size: 10px; opacity: .65; margin-top: 4px; }
.planner-layout { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(330px, .65fr); align-items: start; gap: 16px; margin-top: 16px; }
.stage-panel { background: var(--white); min-height: 640px; padding: 36px 38px 28px; }
.stage-heading { display: flex; justify-content: space-between; align-items: start; border-bottom: 1px solid var(--line); padding-bottom: 24px; }
.stage-heading h3 { font-size: 38px; margin: 4px 0 0; }
.stage-heading > span { font-size: 11px; color: var(--ink-soft); margin-top: 12px; }
.stage-description { max-width: 585px; font-size: 13px; color: var(--ink-soft); margin: 20px 0 24px; }
.service-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 11px; }
.service-card { border: 1px solid var(--line); padding: 19px; min-height: 181px; display: flex; flex-direction: column; transition: border-color .2s ease, background .2s ease, transform .2s ease; }
.service-card:hover { transform: translateY(-3px); border-color: var(--sage-dark); }
.service-card.is-selected { background: var(--sage-pale); border-color: var(--sage-dark); }
.service-card-top { display: flex; justify-content: space-between; align-items: start; gap: 12px; }
.service-category { color: var(--sage-dark); font-size: 9px; letter-spacing: .13em; text-transform: uppercase; }
.service-toggle { width: 27px; height: 27px; border: 1px solid var(--line); border-radius: 50%; font-size: 18px; line-height: 20px; color: var(--terracotta); flex: 0 0 auto; }
.service-card.is-selected .service-toggle { background: var(--terracotta); color: var(--white); border-color: var(--terracotta); font-size: 15px; }
.service-card h4 { font: 600 18px var(--serif); line-height: 1.3; margin: 21px 0 5px; }
.service-card p { color: var(--ink-soft); font-size: 11px; line-height: 1.65; margin: 0; }
.service-card-footer { display: flex; justify-content: space-between; align-items: end; margin-top: auto; padding-top: 16px; }
.service-price { font: 600 15px var(--serif); }
.service-price small { font: 400 9px var(--sans); color: var(--ink-soft); margin-left: 3px; }
.service-action { font-size: 10px; color: var(--terracotta); }
.stage-nav { display: flex; justify-content: space-between; margin-top: 29px; }
.stage-prev, .stage-next { font-size: 12px; padding: 10px 0; color: var(--ink-soft); }
.stage-next { color: var(--terracotta); }
.stage-prev:disabled { opacity: .3; cursor: default; }
.stage-next span { display: inline-block; margin-left: 10px; transition: transform .2s ease; }
.stage-next:hover span { transform: translateX(4px); }
.cart-panel { background: var(--ink); color: var(--white); padding: 28px 25px 23px; min-height: 640px; display: flex; flex-direction: column; position: sticky; top: 104px; }
.cart-top { display: flex; justify-content: space-between; align-items: start; }
.cart-label { color: rgba(255,255,255,.45); }
.cart-top h3 { font-size: 23px; margin: 8px 0 0; }
.cart-count { color: #f4ccba; font-size: 11px; margin-top: 2px; }
.selected-list { margin-top: 28px; max-height: 260px; overflow-y: auto; padding-right: 3px; }
.selected-list::-webkit-scrollbar { width: 3px; }
.selected-list::-webkit-scrollbar-thumb { background: rgba(255,255,255,.3); }
.selected-item { display: flex; justify-content: space-between; gap: 10px; padding: 13px 0; border-bottom: 1px solid rgba(255,255,255,.2); }
.selected-item-info { display: flex; gap: 10px; min-width: 0; }
.selected-item-index { color: #f4ccba; font: 600 12px var(--serif); }
.selected-item-name { font: 500 12px var(--sans); line-height: 1.4; }
.selected-item-stage { display: block; color: rgba(255,255,255,.48); font-size: 9px; margin-top: 2px; }
.selected-item-price { color: #f4ccba; font: 500 12px var(--serif); white-space: nowrap; }
.remove-item { color: rgba(255,255,255,.46); font-size: 15px; line-height: 1; padding: 2px; }
.remove-item:hover { color: #f4ccba; }
.cart-empty { color: rgba(255,255,255,.55); font: 500 16px/1.7 var(--serif); padding: 45px 0 50px; display: none; }
.cart-empty.is-visible { display: block; }
.budget-summary { margin-top: auto; padding-top: 24px; border-top: 1px solid rgba(255,255,255,.2); }
.budget-copy { display: flex; justify-content: space-between; align-items: end; }
.budget-copy span { color: rgba(255,255,255,.6); font-size: 11px; }
.budget-copy strong { color: #f4ccba; font: 600 28px var(--serif); }
.budget-meter { height: 6px; background: rgba(255,255,255,.16); margin-top: 17px; overflow: hidden; }
.budget-meter-fill { height: 100%; width: 0; background: #f4ccba; transition: width .35s ease; }
.budget-foot { display: flex; justify-content: space-between; gap: 12px; margin-top: 8px; font-size: 9px; color: rgba(255,255,255,.48); }
.cart-submit { width: 100%; margin-top: 27px; background: #f4ccba; color: var(--ink); }
.cart-submit:hover { background: var(--white); }
.share-button { color: rgba(255,255,255,.68); font-size: 11px; padding: 16px 0 0; letter-spacing: .06em; }
.share-button:hover { color: #f4ccba; }

.closing { padding-top: 115px; padding-bottom: 116px; background: var(--terracotta); color: var(--white); text-align: center; display: flex; align-items: center; flex-direction: column; }
.closing-mark { font-size: 25px; color: #f4ccba; margin-bottom: 22px; }
.closing .eyebrow { color: rgba(255,255,255,.65); }
.closing h2 { font-size: clamp(42px, 6vw, 76px); margin: 28px 0 39px; }
.closing h2 em { color: #f4ccba; }
.button-light { background: var(--white); color: var(--ink); }
.button-light:hover { background: var(--ink); color: var(--white); }
.site-footer { min-height: 110px; display: flex; align-items: center; justify-content: space-between; gap: 30px; background: var(--paper-deep); }
.footer-brand { display: flex; align-items: center; gap: 12px; }
.footer-brand .brand-logo { width: 125px; height: 52px; }
.footer-brand strong { font: 600 15px var(--serif); display: block; }
.footer-brand small { color: var(--ink-soft); font-size: 8px; letter-spacing: .12em; text-transform: uppercase; display: block; }
.footer-links { display: flex; gap: 24px; color: var(--ink-soft); font-size: 11px; }
.footer-links button:hover, .footer-links a:hover { color: var(--terracotta); }
.footer-end { color: var(--ink-soft); font-size: 10px; }

.modal-backdrop { position: fixed; inset: 0; background: rgba(38,54,50,.58); z-index: 50; display: grid; place-items: center; padding: 22px; backdrop-filter: blur(8px); }
.modal-backdrop[hidden] { display: none; }
.query-modal { width: min(100%, 530px); max-height: 94vh; overflow-y: auto; background: var(--paper); padding: 38px clamp(24px, 5vw, 48px) 42px; position: relative; box-shadow: var(--shadow); }
.modal-close { position: absolute; top: 16px; right: 19px; font-size: 28px; color: var(--ink-soft); line-height: 1; }
.modal-close:hover { color: var(--terracotta); }
.modal-mark { color: var(--terracotta); font-size: 23px; }
.query-modal h2 { font-size: 36px; margin: 13px 0 10px; }
.query-modal > p:not(.eyebrow) { color: var(--ink-soft); font-size: 13px; margin-bottom: 25px; }
#query-form label { display: block; color: var(--ink-soft); font-size: 11px; margin-top: 15px; }
#query-form input, #query-form textarea { display: block; width: 100%; border: 0; border-bottom: 1px solid var(--line); border-radius: 0; background: transparent; padding: 10px 0 8px; color: var(--ink); outline: none; }
#query-form input:focus, #query-form textarea:focus { border-color: var(--terracotta); }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
#query-form .button { width: 100%; margin-top: 28px; }
.toast { position: fixed; z-index: 80; left: 50%; bottom: 26px; transform: translate(-50%, 20px); background: var(--ink); color: var(--white); padding: 12px 21px; font-size: 12px; opacity: 0; pointer-events: none; transition: opacity .25s ease, transform .25s ease; box-shadow: 0 10px 28px rgba(38,54,50,.2); }
.toast.is-visible { opacity: 1; transform: translate(-50%, 0); }

@media (max-width: 930px) {
  .desktop-nav { margin-left: 20px; gap: 18px; }
  .hero { grid-template-columns: 1fr .75fr; }
  .hero-visual { min-height: 440px; }
  .hero-card-main { min-height: 370px; }
  .path-cards { grid-template-columns: repeat(2, 1fr); }
  .path-card { min-height: 250px; }
  .path-icon { margin-top: 30px; }
  .planner-layout { grid-template-columns: 1fr; }
  .cart-panel { position: relative; top: auto; min-height: 0; }
}
@media (max-width: 680px) {
  body { font-size: 14px; }
  .site-header { height: 69px; padding: 0 20px; }
  .desktop-nav, .text-button { display: none; }
  .header-actions { gap: 0; }
  .header-cta { font-size: 11px; }
  .section-pad { padding-left: 20px; padding-right: 20px; }
  .hero { display: block; padding-top: 67px; min-height: 0; }
  h1 { font-size: clamp(42px, 12vw, 60px); margin-top: 17px; }
  .hero-description { font-size: 14px; line-height: 1.85; }
  .hero-actions { gap: 20px; margin-top: 29px; flex-wrap: wrap; }
  .button { min-height: 46px; padding: 0 17px; font-size: 12px; }
  .hero-note { margin-top: 26px; font-size: 9px; letter-spacing: .06em; }
  .hero-visual { min-height: 390px; margin: 12px -10px 0; }
  .hero-card-main { width: 63%; min-height: 325px; }
  .hero-monogram { font-size: 54px; }
  .hero-monogram-big { font-size: 30px; letter-spacing: .01em; }
  .hero-monogram-big span { font-size: 19px; margin: 0 4px; }
  .hero-card-main p { font-size: 18px; }
  .hero-orbit { transform: rotate(-27deg) scale(.76); }
  .orbit-two { transform: rotate(39deg) scale(.72); }
  .floating-stamp { width: 96px; height: 96px; right: 4%; top: 7%; }
  .floating-stamp strong { font-size: 18px; }
  .hero-bottom { gap: 15px; margin-top: 13px; padding-bottom: 54px; }
  .hero-stat { gap: 7px; flex: 1; }
  .hero-stat strong { font-size: 15px; }
  .hero-stat span { font-size: 9px; line-height: 1.45; }
  .intro, .planner-section { padding-top: 70px; padding-bottom: 72px; }
  .intro-grid { display: block; margin-top: 26px; }
  .intro-body { margin-top: 25px; font-size: 13px; line-height: 1.9; }
  .path-cards { gap: 8px; margin-top: 46px; }
  .path-card { min-height: 230px; padding: 16px 14px; }
  .path-number { font-size: 8px; }
  .path-icon { font-size: 26px; margin: 24px 0 9px; }
  .path-card h3 { font-size: 19px; }
  .path-card p { font-size: 10px; line-height: 1.6; }
  .card-arrow { font-size: 9px; }
  .promise-band { display: block; padding-top: 70px; padding-bottom: 70px; }
  .promise-band h2 { margin-top: 22px; }
  .promise-list { margin-top: 47px; }
  .promise-item { grid-template-columns: 36px 1fr; gap: 8px; padding: 20px 0; }
  .promise-item h3 { font-size: 18px; }
  .promise-item p { font-size: 11px; line-height: 1.7; }
  .planner-heading { display: block; margin-top: 25px; }
  .planner-heading p { margin-top: 16px; line-height: 1.8; }
  .planner-badge { margin-top: 14px; }
  .planner-steps { margin-top: 34px; overflow-x: auto; display: flex; }
  .planner-step { min-width: 126px; padding: 14px 12px 12px 0; }
  .planner-step + .planner-step { padding-left: 12px; }
  .step-name { font-size: 11px; }
  .step-meta { font-size: 8px; }
  .planner-layout { margin-top: 11px; }
  .stage-panel { padding: 25px 17px 21px; min-height: 0; }
  .stage-heading { padding-bottom: 19px; }
  .stage-heading h3 { font-size: 32px; }
  .stage-heading > span { font-size: 9px; }
  .stage-description { font-size: 11px; line-height: 1.8; margin: 15px 0 19px; }
  .service-grid { gap: 7px; }
  .service-card { min-height: 176px; padding: 13px; }
  .service-card h4 { font-size: 15px; margin: 18px 0 4px; }
  .service-card p { font-size: 10px; line-height: 1.55; }
  .service-price { font-size: 12px; }
  .service-action { font-size: 9px; }
  .cart-panel { padding: 23px 17px 20px; }
  .cart-top h3 { font-size: 20px; }
  .selected-list { max-height: 210px; }
  .budget-copy strong { font-size: 24px; }
  .closing { padding-top: 78px; padding-bottom: 80px; }
  .closing h2 { margin: 22px 0 30px; }
  .site-footer { align-items: start; flex-direction: column; padding-top: 28px; padding-bottom: 28px; gap: 18px; }
  .footer-links { gap: 15px; flex-wrap: wrap; }
  .footer-end { font-size: 9px; }
  .form-row { gap: 12px; }
}
@media (prefers-reduced-motion: reduce) { *, *:before, *:after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; } }

/* Bilingual layout: allow English copy to grow without clipped cards. */
html { scroll-padding-top: 100px; }
html[lang="en"] { --serif: Georgia, "Noto Serif TC", serif; --sans: Arial, "Noto Sans TC", sans-serif; }
html[lang="en"] h1 { font-size: clamp(42px, 5.8vw, 78px); letter-spacing: -.045em; }
html[lang="en"] h2 { font-size: clamp(36px, 4.5vw, 60px); line-height: 1.15; letter-spacing: -.04em; }
html[lang="en"] .hero-actions { flex-wrap: wrap; gap: 16px; }
html[lang="en"] .hero-card-main p { font-size: 21px; line-height: 1.45; }
html[lang="en"] .path-card h3 { font-size: 22px; line-height: 1.25; }
html[lang="en"] .path-card { min-height: 340px; }
html[lang="en"] .service-card h4 { font-size: 19px; overflow-wrap: anywhere; }
html[lang="en"] .service-category { font-size: 8px; letter-spacing: .07em; }
html[lang="en"] .stage-heading h3 { font-size: 30px; }
html[lang="en"] .stage-heading { gap: 15px; }
html[lang="en"] .stage-heading > span { flex: 0 0 auto; }
html[lang="en"] .closing h2 { max-width: 800px; }
.toast { max-width: min(520px, 90vw); width: max-content; text-align: center; }
.language-toggle { min-height: 36px; min-width: 59px; white-space: nowrap; }
.language-toggle strong { color: var(--ink); }
@media (min-width: 681px) and (max-width: 1100px) {
  .desktop-nav { display: none; }
}
@media (max-width: 680px) {
  .header-actions { gap: 12px; }
  .brand-logo { width: 112px; }
  html[lang="en"] h1 { font-size: clamp(40px, 11vw, 56px); }
  html[lang="en"] .hero-card-main p { font-size: 17px; }
  html[lang="en"] .path-card { min-height: 290px; }
  html[lang="en"] .path-card h3 { font-size: 18px; }
  html[lang="en"] .stage-heading h3 { font-size: 24px; }
  html[lang="en"] .stage-heading > span { font-size: 8px; }
  html[lang="en"] .service-card h4 { font-size: 16px; }
  .service-card-footer { flex-wrap: wrap; gap: 7px; }
}