/* =========================================================
   手帳風（html.is-field，data-theme 仍是 warm：內頁沿用手繪風的配色與元件）
   版面照「牧羊人工作室_網站示意」：
   - 首頁每一區是 1920×1080 的固定畫布，依視窗等比縮放；--u ＝ 畫布上的 16px
   - 橫向螢幕：左側圖示欄（滑過展開）；直向螢幕（手機）：頂端列＋一欄往下排
   ========================================================= */
html.is-field { --u: min(.8333vw, 1.4815vh); }
/* 文字大小（左側欄或手機選單切換）：只放大文字（--uf），版面尺寸（--u）不變 */
html.is-field { --fz: 1; }
html.is-field.fs-large { --fz: 1.15; }
html.is-field.fs-xlarge { --fz: 1.3; }
.fd { --uf: calc(var(--u) * var(--fz, 1)); }
@media (orientation: portrait) { html.is-field { --u: min(1.4815vw, 1.0417vh, 8px); } }
.fd {
  --paper:#f7f2e8; --sheet:#fffdf8; --g1:#efe7d8; --g2:#e3d6c0; --g3:#b9a88f; --g4:#6f6255;
  --ink:#4a3f35; --abyss:#5a4a3c; --acc:#f6e3a1; --acc-hover:#f2d97f; --acc-ink:#5a4a3c; --sage:#4f6b55; --sage-l:#a9bfa4;
  --dark:#3b322b; --dark2:#463b33; --dline:#5a4c41; --dtext:#c9b9a3;
  --en:"Archivo","Noto Sans TC",sans-serif; --num:"Space Grotesk","Noto Sans TC",sans-serif; --zh:"Noto Sans TC","PingFang TC","Microsoft JhengHei",sans-serif;
  font-family: var(--zh); color: var(--ink);
}
html[lang="ja"] .fd { --zh:"Noto Sans JP","Hiragino Sans","Yu Gothic",sans-serif; --en:"Archivo","Noto Sans JP",sans-serif; }
.fd, .fd * { box-sizing: border-box; }
.fd * { margin: 0; padding: 0; }
.fd a { color: inherit; text-decoration: none; }
.fd button { font-family: inherit; }
.fd ul, .fd ol { list-style: none; }
.fd :focus-visible { outline: 3px solid var(--sage); outline-offset: 2px; }
.fd-anchor { position: absolute; top: 0; left: 0; }

/* 跟原本版面的銜接：不用原本的頁首與左側目錄，內容讓出左側圖示欄的寬度 */
html.is-field .layout { max-width: none; margin: 0 0 0 calc(var(--u)*6); display: block; }
html.is-field .site-nav { display: none; }
html.is-field .main { max-width: 1120px; margin: 0 auto; padding: 40px 28px 120px; }
html.is-field .main.fd-home { max-width: none; margin: 0; padding: 0; font: 400 calc(var(--u)*1.25)/1.7 var(--zh); background: var(--paper); }
.fd-home h1, .fd-home h2, .fd-home h3, .fd-home h4 { font-family: var(--zh); color: inherit; letter-spacing: normal; }
.fd-home h2::before, .fd-home h2::after, .fd-home h3::before, .fd-home h3::after, .fd-home h1::before, .fd-home h1::after { content: none; }
.fd-home img { max-width: none; border-radius: 0; }
.fd-foot { margin-left: calc(var(--u)*6); }
.fd-side { z-index: 50; }
.fd-side .logo-link { display: block; }
.fd-side .logo { display: block; height: auto; }
.tp-field .tp-dot { background: linear-gradient(135deg, #3b322b 50%, #f6e3a1 50%); }

.fd .en{font-family:var(--en);font-stretch:125%;text-transform:uppercase;letter-spacing:-.02em}
.fd .num{font-family:var(--num)}
.fd .hud{font:500 calc(var(--u)*.95)/1.4 var(--num);color:var(--g4);letter-spacing:.06em}
.fd-side{position:fixed;left:0;top:0;bottom:0;width:calc(var(--u)*6);background:var(--sheet);border-right:1px solid var(--g2);z-index:20;
 display:flex;flex-direction:column;padding:calc(var(--u)*1.2) calc(var(--u)*.8);overflow:hidden;transition:width .25s ease,box-shadow .25s ease}
.fd-side:hover,.fd-side:focus-within{width:calc(var(--u)*22);box-shadow:calc(var(--u)*1) 0 calc(var(--u)*3) rgba(74,63,53,.18)}
.fd-side .logo{width:calc(var(--u)*4.4)}
.fd-side nav{margin-top:calc(var(--u)*3);display:flex;flex-direction:column;gap:calc(var(--u)*.4)}
.fd-side nav a{position:relative;display:flex;align-items:center;gap:calc(var(--u)*1.4);height:calc(var(--u)*4.4);padding-left:calc(var(--u)*1.1);color:var(--g3);white-space:nowrap}
.fd-side nav a svg{flex:none;width:calc(var(--u)*2.2);height:calc(var(--u)*2.2)}
.fd-side nav a:hover{color:var(--ink)}
.fd-side nav a.on{background:var(--g1);color:var(--ink)}
.fd-side nav a.on::before{content:"";position:absolute;left:0;top:0;bottom:0;width:calc(var(--u)*.35);background:var(--ink)}
.fd-side .lb{font:500 calc(var(--u)*1.1) var(--zh);opacity:0;transition:opacity .2s}
.fd-side:hover .lb,.fd-side:focus-within .lb{opacity:1}
.fd-side .lang{margin-top:auto;background:var(--g1);padding:calc(var(--u)*.4);display:flex;flex-direction:column}
.fd-side .lang a{display:flex;align-items:center;gap:calc(var(--u)*1);height:calc(var(--u)*3.4);padding-left:calc(var(--u)*.3);white-space:nowrap;border-bottom:1px solid var(--g2);color:var(--g4)}
.fd-side .lang a:last-child{border-bottom:0}
.fd-side .lang b{flex:none;width:calc(var(--u)*2.8);height:calc(var(--u)*2.2);display:grid;place-items:center;font:700 calc(var(--u)*.9) var(--num)}
.fd-side .lang a.on{color:var(--ink)}
.fd-side .lang a.on b{background:var(--ink);color:var(--sheet)}
.fd-side .lang .lb{flex:1;text-align:center;padding-right:calc(var(--u)*2.8)}
.fd-side .go{margin-top:calc(var(--u)*.8);min-height:calc(var(--u)*5.6);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:calc(var(--u)*.4);
 background:var(--acc);color:var(--acc-ink);font:700 calc(var(--u)*.95)/1.2 var(--zh);white-space:nowrap}
.fd-side .go i{flex:none;width:calc(var(--u)*1.8);height:calc(var(--u)*1.2);background:var(--acc-ink);clip-path:polygon(0 0,100% 0,50% 100%)}
.fd-side .go:hover{background:var(--acc-hover)}
.fd-side:hover .go,.fd-side:focus-within .go{flex-direction:row;gap:calc(var(--u)*1.4);font-size:calc(var(--u)*1.3)}
.fd-top{display:none}
.fd-home section{position:relative;height:100vh;min-height:calc(var(--u)*67.5);overflow:hidden}
.fd-home .cv{position:absolute;left:50%;top:50%;width:calc(var(--u)*114);height:calc(var(--u)*67.5);transform:translate(-50%,-50%)}
.fd-home #home{background:var(--paper)}
.fd-home #home .bgtext{position:absolute;left:calc(var(--u)*-2);top:calc(var(--u)*6);font:800 calc(var(--u)*22)/0.8 var(--en);font-stretch:125%;color:transparent;-webkit-text-stroke:2px var(--g2);
 background:repeating-linear-gradient(-45deg,var(--g2) 0 2px,transparent 2px 9px);-webkit-background-clip:text;background-clip:text;white-space:nowrap}
.fd-home #home .slash{position:absolute;right:calc(var(--u)*30);top:calc(var(--u)*-6);width:calc(var(--u)*7);height:calc(var(--u)*90);background:var(--g2);transform:rotate(18deg)}
.fd-home #home .slash.b{right:calc(var(--u)*23);width:calc(var(--u)*1.2);background:var(--abyss)}
.fd-home .pol{position:absolute;right:calc(var(--u)*5);top:calc(var(--u)*3);background:var(--sheet);padding:calc(var(--u)*1.5) calc(var(--u)*1.5) calc(var(--u)*6.5);transform:rotate(2.5deg);
 box-shadow:0 calc(var(--u)*1.2) calc(var(--u)*2.4) rgba(74,63,53,.22),0 calc(var(--u)*.2) calc(var(--u)*.4) rgba(74,63,53,.12)}
.fd-home .pol img{display:block;height:calc(var(--u)*53)}
.fd-home #home .title{position:absolute;left:calc(var(--u)*8);top:calc(var(--u)*26)}
.fd-home #home .open{display:inline-flex;align-items:center;gap:calc(var(--u)*.8);margin-bottom:calc(var(--u)*1.6);background:var(--sage);color:#fff;font:700 calc(var(--uf)*1.3)/calc(var(--uf)*2.8) var(--zh);padding:0 calc(var(--u)*1.4);border-radius:calc(var(--u)*.4)}
.fd-home #home .open i{width:calc(var(--u)*.8);height:calc(var(--u)*.8);border-radius:50%;background:var(--acc)}
.fd-home #home h1{font:900 calc(var(--u)*8)/1 var(--zh);letter-spacing:-.04em;background:var(--sheet);padding:calc(var(--u)*.2) calc(var(--u)*1.4);display:inline-block;box-shadow:calc(var(--u)*.6) calc(var(--u)*.6) 0 var(--acc);white-space:nowrap}
.fd-home #home .sub{display:inline-flex;align-items:center;gap:calc(var(--u)*1);margin-top:calc(var(--u)*1.6);background:var(--abyss);color:var(--sheet);font:700 calc(var(--uf)*1.5) var(--zh);padding:calc(var(--u)*.5) calc(var(--u)*1.6);border-left:calc(var(--u)*.6) solid var(--acc)}
.fd-home #home .tagline{margin-top:calc(var(--u)*1.4);font:500 calc(var(--uf)*1.6) var(--zh)}
.fd-home #home .h1{position:absolute;left:calc(var(--u)*8);top:calc(var(--u)*21)}
.fd-home #home .h2{position:absolute;left:calc(var(--u)*52);top:calc(var(--u)*5);writing-mode:vertical-rl}
.fd-home #home .h3{position:absolute;left:calc(var(--u)*8);top:calc(var(--u)*50);font:500 calc(var(--uf)*1.3)/1.5 var(--zh);color:var(--g4);letter-spacing:.02em}
.fd-home .st{position:absolute;left:calc(var(--u)*8);top:calc(var(--u)*5);display:flex;align-items:flex-end;gap:calc(var(--u)*1.4)}
.fd-home .st .en{font-weight:800;font-size:calc(var(--uf)*4.5);line-height:.9}
.fd-home .st .zh{font:700 calc(var(--uf)*1.6) var(--zh);padding-bottom:calc(var(--u)*.3)}
.fd-home .st::after{content:"";position:absolute;left:0;right:calc(var(--u)*-30);bottom:calc(var(--u)*-1);height:2px;background:linear-gradient(90deg,var(--ink) 0 calc(var(--u)*12),var(--g2) calc(var(--u)*12))}
.fd-home #works{background:var(--g1)}
.fd-home #works .hatch{position:absolute;inset:0;background:repeating-linear-gradient(-45deg,rgba(90,74,60,.04) 0 2px,transparent 2px 12px)}
.fd-home .pick{position:absolute;left:calc(var(--u)*8);top:calc(var(--u)*12);width:calc(var(--u)*11);display:flex;flex-direction:column;align-items:center;gap:calc(var(--u)*1.2);padding:calc(var(--u)*1.2) 0;background:var(--sheet);border:1px solid var(--g2)}
.fd-home .pick button{width:calc(var(--u)*3.2);height:calc(var(--u)*3.2);border-radius:50%;border:1px solid var(--g3);background:var(--sheet);display:grid;place-items:center;font:700 calc(var(--uf)*1.2) var(--num);cursor:pointer;color:var(--ink)}
.fd-home .pick .th{display:flex;flex-direction:column;gap:calc(var(--u)*1.2)}
.fd-home .pick img{display:block;width:calc(var(--u)*8.6);height:calc(var(--u)*8.6);object-fit:cover;outline:1px solid var(--g2);cursor:pointer;opacity:.75}
.fd-home .pick img.on{outline:calc(var(--u)*.3) solid var(--ink);outline-offset:calc(var(--u)*.25);opacity:1}
.fd-home .all{position:absolute;left:calc(var(--u)*8);top:calc(var(--u)*61);width:calc(var(--u)*11);background:var(--abyss);color:var(--sheet);text-align:center;font:700 calc(var(--uf)*1.05)/calc(var(--uf)*2.8) var(--zh)}
.fd-home .stage{position:absolute;left:calc(var(--u)*23);right:calc(var(--u)*3);top:calc(var(--u)*12);bottom:calc(var(--u)*3);z-index:2}
.fd-home .frame{position:absolute;left:50%;top:50%;transform:translate(-50%,calc(-50% - var(--fy,0px)));width:var(--fw,100%);height:var(--fh,100%);overflow:hidden;
 box-shadow:0 calc(var(--u)*1.6) calc(var(--u)*3) rgba(74,63,53,.25);background:var(--dark);transition:width .28s cubic-bezier(.65,0,.35,1),height .28s cubic-bezier(.65,0,.35,1),transform .28s cubic-bezier(.65,0,.35,1)}
.fd-home .frame>*{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.fd-home .frame .dk,.fd-home .frame .nw{clip-path:inset(0 0 0 100%)}
.fd-home .frame .dk{background:var(--dark)}
.fd-home #price{background:var(--dark);color:var(--sheet)}
.fd-home #price .scan{position:absolute;inset:0;background:repeating-linear-gradient(0deg,rgba(255,255,255,.025) 0 1px,transparent 1px 4px)}
.fd-home #price .st .en{color:var(--sheet)}
.fd-home #price .st::after{background:linear-gradient(90deg,var(--acc) 0 calc(var(--u)*12),var(--dline) calc(var(--u)*12))}
.fd-home .cards{position:absolute;left:calc(var(--u)*8);right:calc(var(--u)*6);top:calc(var(--u)*14.5);display:grid;grid-template-columns:1fr 1fr;gap:calc(var(--u)*3)}
.fd-home .pcard{position:relative;height:calc(var(--u)*48);background:var(--dark2);border:1px solid var(--dline);display:grid;grid-template-columns:calc(var(--u)*22) 1fr}
.fd-home .pcard .art{position:absolute;top:0;bottom:0;right:0;left:calc(var(--u)*17);overflow:hidden;
 -webkit-mask-image:linear-gradient(90deg,transparent 0,rgba(0,0,0,.35) calc(var(--u)*4),#000 calc(var(--u)*11));mask-image:linear-gradient(90deg,transparent 0,rgba(0,0,0,.35) calc(var(--u)*4),#000 calc(var(--u)*11))}
.fd-home .pcard .art img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 25%;opacity:0;transition:opacity 1.2s ease}
.fd-home .pcard .art img.on{opacity:1}
.fd-home .pcard .tx{position:relative;z-index:1;padding:calc(var(--u)*9.5) calc(var(--u)*2.2) calc(var(--u)*2.6);display:flex;flex-direction:column;min-width:0}
.fd-home .pm{position:absolute;left:calc(var(--u)*-1.6);top:calc(var(--u)*-2.2);width:calc(var(--u)*19);color:var(--acc);opacity:.85;transform:rotate(-10deg);z-index:3;pointer-events:none}
.fd-home .pcard h3{font:900 calc(var(--uf)*3.2) var(--zh)}
.fd-home .pcard .pr{font:700 calc(var(--uf)*4.4)/1 var(--num);letter-spacing:-.03em;margin-top:calc(var(--u)*1.6);white-space:nowrap}
.fd-home .pcard .pr small{font-size:.32em;color:var(--dtext);margin-right:calc(var(--u)*.4)}
.fd-home .pcard .pr em{font:700 .3em var(--zh);font-style:normal;color:var(--dtext);margin-left:calc(var(--u)*.4)}
.fd-home .pcard .range{font:500 calc(var(--uf)*1.1) var(--num);color:var(--dtext);margin-top:calc(var(--u)*.6)}
.fd-home .pcard ul{margin-top:auto;list-style:none;font-size:calc(var(--uf)*1.15);color:var(--dtext)}
.fd-home .pcard li{padding:calc(var(--u)*.5) 0;border-top:1px solid var(--dline)}
.fd-home .pcard li::before{content:"";display:inline-block;width:calc(var(--u)*.6);height:calc(var(--u)*.6);background:var(--acc);margin-right:calc(var(--u)*.8);vertical-align:calc(var(--u)*.15)}
.fd-home .pcard .bt{margin-top:calc(var(--u)*1.4);background:var(--acc);color:var(--acc-ink);font:700 calc(var(--uf)*1.25)/calc(var(--uf)*3.4) var(--zh);text-align:center}
.fd-home .pcard .bt:hover{background:var(--acc-hover)}
.fd-home .pcard{grid-template-columns:calc(var(--u)*25) 1fr;height:calc(var(--u)*47.5)}
.fd-home .pcard .art{left:calc(var(--u)*22)}
.fd-home .cards{top:calc(var(--u)*14)}
.fd-home .pcard .tx{padding-top:calc(var(--u)*8.2)}
.fd-home .pcard .ds{margin-top:calc(var(--u)*1.4);font-size:calc(var(--uf)*1.2);line-height:1.65;color:var(--dtext)}
.fd-home .pcard .prep{margin-top:auto}
.fd-home .pcard .prep h4{font:700 calc(var(--uf)*1.15) var(--zh);color:var(--acc);margin-bottom:calc(var(--u)*.5)}
.fd-home .pcard .prep ul{font-size:calc(var(--uf)*1.1);line-height:1.5}
.fd-home .pcard .prep li{padding:calc(var(--u)*.45) 0 calc(var(--u)*.45) calc(var(--u)*1.4);text-indent:calc(var(--u)*-1.4)}
.fd-home .pnote{position:absolute;left:calc(var(--u)*8);top:calc(var(--u)*63.5);font-size:calc(var(--uf)*1.2);color:var(--dtext)}
.fd-home .pnote a{color:var(--acc);font-weight:700;border-bottom:1px solid var(--acc);cursor:pointer}
.fd-home #flow{background:var(--g1)}
.fd-home .fflow{position:absolute;left:calc(var(--u)*8);right:calc(var(--u)*6);top:calc(var(--u)*14)}
.fd-home .fsteps{display:grid;grid-template-columns:repeat(8,1fr);gap:calc(var(--u)*1.4);list-style:none}
.fd-home .fsteps li{position:relative;background:var(--sheet);border:1px solid var(--g2);border-top:calc(var(--u)*.4) solid var(--abyss);border-radius:calc(var(--u)*.5);padding:calc(var(--u)*1.2) calc(var(--u)*1.2) calc(var(--u)*1.4);font-size:calc(var(--uf)*1.1);line-height:1.55;color:var(--g4)}
.fd-home .fsteps li i{display:block;font:700 calc(var(--uf)*2.2)/1 var(--num);font-style:normal;color:var(--g3)}
.fd-home .fsteps li b{display:block;margin:calc(var(--u)*.8) 0 calc(var(--u)*.4);font:900 calc(var(--uf)*1.55) var(--zh);color:var(--ink);white-space:nowrap}
.fd-home .fsteps li span{display:block}
.fd-home .fsteps li:not(:last-child)::after{content:"";position:absolute;z-index:1;right:calc(var(--u)*-1.15);top:50%;width:calc(var(--u)*.8);height:calc(var(--u)*.8);border-top:2px solid var(--g4);border-right:2px solid var(--g4);transform:translateY(-50%) rotate(45deg)}
.fd-home .fsteps li.dr{border-top-color:var(--sage)}
.fd-home .fsteps li.dr i{color:var(--sage)}
.fd-home .fbody{display:grid;grid-template-columns:1fr 1fr;gap:calc(var(--u)*1.4);margin-top:calc(var(--u)*3.4);align-items:start}
.fd-home .fnotes{display:flex;flex-direction:column;gap:calc(var(--u)*1.6);padding-right:calc(var(--u)*4)}
.fd-home .fnotes div{background:var(--sheet);border-left:calc(var(--u)*.5) solid var(--acc);border-radius:calc(var(--u)*.4);padding:calc(var(--u)*1.5) calc(var(--u)*1.8);font-size:calc(var(--uf)*1.25);line-height:1.7;color:var(--g4)}
.fd-home .fnotes b{display:block;font:900 calc(var(--uf)*1.6) var(--zh);color:var(--ink);margin-bottom:calc(var(--u)*.4)}
.fd-home .fnotes a{color:var(--sage);font-weight:700;border-bottom:1px solid var(--sage);cursor:pointer}
.fd-home .phase{position:relative;background:var(--sheet);border:1px solid var(--abyss);border-radius:calc(var(--u)*.8);padding:calc(var(--u)*2) calc(var(--u)*2.2) calc(var(--u)*2.2);box-shadow:calc(var(--u)*.6) calc(var(--u)*.6) 0 var(--g2)}
.fd-home .phase::before{content:"";position:absolute;left:0;top:calc(var(--u)*-2.9);width:calc((100% - calc(var(--u)*4.2))*.75 + calc(var(--u)*2.8));height:calc(var(--u)*1.3);border:2px solid var(--sage);border-top:0;border-radius:0 0 calc(var(--u)*.4) calc(var(--u)*.4)}
.fd-home .phase::after{content:"";position:absolute;left:calc(((100% - calc(var(--u)*4.2))*.75 + calc(var(--u)*2.8))/2);top:calc(var(--u)*-1.6);width:2px;height:calc(var(--u)*1.6);background:var(--sage)}
.fd-home .phase h3{font:900 calc(var(--uf)*1.9) var(--zh)}
.fd-home .phs{display:grid;grid-template-columns:repeat(3,1fr);gap:calc(var(--u)*1.2);margin-top:calc(var(--u)*1.4)}
.fd-home .phs div{background:var(--paper);border:1px solid var(--g2);border-radius:calc(var(--u)*.5);padding:calc(var(--u)*1.3) calc(var(--u)*1.4);font-size:calc(var(--uf)*1.15);line-height:1.6;color:var(--g4)}
.fd-home .phs i{display:inline-grid;place-items:center;width:calc(var(--u)*2.4);height:calc(var(--u)*2.4);border-radius:50%;background:var(--sage);color:#fff;font:700 calc(var(--uf)*1.2) var(--num);font-style:normal;vertical-align:middle}
.fd-home .phs b{font:900 calc(var(--uf)*1.5) var(--zh);color:var(--ink);margin-left:calc(var(--u)*.6);vertical-align:middle}
.fd-home .phs p{margin-top:calc(var(--u)*.7)}
.fd-home .phs em{display:inline-block;margin-top:calc(var(--u)*.8);font:700 calc(var(--uf)*1)/calc(var(--uf)*2) var(--zh);font-style:normal;padding:0 calc(var(--u)*.8);border-radius:calc(var(--u)*.3);background:var(--acc);color:var(--acc-ink)}
.fd-home .phs .fin em{background:var(--g2)}
.fd-home .rev{margin-top:calc(var(--u)*1.4);display:flex;gap:calc(var(--u)*1);align-items:flex-start;background:var(--abyss);color:var(--sheet);border-radius:calc(var(--u)*.5);padding:calc(var(--u)*1.2) calc(var(--u)*1.6);font-size:calc(var(--uf)*1.2);line-height:1.65}
.fd-home .rev svg{flex:none;width:calc(var(--u)*1.8);height:calc(var(--u)*1.8);color:var(--acc);margin-top:calc(var(--u)*.1)}
.fd-home #notice{background:var(--paper)}
.fd-home .xh{position:absolute;right:0;top:0;bottom:0;width:calc(var(--u)*44);pointer-events:none}
.fd-home .xh i{position:absolute}
.fd-home .xh .h{left:0;right:0;height:calc(var(--u)*2.2);background:repeating-linear-gradient(45deg,var(--acc) 0 calc(var(--u)*.45),transparent calc(var(--u)*.45) calc(var(--u)*1.3))}
.fd-home .xh .v{top:0;bottom:0;width:calc(var(--u)*2.2);background:repeating-linear-gradient(-45deg,var(--acc) 0 calc(var(--u)*.45),transparent calc(var(--u)*.45) calc(var(--u)*1.3))}
.fd-home .xh .h1{top:calc(var(--u)*3.5)}
.fd-home .xh .h2{top:calc(var(--u)*7.5)}
.fd-home .xh .v1{right:calc(var(--u)*7)}
.fd-home .xh .v2{right:calc(var(--u)*3)}
.fd-home .list{position:absolute;left:calc(var(--u)*8);top:calc(var(--u)*14);width:calc(var(--u)*88);list-style:none}
.fd-home .list li{display:grid;grid-template-columns:calc(var(--u)*8.6) calc(var(--u)*18) 1fr calc(var(--u)*3);align-items:center;gap:calc(var(--u)*2);padding:calc(var(--u)*1.25) 0;border-bottom:1px solid var(--g2);font-size:calc(var(--uf)*1.3)}
.fd-home .list .tg{display:flex;align-items:center;justify-content:center;gap:calc(var(--u)*.5);background:var(--abyss);color:var(--sheet);font:700 calc(var(--uf)*1.05)/calc(var(--uf)*2.4) var(--zh)}
.fd-home .list .tg svg{width:calc(var(--u)*1.4);height:calc(var(--u)*1.4);flex:none}
.fd-home .list .tg.y{background:var(--acc);color:var(--acc-ink)}
.fd-home .list b{font:900 calc(var(--uf)*1.8) var(--zh)}
.fd-home .list span{color:var(--g4)}
.fd-home .list i{font:700 calc(var(--uf)*1.4) var(--num);color:var(--g3);font-style:normal}
.fd-home .more{position:absolute;left:calc(var(--u)*8);top:calc(var(--u)*38.5);display:inline-flex;gap:calc(var(--u)*1);align-items:center;background:var(--abyss);color:var(--sheet);font:700 calc(var(--uf)*1.2)/calc(var(--uf)*3.4) var(--zh);padding:0 calc(var(--u)*2)}
.fd-home .more i{width:calc(var(--u)*.8);height:calc(var(--u)*.8);background:var(--acc)}
.fd-home .list{top:calc(var(--u)*12)}
.fd-home .list li{padding:calc(var(--u)*.8) 0}
.fd-home .more{top:calc(var(--u)*40.1)}
.fd-home .bub .nw,.fd-home .bub .nw i{display:inline-block;font-style:normal}
.fd-home .cta{position:absolute;left:calc(var(--u)*8);top:calc(var(--u)*46);width:calc(var(--u)*88);display:grid;grid-template-columns:1fr 1.15fr;gap:calc(var(--u)*3);align-items:center;
 background:var(--sheet);border:1px solid var(--abyss);padding:calc(var(--u)*2.2) calc(var(--u)*2.6);box-shadow:calc(var(--u)*.6) calc(var(--u)*.6) 0 var(--g2)}
.fd-home .vn{display:flex;align-items:center;gap:calc(var(--u)*1.8)}
.fd-home .ava{flex:none;width:calc(var(--u)*9);height:calc(var(--u)*9);border-radius:50%;object-fit:cover;object-position:50% 15%;border:2px solid var(--abyss);background:var(--g1)}
.fd-home .bub{position:relative;border:1px solid var(--abyss);background:var(--paper);padding:calc(var(--u)*1.5) calc(var(--u)*1.6) calc(var(--u)*1);font-size:calc(var(--uf)*1.35)}
.fd-home .bub .nm{position:absolute;left:calc(var(--u)*1.2);top:calc(var(--u)*-1.2);background:var(--sage);color:#fff;font:700 calc(var(--uf)*1)/calc(var(--uf)*2.2) var(--zh);padding:0 calc(var(--u)*1)}
.fd-home .sched{display:flex;flex-wrap:wrap;align-items:center;gap:calc(var(--u)*.8);list-style:none}
.fd-home .sched li{display:flex;align-items:center;gap:calc(var(--u)*.8);border:1px solid var(--abyss);background:var(--sheet);padding:calc(var(--u)*.35) calc(var(--u)*.4) calc(var(--u)*.35) calc(var(--u)*1);font:500 calc(var(--uf)*1.15) var(--zh)}
.fd-home .sched li b{background:var(--sage);color:#fff;font:700 calc(var(--uf)*1)/calc(var(--uf)*1.8) var(--zh);padding:0 calc(var(--u)*.7)}
.fd-home .sched li.cap{font:700 calc(var(--uf)*1.1) var(--zh);color:var(--g4);margin-right:calc(var(--u)*.4);border:0;background:none;padding:0}
.fd-home .bts{display:grid;grid-template-columns:1fr 1fr;gap:calc(var(--u)*1);margin-top:calc(var(--u)*1.4)}
.fd-home .bts a{font:700 calc(var(--uf)*1.35)/calc(var(--uf)*4) var(--zh);text-align:center;border:1px solid var(--abyss)}
.fd-home .bts .b1{background:var(--acc);color:var(--acc-ink)}
.fd-home .bts .b1:hover{background:var(--acc-hover)}
.fd-home .bts .b2{background:var(--sheet)}
.fd-home .cta{border-radius:calc(var(--u)*.8)}
.fd-home .bub{border-radius:calc(var(--u)*.6)}
.fd-home .bub .nm{border-radius:calc(var(--u)*.3)}
.fd-home .sched li{border-radius:calc(var(--u)*.45)}
.fd-home .sched li.cap{border-radius:0}
.fd-home .sched li b{border-radius:calc(var(--u)*.25)}
.fd-home .bts a{border-radius:calc(var(--u)*.5)}
.fd-home .sched{display:grid;grid-template-columns:repeat(3,1fr);gap:calc(var(--u)*1)}
.fd-home .sched li{justify-content:space-between}
.fd-home .sched li.cap{grid-column:1/-1;margin:0}
.fd-home .bts{gap:calc(var(--u)*1);margin-top:calc(var(--u)*1)}
.fd-home .sched{gap:calc(var(--u)*1.6) calc(var(--u)*1.2);padding-top:calc(var(--u)*.6)}
.fd-home .cta .bts{margin-top:calc(var(--u)*1.8)}
.fd-home .sched li:not(.cap){position:relative;border:0;border-radius:calc(var(--u)*.2);background:#f8e8a8;color:var(--acc-ink);padding:calc(var(--u)*1.5) calc(var(--u)*1.1) calc(var(--u)*1) calc(var(--u)*1.2);
 font:700 calc(var(--uf)*1.4) "LXGW WenKai TC",var(--zh);box-shadow:0 calc(var(--u)*.6) calc(var(--u)*.9) calc(var(--u)*-.4) rgba(74,63,53,.4),0 calc(var(--u)*.1) calc(var(--u)*.2) rgba(74,63,53,.12);transform:rotate(-1.2deg)}
.fd-home .sched li:nth-child(3){background:#dfe8d6;transform:rotate(.9deg)}
.fd-home .sched li:nth-child(4){transform:rotate(-.4deg)}
.fd-home .sched li:not(.cap)::before{content:"";position:absolute;left:50%;top:calc(var(--u)*-.75);width:calc(var(--u)*5.2);height:calc(var(--u)*1.5);margin-left:calc(var(--u)*-2.6);background:rgba(255,253,248,.62);border:1px solid rgba(185,168,143,.4);transform:rotate(-3deg)}
.fd-home .sched li:not(.cap){white-space:nowrap;font-size:calc(var(--uf)*1.2);padding:calc(var(--u)*1.4) calc(var(--u)*.8) calc(var(--u)*.9) calc(var(--u)*1)}
.fd-home .sched li:not(.cap) b{flex:none;white-space:nowrap;background:none;color:var(--sage);border:1.5px solid var(--sage);border-radius:calc(var(--u)*.3);font:700 calc(var(--uf)*1)/calc(var(--uf)*1.7) var(--zh);padding:0 calc(var(--u)*.5);transform:rotate(-6deg)}
.fd-foot{background:var(--dark);color:var(--dtext);padding:calc(var(--u)*5) calc(var(--u)*8) calc(var(--u)*3) calc(var(--u)*14);font-size:calc(var(--uf)*1.35)}
.fd-foot .fwrap{display:grid;grid-template-columns:1fr 1.3fr 1.2fr;gap:calc(var(--u)*5)}
.fd-foot .fbrand img{width:calc(var(--u)*5);vertical-align:middle}
.fd-foot .fbrand b{color:var(--sheet);font:900 calc(var(--uf)*2.4) var(--zh);margin-left:calc(var(--u)*1);vertical-align:middle}
.fd-foot .fbrand p{margin-top:calc(var(--u)*1.2);line-height:1.8}
.fd-foot h4{color:var(--sheet);font:700 calc(var(--uf)*1.5) var(--zh);display:flex;align-items:center;gap:calc(var(--u)*.7);margin-bottom:calc(var(--u)*1.6)}
.fd-foot h4 i{width:calc(var(--u)*.9);height:calc(var(--u)*.9);background:var(--acc)}
.fd-foot .ct{display:grid;grid-template-columns:auto 1fr;gap:calc(var(--u)*1.3) calc(var(--u)*2.6);align-items:center;font-size:calc(var(--uf)*1.5)}
.fd-foot .ct dt{color:var(--sage-l);font-weight:700}
.fd-foot .ct dd{display:flex;align-items:center;gap:calc(var(--u)*1.2);flex-wrap:wrap}
.fd-foot .ct dd b{color:var(--sheet)}
.fd-foot .ct dd a{color:var(--sheet);font-weight:700;border-bottom:1px solid var(--dtext)}
.fd-foot .ct .cp{border:1px solid var(--dtext);background:none;color:var(--sheet);font:700 calc(var(--uf)*1.2) var(--zh);padding:calc(var(--u)*.4) calc(var(--u)*1.1);cursor:pointer}
.fd-foot .share{display:grid;grid-template-columns:1fr 1fr;gap:calc(var(--u)*1)}
.fd-foot .share a{display:flex;align-items:center;justify-content:center;gap:calc(var(--u)*.8);background:var(--acc);color:var(--acc-ink);font:700 calc(var(--uf)*1.4)/calc(var(--uf)*4.2) var(--zh)}
.fd-foot .share a:hover{background:var(--acc-hover)}
.fd-foot .share svg{width:calc(var(--u)*1.6);height:calc(var(--u)*1.6);flex:none}
.fd-foot .fbot{margin-top:calc(var(--u)*3.6);padding-top:calc(var(--u)*1.6);border-top:1px solid var(--dline);font-size:calc(var(--uf)*1.1);display:flex;justify-content:space-between}
.fd-top .lsel{position:relative;flex:none;margin-left:auto}
.fd-top .lsel summary{list-style:none;display:flex;align-items:center;gap:calc(var(--u)*.8);height:calc(var(--u)*6);padding:0 calc(var(--u)*1.4);background:var(--sage);color:#fff;font:700 calc(var(--u)*2.2) var(--zh);cursor:pointer}
.fd-top .lsel summary::-webkit-details-marker{display:none}
.fd-top .lsel summary svg{width:calc(var(--u)*2.6);height:calc(var(--u)*2.6);flex:none}
.fd-top .lsel .car{width:calc(var(--u)*1.1);height:calc(var(--u)*1.1);border-right:calc(var(--u)*.3) solid;border-bottom:calc(var(--u)*.3) solid;transform:translateY(calc(var(--u)*-.3)) rotate(45deg);margin-left:calc(var(--u)*.2)}
.fd-top .lsel[open] .car{transform:translateY(calc(var(--u)*.3)) rotate(-135deg)}
.fd-top .lsel ul{position:absolute;right:0;top:calc(100% + calc(var(--u)*.8));min-width:calc(var(--u)*22);background:var(--sheet);border:1px solid var(--abyss);list-style:none;box-shadow:calc(var(--u)*.6) calc(var(--u)*.6) 0 var(--g2)}
.fd-top .lsel li a{display:block;padding:calc(var(--u)*1.4) calc(var(--u)*2.2);font:500 calc(var(--u)*2.4) var(--zh);border-bottom:1px solid var(--g2)}
.fd-top .lsel li:last-child a{border-bottom:0}
.fd-top .lsel li a.on{background:var(--g1);font-weight:700;box-shadow:inset calc(var(--u)*.6) 0 0 var(--sage)}

/* ---- 左側欄：風格切換（收起時只有調色盤圖示，展開時出現色票） ---- */
.fd-side .fd-theme { margin-top: calc(var(--u)*1.6); display: flex; align-items: center; gap: calc(var(--u)*1); min-height: calc(var(--u)*3.6); padding-left: calc(var(--u)*1.1); color: var(--g3); white-space: nowrap; }
.fd-side .fd-theme > svg { flex: none; width: calc(var(--u)*2.2); height: calc(var(--u)*2.2); }
.fd-side .theme-pick { display: flex; flex-wrap: wrap; gap: calc(var(--u)*.5); width: calc(var(--u)*14); }
.fd-side .theme-pick .tp-label, .fd-side .theme-pick .tp-name { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.fd-side .theme-pick .tp-opt { display: block; width: calc(var(--u)*1.9); height: calc(var(--u)*1.9); padding: 0; border: 1px solid var(--g3); border-radius: 50%; background: none; }
.fd-side .theme-pick .tp-opt.is-on { outline: 2px solid var(--ink); outline-offset: 2px; }
.fd-side .theme-pick .tp-dot { display: block; width: 100%; height: 100%; border-radius: 50%; margin: 0; }
.fd-side:not(:hover):not(:focus-within) .theme-pick { pointer-events: none; visibility: hidden; }
.fd-side .fd-theme .theme-pick { flex: none; width: calc(var(--u)*14); }
.fd-side .fd-theme .theme-pick .tp-opt { flex: none; width: calc(var(--u)*1.9); height: calc(var(--u)*1.9); min-width: 0; min-height: 0; padding: 0; gap: 0; }
.fd-side .lang { margin-top: auto; }
.fd-side .fd-theme + .lang { margin-top: auto; }
.fd-side nav { margin-top: calc(var(--u)*2.4); }

/* ---- 左側欄：文字大小（點一下依序切換 標準 → 大 → 特大） ---- */
.fd-side .fd-fs { margin-top: auto; display: flex; align-items: center; gap: calc(var(--u)*1); height: calc(var(--u)*3.6); padding-left: calc(var(--u)*.7); color: var(--g4); white-space: nowrap; border: 1px solid var(--g2); background: var(--sheet); cursor: pointer; }
.fd-side .fd-fs:hover { color: var(--ink); background: var(--g1); }
.fd-side .fd-fs b { flex: none; position: relative; width: calc(var(--u)*2.8); text-align: center; font: 700 calc(var(--u)*1.25) var(--num); }
.fd-side .fd-fs b i { position: absolute; right: calc(var(--u)*.1); bottom: calc(var(--u)*-.5); display: flex; gap: 2px; }
.fd-side .fd-fs b i::before, .fd-side .fd-fs b i::after, .fd-side .fd-fs b::after { content: ""; }
.fd-side .fd-fs .lb { flex: 1; display: flex; justify-content: space-between; padding-right: calc(var(--u)*1); font-size: calc(var(--u)*1.05); }
.fd-side .fd-fs em { font-style: normal; font-weight: 700; color: var(--ink); }
html.fs-large .fd-side .fd-fs b { font-size: calc(var(--u)*1.5); }
html.fs-xlarge .fd-side .fd-fs b { font-size: calc(var(--u)*1.75); }
.fd-side .fd-fs + .lang { margin-top: calc(var(--u)*.6); }

/* ---- 首頁補充 ---- */
/* 作品標題往上，頂端和直圖對齊；底線只到標題字為止，不會被直圖蓋住；縮圖跟著上移 */
.fd-home #works .st { top: calc(var(--u)*3); }
.fd-home #works .st::after { right: 0; }
.fd-home .pick { top: calc(var(--u)*10.5); }
.fd-home #home .open.is-full { background: var(--g4); }
.fd-home #home .open.is-full i { background: var(--g2); }
.fd-home #home .sub, .fd-home #home .tagline { display: inline-flex; }
.fd-home #home .tagline { display: block; }
.fd-home #home h1 { color: var(--ink); }
.fd-home .pol img { height: auto; width: auto; max-height: calc(var(--u)*53); max-width: calc(var(--u)*58); }
.fd-home #home .h2 { left: calc(var(--u)*45); }
.fd-home .st { margin: 0; color: var(--ink); }
.fd-home #price .st { color: var(--sheet); }
.fd-home #price .pcard { box-shadow: none; border-radius: 0; }
.fd-home .stage .frame { cursor: default; }
.fd-home .pcard .tx .bt { display: block; }
.fd-home .pcard.is-paused .bt { background: var(--g3); color: var(--dark); }
.fd-home .pcard h3 { color: var(--sheet); }
.fd-home .pnote a { color: var(--acc); }
.fd-home .phase.no-bracket::before, .fd-home .phase.no-bracket::after { display: none; }
/* 須知、更多、委託格子改成上下接續排（文字變長時不會互相蓋住） */
.fd-home .stack { position: absolute; left: calc(var(--u)*8); top: calc(var(--u)*12); width: calc(var(--u)*88); }
.fd-home .list { position: static; width: auto; }
.fd-home .more { position: relative; left: auto; top: auto; margin-top: calc(var(--u)*.6); }
.fd-home .cta { position: relative; left: auto; top: auto; width: auto; margin-top: calc(var(--u)*2.5); }
.fd-home .ava { display: block; }
.fd-home .sched li.is-full b { color: var(--g4); border-color: var(--g4); }
.fd-home .bts a { display: block; }
/* 價目與須知：改成自動高度（翻譯文字較長、或價目項目超過兩個時都不會擠出框外） */
.fd-home #price, .fd-home #notice, .fd-home #flow { height: auto; min-height: 100vh; }
.fd-home #price .cv, .fd-home #notice .cv, .fd-home #flow .cv { position: relative; left: auto; top: auto; transform: none; margin: 0 auto; height: auto; min-height: calc(var(--u)*67.5); }
.fd-home #price .cv { padding: calc(var(--u)*14) 0 calc(var(--u)*5); }
.fd-home #notice .cv { padding: calc(var(--u)*12) 0 calc(var(--u)*5); }
.fd-home #flow .cv { padding: calc(var(--u)*14) 0 calc(var(--u)*5); }
.fd-home .fflow { position: relative; left: auto; right: auto; top: auto; margin: 0 calc(var(--u)*6) 0 calc(var(--u)*8); }
.fd-home #price .cards { position: relative; left: auto; right: auto; top: auto; margin: 0 calc(var(--u)*6) 0 calc(var(--u)*8); row-gap: calc(var(--u)*5); }
.fd-home #price .pcard { height: auto; min-height: calc(var(--u)*47.5); }
.fd-home #price .pnote { position: relative; left: auto; top: auto; margin: calc(var(--u)*2.4) 0 0 calc(var(--u)*8); }
.fd-home #notice .stack { position: relative; left: auto; top: auto; margin-left: calc(var(--u)*8); }
html[lang="en"] .fd-home .pcard h3, html[lang="ja"] .fd-home .pcard h3 { font-size: calc(var(--uf)*2.4); line-height: 1.25; }

/* 放大字級或英文時，流程步驟與委託格子不擠出畫面 */
.fd-home .fsteps { grid-template-columns: repeat(8, minmax(0, 1fr)); }
.fd-home .fsteps li b { white-space: normal; overflow-wrap: anywhere; }
.fd-home .cta { grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); }
.fd-home .bub { flex: 1; min-width: 0; }
.fd-home .sched li:not(.cap) { white-space: normal; }
.fd-foot .share a, .fd-foot .share button { line-height: 1.3; min-height: calc(var(--u)*4.2); padding: calc(var(--u)*.4) calc(var(--u)*.6); text-align: center; }

/* ---- 頁尾 ---- */
.fd-foot .fh { color: var(--sheet); font: 700 calc(var(--uf)*1.5) var(--zh); display: flex; align-items: center; gap: calc(var(--u)*.7); margin-bottom: calc(var(--u)*1.6); }
.fd-foot .fh i { width: calc(var(--u)*.9); height: calc(var(--u)*.9); background: var(--acc); }
.fd-foot .fbrand img { display: inline-block; height: auto; }
.fd-foot .share a, .fd-foot .share button { display: flex; align-items: center; justify-content: center; gap: calc(var(--u)*.8); background: var(--acc); color: var(--acc-ink); font: 700 calc(var(--uf)*1.4)/calc(var(--uf)*4.2) var(--zh); border: 0; cursor: pointer; }
.fd-foot .share a:hover, .fd-foot .share button:hover { background: var(--acc-hover); }
.fd-foot .share svg { width: calc(var(--u)*1.6); height: calc(var(--u)*1.6); flex: none; }
.fd-foot .ct a { word-break: break-all; }
.fd-helper { position: fixed; right: calc(var(--u)*1.6); bottom: calc(var(--u)*1.6); width: calc(var(--u)*6); z-index: 30; }
.fd-helper img { display: block; width: 100%; height: auto; background: none; }   /* 透明 PNG：不要延遲載入的底色 */
/* 右下角的小幫手和「頁首」按鈕不重疊：頁首按鈕排在小幫手上方 */
.fd-helper ~ .back-to-top { bottom: calc(var(--u)*7.6 + 14px + env(safe-area-inset-bottom)); }

@media (orientation: portrait) {
.fd-side{display:none}
.fd-top{display:flex;position:sticky;top:0;z-index:20;height:calc(var(--u)*10);align-items:center;gap:calc(var(--u)*1.2);padding:0 calc(var(--u)*3);background:var(--sheet);border-bottom:1px solid var(--g2)}
.fd-top>img{width:calc(var(--u)*6)}
.fd-top b{font:900 calc(var(--u)*2.8) var(--zh);white-space:nowrap}
.fd-top .m{width:calc(var(--u)*6);height:calc(var(--u)*6);background:var(--abyss);display:grid;place-items:center;flex:none}
.fd-top .m i{width:calc(var(--u)*3);height:calc(var(--u)*.35);background:var(--sheet);box-shadow:0 calc(var(--u)*1) 0 var(--sheet),0 calc(var(--u)*-1) 0 var(--sheet)}
.fd-home section{height:auto;min-height:0;overflow:visible;overflow-x:clip}
.fd-home .cv{position:relative;left:auto;top:auto;transform:none;width:auto;height:auto;padding:calc(var(--u)*5) calc(var(--u)*3.5) calc(var(--u)*7)}
.fd-home .cv>*{position:relative!important;left:auto!important;right:auto!important;top:auto!important;bottom:auto!important}
.fd-home #home .cv{padding-top:calc(var(--u)*2)}
.fd-home #home .bgtext{position:absolute!important;top:calc(var(--u)*2)!important;left:calc(var(--u)*-1)!important;font-size:calc(var(--u)*24)}
.fd-home #home .slash{position:absolute!important;right:calc(var(--u)*22)!important;top:calc(var(--u)*-10)!important;height:calc(var(--u)*120)}
.fd-home #home .slash.b{display:none}
.fd-home .pol{margin:calc(var(--u)*4) calc(var(--u)*2) 0;padding:calc(var(--u)*2) calc(var(--u)*2) calc(var(--u)*9);transform:rotate(1.5deg)}
.fd-home .pol img{width:100%;height:auto}
.fd-home #home .title{margin-top:calc(var(--u)*4);z-index:3}
.fd-home #home .open{font-size:calc(var(--uf)*2.4);line-height:calc(var(--u)*5);padding:0 calc(var(--u)*2.4);gap:calc(var(--u)*1.4);margin-bottom:calc(var(--u)*3);border-radius:calc(var(--u)*.7)}
.fd-home #home .open i{width:calc(var(--u)*1.4);height:calc(var(--u)*1.4)}
.fd-home #home h1{font-size:calc(var(--u)*8.6)}
.fd-home #home .sub{font-size:calc(var(--uf)*2.6)}
.fd-home #home .tagline{font-size:calc(var(--uf)*2.8)}
.fd-home #home .h1,.fd-home #home .h2{display:none}
.fd-home #home .h3{font-size:calc(var(--uf)*2.3);margin-top:calc(var(--u)*3)}
.fd-home .st{margin-bottom:calc(var(--u)*5)}
.fd-home .st .en{font-size:calc(var(--uf)*7.5)}
.fd-home .st .zh{font-size:calc(var(--uf)*3)}
.fd-home .st::after{right:0}
.fd-home #works .cv{display:flex;flex-direction:column}
.fd-home #works .st{order:0}
.fd-home .stage{order:1}
.fd-home .pick{order:3}
.fd-home .all{order:4}
.fd-home .stage{width:auto;height:auto;aspect-ratio:1;margin-top:calc(var(--u)*1)}
.fd-home .pick{width:auto;flex-direction:row;justify-content:center;padding:calc(var(--u)*1.6);gap:calc(var(--u)*1.6);margin-top:calc(var(--u)*4)}
.fd-home .pick .th{flex-direction:row;gap:calc(var(--u)*1.6)}
.fd-home .pick button{width:calc(var(--u)*5);height:calc(var(--u)*5);font-size:calc(var(--uf)*2);transform:rotate(-90deg)}
.fd-home .pick img{width:calc(var(--u)*11.5);height:calc(var(--u)*11.5)}
.fd-home .all{display:block;width:auto;font-size:calc(var(--uf)*2.6);line-height:calc(var(--u)*7);margin-top:calc(var(--u)*3)}
.fd-home .cards{grid-template-columns:1fr;gap:calc(var(--u)*5)}
.fd-home .pcard{height:auto;grid-template-columns:1fr}
.fd-home .pcard .art{position:relative;left:auto;right:auto;height:calc(var(--u)*70);
 -webkit-mask-image:linear-gradient(180deg,#000 70%,transparent);mask-image:linear-gradient(180deg,#000 70%,transparent)}
.fd-home .pcard .tx{padding:calc(var(--u)*13) calc(var(--u)*3.5) calc(var(--u)*3.5)}
.fd-home .pm{width:calc(var(--u)*30);left:calc(var(--u)*-1);top:calc(var(--u)*68)}
.fd-home .pcard h3{font-size:calc(var(--uf)*6)}
.fd-home .pcard .pr{font-size:calc(var(--uf)*9)}
.fd-home .pcard .range{font-size:calc(var(--uf)*2.2)}
.fd-home .pcard ul{font-size:calc(var(--uf)*2.5);margin-top:calc(var(--u)*3)}
.fd-home .pcard .bt{font-size:calc(var(--uf)*2.8);line-height:calc(var(--u)*7)}
.fd-home .pcard li::before{width:calc(var(--u)*1.2);height:calc(var(--u)*1.2)}
.fd-home .pcard{grid-template-columns:1fr}
.fd-home .pcard .tx{padding-top:calc(var(--u)*13)}
.fd-home .pcard .ds{font-size:calc(var(--uf)*2.5);margin-top:calc(var(--u)*2.6)}
.fd-home .pcard .prep{margin-top:calc(var(--u)*3.4)}
.fd-home .pcard .prep h4{font-size:calc(var(--uf)*2.6);margin-bottom:calc(var(--u)*1)}
.fd-home .pcard .prep ul{font-size:calc(var(--uf)*2.4);margin-top:0}
.fd-home .pcard .prep li{padding:calc(var(--u)*1) 0 calc(var(--u)*1) calc(var(--u)*2.4);text-indent:calc(var(--u)*-2.4)}
.fd-home .pnote{font-size:calc(var(--uf)*2.4);line-height:1.6;margin-top:calc(var(--u)*4)}
.fd-home .fsteps{grid-template-columns:1fr;gap:calc(var(--u)*4)}
.fd-home .fsteps li{display:grid;grid-template-columns:calc(var(--u)*7) 1fr;column-gap:calc(var(--u)*2);padding:calc(var(--u)*2.4) calc(var(--u)*3);border-top-width:calc(var(--u)*.7);border-radius:calc(var(--u)*1);font-size:calc(var(--uf)*2.4)}
.fd-home .fsteps li i{grid-row:span 2;font-size:calc(var(--uf)*4.4)}
.fd-home .fsteps li b{margin:0 0 calc(var(--u)*.6);font-size:calc(var(--uf)*3.2)}
.fd-home .fsteps li:not(:last-child)::after{right:auto;left:50%;top:auto;bottom:calc(var(--u)*-2.9);width:calc(var(--u)*1.6);height:calc(var(--u)*1.6);border-width:3px;transform:translateX(-50%) rotate(135deg)}
.fd-home .fbody{grid-template-columns:1fr;gap:calc(var(--u)*5);margin-top:calc(var(--u)*6)}
.fd-home .phase{order:-1;padding:calc(var(--u)*3.4) calc(var(--u)*3);border-radius:calc(var(--u)*1.4)}
.fd-home .phase::before,.fd-home .phase::after{display:none}
.fd-home .phase h3{font-size:calc(var(--uf)*3.6)}
.fd-home .phs{grid-template-columns:1fr;gap:calc(var(--u)*2);margin-top:calc(var(--u)*2.6)}
.fd-home .phs div{font-size:calc(var(--uf)*2.4);padding:calc(var(--u)*2.4);border-radius:calc(var(--u)*1)}
.fd-home .phs i{width:calc(var(--u)*4.4);height:calc(var(--u)*4.4);font-size:calc(var(--uf)*2.2)}
.fd-home .phs b{font-size:calc(var(--uf)*2.9);margin-left:calc(var(--u)*1.2)}
.fd-home .phs em{font-size:calc(var(--uf)*2);line-height:calc(var(--u)*3.6);padding:0 calc(var(--u)*1.4);border-radius:calc(var(--u)*.5)}
.fd-home .rev{font-size:calc(var(--uf)*2.4);padding:calc(var(--u)*2.4);gap:calc(var(--u)*1.6);margin-top:calc(var(--u)*2.6);border-radius:calc(var(--u)*1)}
.fd-home .rev svg{width:calc(var(--u)*3.2);height:calc(var(--u)*3.2)}
.fd-home .fnotes{padding-right:0;gap:calc(var(--u)*3)}
.fd-home .fnotes div{font-size:calc(var(--uf)*2.5);padding:calc(var(--u)*2.6) calc(var(--u)*3);border-left-width:calc(var(--u)*.9);border-radius:calc(var(--u)*.8)}
.fd-home .fnotes b{font-size:calc(var(--uf)*3)}
.fd-home .xh{width:calc(var(--u)*14)}
.fd-home .xh .h{display:none}
.fd-home .xh .v1{right:calc(var(--u)*4.5)}
.fd-home .xh .v2{right:calc(var(--u)*1)}
.fd-home .list{width:auto;margin-right:calc(var(--u)*10)}
.fd-home .list li{display:block;font-size:calc(var(--uf)*2.5);padding:calc(var(--u)*3) 0}
.fd-home .list span{display:block;margin-top:calc(var(--u)*1)}
.fd-home .list .tg{display:inline-flex;font-size:calc(var(--uf)*2.1);line-height:calc(var(--u)*4.4);padding:0 calc(var(--u)*1.6);margin-right:calc(var(--u)*2);vertical-align:calc(var(--u)*.4);gap:calc(var(--u)*.8)}
.fd-home .list .tg svg{width:calc(var(--u)*2.4);height:calc(var(--u)*2.4)}
.fd-home .list b{font-size:calc(var(--uf)*3.4)}
.fd-home .list i{display:none}
.fd-home .more{font-size:calc(var(--uf)*2.6);line-height:calc(var(--u)*7);margin-top:calc(var(--u)*4)}
.fd-home .cta{width:auto;grid-template-columns:minmax(0,1fr);gap:calc(var(--u)*4);padding:calc(var(--u)*4) calc(var(--u)*3.5);margin-top:calc(var(--u)*6);margin-right:calc(var(--u)*9)}
.fd-home .vn{gap:calc(var(--u)*2.6)}
.fd-home .ava{width:calc(var(--u)*15);height:calc(var(--u)*15)}
.fd-home .bub{font-size:calc(var(--uf)*2.6);padding:calc(var(--u)*2.6) calc(var(--u)*2.4) calc(var(--u)*1.8)}
.fd-home .bub .nm{font-size:calc(var(--uf)*2.1);line-height:calc(var(--u)*3.8);top:calc(var(--u)*-2)}
.fd-home .sched{gap:calc(var(--u)*1.4)}
.fd-home .sched li.cap{font-size:calc(var(--uf)*2.4);flex-basis:100%}
.fd-home .sched li{font-size:calc(var(--uf)*2.4);padding:calc(var(--u)*.8) calc(var(--u)*.8) calc(var(--u)*.8) calc(var(--u)*2);gap:calc(var(--u)*1.4)}
.fd-home .sched li b{font-size:calc(var(--uf)*2.1);line-height:calc(var(--u)*3.8);padding:0 calc(var(--u)*1.2)}
.fd-home .bts{gap:calc(var(--u)*2);margin-top:calc(var(--u)*3)}
.fd-home .bts a{font-size:calc(var(--uf)*2.7);line-height:calc(var(--u)*7.5)}
.fd-home .cta{border-radius:calc(var(--u)*1.4)}
.fd-home .bub{border-radius:calc(var(--u)*1)}
.fd-home .bub .nm{border-radius:calc(var(--u)*.5)}
.fd-home .sched li{border-radius:calc(var(--u)*.7)}
.fd-home .sched li.cap{border-radius:0}
.fd-home .sched li b{border-radius:calc(var(--u)*.4)}
.fd-home .bts a{border-radius:calc(var(--u)*.9)}
.fd-home .sched{grid-template-columns:1fr;gap:calc(var(--u)*1.6)}
.fd-home .sched li.cap{padding:0}
.fd-home .bts{gap:calc(var(--u)*1.6);margin-top:calc(var(--u)*1.6)}
.fd-home .sched{gap:calc(var(--u)*3);padding-top:calc(var(--u)*1.4)}
.fd-home .cta .bts{margin-top:calc(var(--u)*3.4)}
.fd-home .sched li:not(.cap){font-size:calc(var(--uf)*2.7);padding:calc(var(--u)*2.6) calc(var(--u)*2.2) calc(var(--u)*1.8) calc(var(--u)*2.4)}
.fd-home .sched li:not(.cap)::before{top:calc(var(--u)*-1.3);width:calc(var(--u)*9);height:calc(var(--u)*2.6);margin-left:calc(var(--u)*-4.5)}
.fd-home .sched li:not(.cap) b{font-size:calc(var(--uf)*2);line-height:calc(var(--u)*3.4);padding:0 calc(var(--u)*1);border-width:2px}
.fd-foot{padding:calc(var(--u)*7) calc(var(--u)*3.5) calc(var(--u)*4);font-size:calc(var(--uf)*2.5)}
.fd-foot .fwrap{grid-template-columns:1fr;gap:calc(var(--u)*6)}
.fd-foot .fbrand img{width:calc(var(--u)*8)}
.fd-foot .fbrand b{font-size:calc(var(--uf)*4)}
.fd-foot h4{font-size:calc(var(--uf)*2.9);margin-bottom:calc(var(--u)*2.6)}
.fd-foot h4 i{width:calc(var(--u)*1.4);height:calc(var(--u)*1.4)}
.fd-foot .ct{font-size:calc(var(--uf)*2.8);gap:calc(var(--u)*2.4) calc(var(--u)*3.6)}
.fd-foot .ct .cp{font-size:calc(var(--uf)*2.2);padding:calc(var(--u)*.8) calc(var(--u)*1.8)}
.fd-foot .share{gap:calc(var(--u)*1.8)}
.fd-foot .share a{font-size:calc(var(--uf)*2.7);line-height:calc(var(--u)*7.5);gap:calc(var(--u)*1.4)}
.fd-foot .share svg{width:calc(var(--u)*3);height:calc(var(--u)*3)}
.fd-foot .fbot{font-size:calc(var(--uf)*2);flex-direction:column;gap:calc(var(--u)*1)}

  html.is-field .layout { margin-left: 0; }
  .fd-home #works .st::after { right: 0; }
  .fd-home .frame { transform: translate(-50%,-50%); }
  .fd-home .pol img { width: 100%; height: auto; max-width: none; max-height: none; }
  .fd-foot { margin-left: 0; }
  .fd-brand { display: flex; align-items: center; gap: calc(var(--u)*1.2); min-width: 0; }
  .fd-brand img { width: calc(var(--u)*6); height: auto; flex: none; }
  .fd-top .m.menu-toggle { display: grid !important; border: 0; border-radius: 0; box-shadow: none; min-height: 0; background: var(--abyss); width: calc(var(--u)*6); height: calc(var(--u)*6); padding: 0; cursor: pointer; }
  .fd-top .menu-text { position: absolute; }
  .menu-open .fd-top { z-index: 70; }
  html.is-field .main { padding: 24px 18px 120px; }
  /* 手機選單：沿用原本的右側滑出面板 */
  html.is-field .site-nav, html.is-field.no-js .site-nav {
    display: block; position: fixed; top: 0; right: 0; bottom: 0; z-index: 60; width: 88%; max-width: 380px; max-height: none; margin: 0; flex: none;
    background: var(--sheet); overflow-y: auto; padding: 88px 0 40px; transform: translateX(105%); visibility: hidden;
    transition: transform .28s cubic-bezier(.2,.7,.2,1), visibility .28s; box-shadow: -12px 0 32px rgba(59,50,43,.2);
  }
  html.is-field .menu-open .site-nav { transform: translateX(0); visibility: visible; }
  html.is-field .nav-theme { display: block; }
  html.is-field .nav-fs { display: flex; padding: 0 22px 16px; }
  html.is-field .nav-fs .fs-label { display: inline; margin-right: 6px; }
  .fd-foot .share a, .fd-foot .share button { line-height: 1.3; min-height: calc(var(--u)*7.5); }
  .fd-home .fsteps { grid-template-columns: 1fr; }
  .fd-home .cta { grid-template-columns: minmax(0, 1fr); }
  .fd-home .stack { width: auto; margin-right: calc(var(--u)*0); }
  .fd-home .more { margin-top: calc(var(--u)*4); }
  .fd-home .cta { margin-top: calc(var(--u)*6); }
  .fd-home #price .cv, .fd-home #notice .cv { padding: calc(var(--u)*5) calc(var(--u)*3.5) calc(var(--u)*7); min-height: 0; }
  .fd-home #price, .fd-home #notice, .fd-home #flow { min-height: 0; }
  .fd-home #flow .cv { padding: calc(var(--u)*5) calc(var(--u)*3.5) calc(var(--u)*7); }
  .fd-home .fflow { margin: 0; }
  .fd-home #price .cards { margin: 0; }
  .fd-home #price .pnote { margin: calc(var(--u)*4) 0 0; }
  .fd-home #notice .stack { margin-left: 0; }
  html[lang="en"] .fd-home .pcard h3, html[lang="ja"] .fd-home .pcard h3 { font-size: calc(var(--uf)*5); }
  .fd-foot .fh { font-size: calc(var(--uf)*2.9); margin-bottom: calc(var(--u)*2.6); }
  .fd-foot .fh i { width: calc(var(--u)*1.4); height: calc(var(--u)*1.4); }
  .fd-foot .share a, .fd-foot .share button { font-size: calc(var(--uf)*2.7); line-height: calc(var(--u)*7.5); gap: calc(var(--u)*1.4); }
  .fd-foot .share svg { width: calc(var(--u)*3); height: calc(var(--u)*3); }
  .fd-helper { width: calc(var(--u)*11); }
  .fd-helper ~ .back-to-top { bottom: calc(var(--u)*12.6 + 14px + env(safe-area-inset-bottom)); }
}
