/* 06 懂你系列：五張摺頁卡片 */
.showroom.z06-showcase{
  position:relative;
}
.z06-showcase:before{
  content:"";
  position:absolute;
  z-index:-1;
  inset:0;
  pointer-events:none;
  mask-image:linear-gradient(90deg,transparent,#000 18%,#000 82%,transparent);
}
.z06-showcase .z06-head{position:relative;z-index:2;width:auto;max-width:1460px;margin:0 auto clamp(38px,6vh,68px);display:grid;justify-content:space-between}
.z06-showcase .z06-head .eyebrow{color:var(--pink);font-family:SpaceG,monospace;font-style:normal;font-size:clamp(11px,1vw,14px);font-weight:600}
.z06-showcase .z06-head>div>p:last-child{max-width:600px;margin:28px 0 0;font-size:clamp(16px,1.25vw,19px);line-height:1.75;color:#5d5148}
.z06-rail-shell{position:relative;z-index:2}
.z06-showcase .product-shelves.z06-rail{
  width:100%;
  max-width:none;
  margin:0;
  overscroll-behavior-inline:contain;
  -webkit-overflow-scrolling:touch;
}
.z06-rail:focus-visible{outline:2px solid var(--pink);outline-offset:7px}
.z06-rail:after{content:"";flex:0 0 max(var(--pad),calc(100vw - clamp(305px,23.4vw,414px) - (2 * var(--pad))))}
.z06-showcase .product.z06-card{
  --z06-shift:0px;
  --z06-scale:1;
  --z06-angle:0deg;
  --z06-lift:0px;
  align-items:stretch;
  border:1px solid rgba(48,0,96,.24);
  transform-origin:center 42%;
}
.z06-showcase .product.z06-card:hover,.z06-showcase .product.z06-card:focus-within{--z06-lift:-10px;--z06-scale:1.012;--z06-angle:0deg;border-color:var(--pink);box-shadow:0 34px 65px rgba(36,22,14,.22),0 6px 0 rgba(252,0,108,.2)}
.z06-card-top{min-height:34px;align-items:flex-start;justify-content:space-between;gap:12px;border-top:1px solid currentColor;padding-top:12px}
.z06-showcase .product-no{margin:0;color:inherit;font-size:10px;font-weight:700}
.z06-status{display:inline-flex;align-items:center;min-height:25px;padding:4px 8px;font:700 9px/1.1 SpaceG,monospace;letter-spacing:.06em;white-space:nowrap}
.z06-media{position:relative;width:100%;overflow:hidden;border:1px solid rgba(48,0,96,.18)}
.z06-media img,.z06-media video{display:block;max-width:100%}
.z06-media-fallback{position:absolute;z-index:12;inset:auto 10px 10px;margin:0;padding:10px;color:#641439;border:1px solid var(--pink);font-size:12px;line-height:1.45}
.z06-browser{position:absolute;inset:18px 16px 20px;padding-top:29px;border:1px solid rgba(255,255,255,.62);box-shadow:0 18px 38px rgba(0,0,0,.34)}
.z06-browser-bar{position:absolute;inset:0 0 auto;height:29px;display:flex;align-items:center;gap:5px;padding:0 9px;font:12px/1 SpaceG,monospace}
.z06-browser-bar i{display:block;width:6px;height:6px;border-radius:50%}
.z06-browser-bar span{margin-left:4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.z06-page-window{--z06-page-window:431px;position:absolute;inset:29px 0 0;overflow:hidden}
.z06-phone-window{position:absolute;right:9px;bottom:15px;z-index:5;width:29%;height:47%;overflow:hidden;border:4px solid #211628;border-radius:13px;box-shadow:0 12px 25px rgba(0,0,0,.36)}
.z06-template-stage{position:absolute;inset:20px}
.z06-template-card{position:absolute;object-fit:cover;box-shadow:0 17px 29px rgba(0,0,0,.34);will-change:transform,opacity}
.z06-logo-media:before{content:"";position:absolute;inset:7% 7% 19%;border:1px solid rgba(208,240,0,.65);transform:rotate(-4deg)}
.z06-logo-media video{position:absolute;z-index:2;left:8%;top:8%;width:84%;height:68%;object-fit:contain;background:#f4efe7;box-shadow:0 18px 36px rgba(0,0,0,.38)}
.z06-logo-media>img{position:absolute;z-index:4;right:3%;bottom:7%;border:5px solid #fff;transform:rotate(7deg);box-shadow:0 14px 28px rgba(0,0,0,.38)}
.z06-card-copy{display:flex;flex-direction:column;flex:1}
.z06-card-copy>div{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;border-bottom:1px solid rgba(48,0,96,.2);padding-bottom:12px}
.z06-showcase .product.z06-card h3{margin:0;color:var(--violet);font-size:clamp(30px,2.25vw,39px);line-height:1.05}
.z06-showcase .product.z06-card p{margin:0}
.z06-card-actions{display:grid;grid-template-columns:1fr;gap:9px}
.z06-showcase .z06-card-actions a{min-height:46px;display:flex;align-items:center;justify-content:center;margin:0;padding:9px 10px;border:1px solid var(--violet);font-size:13px;font-weight:600;line-height:1.35;letter-spacing:.02em;text-align:center;text-decoration:none}
.z06-showcase .z06-card-actions a b{margin-left:5px;font-size:15px}
.z06-showcase .z06-card-actions a:hover,.z06-showcase .z06-card-actions a:focus-visible{background:var(--pink);border-color:var(--pink)}
.z06-navigation{position:relative;z-index:2;max-width:1460px;margin:0 auto;grid-template-columns:auto minmax(140px,1fr) auto auto;align-items:center;gap:clamp(12px,2vw,28px);border-top:1px solid rgba(48,0,96,.38);padding-top:17px}
.z06-navigation>button{min-height:46px;padding:9px 14px;border:1px solid var(--violet);color:var(--violet);font-size:12px;font-weight:600}
.z06-navigation>button:hover,.z06-navigation>button:focus-visible{background:var(--violet);color:#fff}
.z06-navigation>button:disabled{opacity:.42;cursor:not-allowed;background:transparent;color:var(--violet)}
.z06-progress{display:flex;align-items:baseline;gap:7px;margin:0;font:12px/1 SpaceG,monospace}
.z06-progress i{font-style:normal}
.z06-progress strong{margin-left:8px;font-family:GenYo,"Microsoft JhengHei",sans-serif;font-size:14px;font-weight:600}
.z06-index{display:flex;gap:6px}
.z06-index button{min-width:44px;min-height:44px;border:1px solid rgba(48,0,96,.28);font:10px/1 SpaceG,monospace}
.z06-index button.is-current,.z06-index button:hover,.z06-index button:focus-visible{background:var(--acid);border-color:var(--violet)}
.z06-package-link{position:relative;z-index:2;max-width:1460px;margin:clamp(42px,7vh,74px) auto 0;justify-content:space-between;text-decoration:none;font-size:clamp(18px,1.55vw,24px)}
.z06-package-link span{font-size:13px;letter-spacing:.04em}
.z06-package-link:hover,.z06-package-link:focus-visible{background:#46106e}

@media(max-width:1100px){
  .z06-rail:after{flex-basis:max(var(--pad),calc(100vw - clamp(330px,43vw,470px) - (2 * var(--pad))))}
  .z06-navigation{grid-template-columns:auto 1fr auto}
  .z06-index{grid-column:1/-1;justify-content:center;order:4}
}
@media(max-width:760px){
  .z06-showcase .product.z06-card{margin-top:0;--z06-angle:0deg;--z06-shift:0px;--z06-scale:1;transform:translateY(var(--z06-lift))}
  .z06-rail:after{flex-basis:max(var(--pad),calc(100vw - min(86vw,410px) - (2 * var(--pad))))}
  .z06-navigation{grid-template-columns:1fr auto 1fr;gap:9px}
  .z06-navigation>button{padding:8px 10px}
  .z06-progress{justify-content:center}.z06-progress strong{display:none}
  .z06-index{overflow-x:auto;justify-content:center}
  .z06-package-link{flex-wrap:wrap}
}
@media(max-width:760px){
  .z06-showcase .z06-head>div>p:last-child{font-size:15px}
  .z06-card-top{gap:7px}.z06-status{font-size:8px;padding-inline:6px}.z06-page-window{--z06-page-window:341px}.z06-phone-window{height:43%}
  .z06-card-copy>div{display:block}
  .z06-showcase .z06-card-actions a{min-height:48px}
  .z06-index button{min-width:44px;min-height:44px}
}
@media(prefers-reduced-motion:reduce){
  .z06-showcase .product.z06-card{--z06-shift:0px!important;--z06-scale:1!important;--z06-angle:0deg!important;transform:translateY(var(--z06-lift))!important}
  .z06-rail{scroll-behavior:auto!important}
}

/* 06 視覺：金色系延伸配色 */
.showroom.z06-showcase:before{
  opacity:.16;
  background-image:linear-gradient(rgba(74,55,40,.14) 1px,transparent 1px),linear-gradient(90deg,rgba(74,55,40,.14) 1px,transparent 1px);
  background-size:72px 72px;
}
.showroom.z06-showcase .z06-head.z06-head--split{align-items:end}
.showroom.z06-showcase .z06-head h2{
  color:var(--z06-brown);
}
.showroom.z06-showcase .z06-title-line{display:block;white-space:nowrap}
.showroom.z06-showcase .z06-head > div > p:last-child{
  max-width:560px;
  margin-top:24px;
  line-height:1.7;
  color:rgba(74,55,40,.88);
}
.showroom.z06-showcase .z06-intro-copy{
  display:grid;
  border-left:3px solid var(--z06-copper);
  background:linear-gradient(90deg,rgba(200,221,126,.28),rgba(200,221,126,.06) 72%,transparent);
  color:rgba(74,55,40,.82);
}
.showroom.z06-showcase .z06-intro-copy strong{
  display:block;
  color:var(--z06-copper);
}
.showroom.z06-showcase .z06-intro-copy span{display:block;color:rgba(74,55,40,.8)}
.showroom.z06-showcase .z06-rail-shell{width:100%;margin-right:0}
.showroom.z06-showcase .product-shelves.z06-rail{
  grid-template-columns:repeat(5,minmax(0,1fr));
  scroll-padding-inline:0;
  scrollbar-width:none;
  scrollbar-color:var(--z06-copper) rgba(74,55,40,.12);
}
.showroom.z06-showcase .z06-rail:after{display:none}
.showroom.z06-showcase .z06-rail:focus-visible{outline-color:var(--z06-copper)}
.showroom.z06-showcase .product.z06-card{
  background:rgba(255,249,238,.98);
  box-shadow:0 18px 42px rgba(25,19,16,.13),0 4px 0 rgba(74,55,40,.08);
  scroll-snap-align:none;
}
.showroom.z06-showcase .product.z06-card:hover,.showroom.z06-showcase .product.z06-card:focus-within{border-color:var(--z06-copper);box-shadow:0 28px 54px rgba(25,19,16,.18),0 6px 0 rgba(200,221,126,.44)}
.showroom.z06-showcase .z06-card:nth-child(1),.showroom.z06-showcase .z06-card:nth-child(2),.showroom.z06-showcase .z06-card:nth-child(3),.showroom.z06-showcase .z06-card:nth-child(4),.showroom.z06-showcase .z06-card:nth-child(5){--z06-angle:0deg}
.showroom.z06-showcase .z06-card-top{border-top-color:var(--z06-line);margin-bottom:14px;color:var(--z06-brown)}
.showroom.z06-showcase .product-no{display:inline-flex;align-items:center;gap:7px}
.showroom.z06-showcase .product-no:before{content:"";display:block;width:7px;height:7px;flex:0 0 7px;border-radius:50%;background:var(--z06-accent)}
.showroom.z06-showcase .z06-status{background:var(--z06-gold);color:var(--z06-brown)}
.showroom.z06-showcase .z06-card--page,.showroom.z06-showcase .z06-card--grid,.showroom.z06-showcase .z06-card--logo,.showroom.z06-showcase .z06-card--mail,.showroom.z06-showcase .z06-card--motion{--z06-accent:var(--z06-gold)}
.showroom.z06-showcase .z06-media{height:clamp(370px,31vw,430px);border-color:var(--z06-line);box-shadow:0 13px 28px rgba(25,19,16,.17)}
.showroom.z06-showcase .z06-media-fallback{background:var(--z06-card);color:var(--z06-brown);border-color:var(--z06-copper)}
.showroom.z06-showcase .z06-page-media{background:linear-gradient(145deg,var(--z06-brown),var(--z06-copper) 52%,var(--z06-gold))}
.showroom.z06-showcase .z06-browser{background:var(--z06-card);border-color:rgba(255,249,238,.72)}
.showroom.z06-showcase .z06-browser-bar{background:var(--z06-gold-soft);color:var(--z06-brown)}
.showroom.z06-showcase .z06-browser-bar i{background:var(--z06-copper)}
.showroom.z06-showcase .z06-browser-bar i:nth-child(2){background:var(--z06-gold)}
.showroom.z06-showcase .z06-browser-bar i:nth-child(3){background:var(--z06-brown)}
.showroom.z06-showcase .z06-page-window{background:var(--z06-card)}
.showroom.z06-showcase .z06-phone-window{border-color:var(--z06-deep);background:var(--z06-card)}
.showroom.z06-showcase .z06-grid-media{background:linear-gradient(160deg,var(--z06-brown),var(--z06-copper) 54%,var(--z06-gold))}
.showroom.z06-showcase .z06-logo-media{background:linear-gradient(145deg,var(--z06-deep) 0%,var(--z06-brown) 60%,var(--z06-copper) 100%)}
.showroom.z06-showcase .z06-logo-media:before{border-color:rgba(200,221,126,.72)}
.showroom.z06-showcase .z06-logo-media video{background:var(--z06-paper)}
.showroom.z06-showcase .z06-logo-media > img{border-color:var(--z06-card)}
.showroom.z06-showcase .z06-mail-media{background:linear-gradient(145deg,var(--z06-gold-wash),var(--z06-card))}
.showroom.z06-showcase .z06-motion-media{background:linear-gradient(145deg,var(--z06-brown),var(--z06-deep))}
.showroom.z06-showcase .z06-page-window{--z06-page-window:calc(clamp(370px,31vw,430px) - 67px)}
.showroom.z06-showcase .z06-card-copy{padding-top:22px;gap:9px}
.showroom.z06-showcase .z06-card-copy > div{border-bottom-color:var(--z06-line-soft)}
.showroom.z06-showcase .product.z06-card h3{color:var(--z06-brown)}
.showroom.z06-showcase .product.z06-card .z06-card-lead{max-width:34ch;color:var(--z06-deep);font-size:clamp(13px,1.05vw,16px);font-weight:700;line-height:1.45;letter-spacing:.025em}
.showroom.z06-showcase .z06-card-actions{margin-top:18px}
.showroom.z06-showcase .z06-card-actions a{
  border-color:var(--z06-brown);background:var(--z06-brown);color:var(--z06-card)}
.showroom.z06-showcase .z06-card-actions a b{color:var(--z06-gold)}
.showroom.z06-showcase .z06-card-actions a:hover,.showroom.z06-showcase .z06-card-actions a:focus-visible{background:var(--z06-copper);border-color:var(--z06-copper)}
.showroom.z06-showcase .z06-card-actions a[aria-disabled="true"]{cursor:help}
.showroom.z06-showcase .z06-card-actions a[aria-disabled="true"]:hover,.showroom.z06-showcase .z06-card-actions a[aria-disabled="true"]:focus-visible{background:var(--z06-brown);border-color:var(--z06-brown)}
.showroom.z06-showcase .z06-navigation > button{border-color:var(--z06-brown);color:var(--z06-brown)}
.showroom.z06-showcase .z06-navigation > button:hover,.showroom.z06-showcase .z06-navigation > button:focus-visible{background:var(--z06-brown);color:var(--z06-card)}
.showroom.z06-showcase .z06-navigation > button:disabled{color:var(--z06-brown)}
.showroom.z06-showcase .z06-progress{color:var(--z06-brown)}
.showroom.z06-showcase .z06-progress i{color:var(--z06-copper)}
.showroom.z06-showcase .z06-index button{border-color:rgba(74,55,40,.28);color:var(--z06-brown)}
.showroom.z06-showcase .z06-index button.is-current,.showroom.z06-showcase .z06-index button:hover,.showroom.z06-showcase .z06-index button:focus-visible{background:var(--z06-gold);border-color:var(--z06-brown)}
.showroom.z06-showcase .z06-navigation{
  border-top-color:rgba(74,55,40,.3);display:none}
.showroom.z06-showcase .z06-package-link span,.showroom.z06-showcase .z06-package-link b{color:var(--z06-gold)}
.showroom.z06-showcase .z06-package-link:hover,.showroom.z06-showcase .z06-package-link:focus-visible{background:var(--z06-copper)}
@media(max-width:1100px){
  .showroom.z06-showcase .z06-media{height:clamp(300px,38vw,350px)}
}
@media(max-width:760px){
  .showroom.z06-showcase .z06-media{height:clamp(325px,92vw,370px)}
  .showroom.z06-showcase .z06-page-window{--z06-page-window:calc(clamp(325px,92vw,370px) - 67px)}
}

/* Zone 06 / FeralUI-inspired fold wall: active service opens, neighbours become tabs. */

.showroom.z06-showcase.z06-fold-ready .product-shelves.z06-rail{
  display:flex;
  align-items:stretch;
  gap:clamp(8px,.8vw,14px);
  height:clamp(740px,50vw,820px);
  padding:22px 0 52px;
  overflow:visible;
  overscroll-behavior:initial;
  scroll-snap-type:none;
}
.showroom.z06-showcase.z06-fold-ready .product.z06-card{
  flex:var(--z06-fold-closed-grow) 1 0;
  width:auto;
  min-width:0;
  min-height:0;
  height:100%;
  margin:0;
  padding:0;
  overflow:hidden;
  border-color:var(--z06-line);
  transform:none;
}
.showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open{
  flex:4 1 0;
}
.showroom.z06-showcase.z06-fold-ready .z06-fold-tab{
  position:absolute;
  z-index:10;
  inset:0;
  width:100%;
  min-height:100%;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  margin:0;
  padding:20px 15px;
  overflow:hidden;
  border:0;
  border-radius:inherit;
  color:var(--z06-card);
  background-blend-mode:multiply;
  font:inherit;
  text-align:left;
  cursor:pointer;
  isolation:isolate;
  transition:filter .5s ease .12s,background-color .5s ease .12s;
}
.showroom.z06-showcase.z06-fold-ready .z06-fold-tab::after{
  content:"";
  position:absolute;
  z-index:0;
  inset:0;
  background:linear-gradient(110deg,transparent 34%,rgba(200,221,126,.32) 48%,rgba(255,249,238,.12) 52%,transparent 67%);
  transform:translateX(-125%);
  transition:transform .9s cubic-bezier(.16,1.08,.3,1) .12s;
  pointer-events:none;
}
.showroom.z06-showcase.z06-fold-ready .z06-fold-tab:hover::after,.showroom.z06-showcase.z06-fold-ready .z06-fold-tab:focus-visible::after{transform:translateX(125%)}
.showroom.z06-showcase.z06-fold-ready .z06-fold-tab > *{position:relative;z-index:1}
.showroom.z06-showcase.z06-fold-ready .z06-fold-tab:hover,.showroom.z06-showcase.z06-fold-ready .z06-fold-tab:focus-visible{filter:saturate(1.12) brightness(1.08)}
.showroom.z06-showcase.z06-fold-ready .z06-fold-tab:focus-visible{outline:3px solid var(--z06-gold);outline-offset:-6px}
.showroom.z06-showcase.z06-fold-ready .z06-fold-code{font:700 12px/1 SpaceG,monospace;letter-spacing:.08em}
.showroom.z06-showcase.z06-fold-ready .z06-fold-text{display:flex;flex-direction:column;gap:7px;justify-content:space-between;writing-mode:vertical-rl;text-orientation:mixed}
.showroom.z06-showcase.z06-fold-ready .product.z06-card:not(.is-open) .z06-fold-code{position:absolute;top:20px;left:clamp(7px,1.05vw,15px)}
.showroom.z06-showcase.z06-fold-ready .product.z06-card:not(.is-open) .z06-fold-text{position:absolute;left:clamp(7px,1.05vw,15px);bottom:97px;width:auto;height:330px;min-height:0;margin:0;flex:0 0 330px}
.showroom.z06-showcase.z06-fold-ready .z06-fold-text strong{font-size:clamp(18px,1.55vw,26px);line-height:1.08;letter-spacing:.04em;overflow-wrap:anywhere}
.showroom.z06-showcase.z06-fold-ready .z06-fold-text small{font:10px/1.4 SpaceG,monospace;letter-spacing:.07em}
.showroom.z06-showcase.z06-fold-ready .z06-fold-status{padding:6px 8px;background:var(--z06-gold);color:var(--z06-brown);font:700 9px/1.25 SpaceG,monospace;letter-spacing:.04em;writing-mode:horizontal-tb;white-space:normal;overflow-wrap:anywhere;box-shadow:0 5px 14px rgba(25,19,16,.2)}
.showroom.z06-showcase.z06-fold-ready .product.z06-card:not(.is-open) .z06-fold-status{position:absolute;left:clamp(7px,1.05vw,15px);bottom:51px;max-width:calc(100% - clamp(14px,2.1vw,30px));margin:0;align-self:auto}
.showroom.z06-showcase.z06-fold-ready .z06-fold-arrow{color:var(--z06-gold);font:24px/1 SpaceG,monospace}
.showroom.z06-showcase.z06-fold-ready .product.z06-card:not(.is-open) .z06-fold-arrow{position:absolute;right:12px;bottom:14px;margin:0;align-self:auto}

.showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-fold-tab{
  inset:0 0 auto;
  min-height:70px;
  height:70px;
  flex-direction:row;
  align-items:center;
  justify-content:flex-start;
  padding:12px 18px;
  border-radius:8px 8px 0 0;
  filter:none;
}
.showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-fold-tab::after{display:none}
.showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-fold-text{position:static;flex:0 1 auto;flex-direction:column;gap:2px;width:auto;height:auto;min-height:0;margin:0 0 0 12px;writing-mode:horizontal-tb}
.showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-fold-arrow{color:var(--z06-copper)}
.showroom.z06-showcase.z06-fold-ready .z06-card-body{
  display:flex;
  flex-direction:column;
  width:100%;
  height:100%;
  min-height:0;
  background:var(--z06-card);
}
.showroom.z06-showcase.z06-fold-ready .z06-card-top{display:none}
.showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-fold-tab + .z06-card-body{border-radius:0 0 8px 8px}

@media(max-width:1100px){
  .showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-fold-tab{
    position:relative;
    width:100%;
  }
  .showroom.z06-showcase.z06-fold-ready .z06-fold-text strong{font-size:20px}
  .showroom.z06-showcase.z06-fold-ready .z06-fold-arrow{color:var(--z06-gold);font-size:20px}
  .showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-card-body{
    width:100%;
    height:auto;
    padding:20px clamp(18px,3vw,30px) 24px;
    overflow:visible;
    border-top:1px solid var(--z06-line);
    border-radius:0 0 8px 8px;
  }
}

@media(max-width:760px){
  .showroom.z06-showcase.z06-fold-ready .z06-fold-text{min-width:0}
  .showroom.z06-showcase.z06-fold-ready .z06-fold-status{flex:0 1 31%;min-width:0;font-size:8px;line-height:1.2;text-align:right}
  .showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-card-body{padding:16px 14px 20px}
}

/* Keep the Fold wall horizontal on tablet and phone; only the tab proportions change. */
@media(max-width:1100px){
  .showroom.z06-showcase.z06-fold-ready .product-shelves.z06-rail{
    display:flex;
    gap:8px;
    padding:20px 0 46px;
    overflow:hidden;
  }
  .showroom.z06-showcase.z06-fold-ready .product.z06-card{
    display:block;
    flex:var(--z06-fold-closed-grow) 1 0;
    width:auto;
    min-width:26px;
    height:100%;
    min-height:0;
    margin:0;
    overflow:hidden;
  }
  .showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open{flex:4 1 0}
  .showroom.z06-showcase.z06-fold-ready .z06-fold-tab{
  background-image:none;
    position:absolute;
    inset:0;
    width:100%;
    min-height:100%;
    height:auto;
    flex-direction:column;
    align-items:flex-start;
    justify-content:space-between;
    padding:18px 12px;
    border-radius:inherit;
    color:var(--z06-card);
    background-blend-mode:multiply;
    filter:none;
  }
  .showroom.z06-showcase.z06-fold-ready .z06-fold-text{display:flex;flex-direction:column;gap:7px;justify-content:space-between;writing-mode:vertical-rl;text-orientation:mixed}
  .showroom.z06-showcase.z06-fold-ready .z06-fold-status{
  box-shadow:none;padding:6px 8px;writing-mode:horizontal-tb;white-space:normal;overflow-wrap:anywhere}
  .showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-fold-tab{
    inset:0 0 auto;
    min-height:70px;
    height:70px;
    flex-direction:row;
    padding:12px 16px;
  }
  .showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-fold-text{position:static;flex:0 1 auto;flex-direction:column;gap:2px;width:auto;height:auto;min-height:0;margin:0 0 0 12px;writing-mode:horizontal-tb}
  .showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-fold-arrow{color:var(--z06-copper)}
}

@media(max-width:760px){
  /* 手機：五張卡都展開，左右滑一次停一張；兩側露出一點相鄰的卡，看得出可以滑 */
  .showroom.z06-showcase.z06-fold-ready .product-shelves.z06-rail{gap:12px;padding:14px 7% 32px;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scroll-padding-inline:7%;overscroll-behavior-x:contain}
  .showroom.z06-showcase.z06-fold-ready .product.z06-card{flex:0 0 86%;scroll-snap-align:center;scroll-snap-stop:always}
  .showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open{flex:0 0 86%}
  .showroom.z06-showcase.z06-fold-ready .z06-fold-tab{padding:14px 7px}
  .showroom.z06-showcase.z06-fold-ready .z06-fold-code{font-size:12px;letter-spacing:.04em}
  .showroom.z06-showcase.z06-fold-ready .z06-fold-text{gap:5px}
  .showroom.z06-showcase.z06-fold-ready .product.z06-card:not(.is-open) .z06-fold-code{top:14px;left:7px}
  .showroom.z06-showcase.z06-fold-ready .product.z06-card:not(.is-open) .z06-fold-text{left:7px;bottom:47px;height:calc(100% - 90px);flex-basis:auto}
  .showroom.z06-showcase.z06-fold-ready .product.z06-card:not(.is-open) .z06-fold-arrow{right:7px;bottom:10px}
  .showroom.z06-showcase.z06-fold-ready .z06-fold-text strong{
  white-space:normal;
  overflow:visible;
  text-overflow:clip;font-size:clamp(16px,4.8vw,20px);line-height:1.08}
  .showroom.z06-showcase.z06-fold-ready .z06-fold-text small{letter-spacing:.03em}
  .showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-card-actions{grid-template-columns:1fr}
  .showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-fold-code{overflow:hidden}
  .showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-fold-text{grid-column:2;grid-row:1 / 3;align-self:end;gap:1px;margin:0}
}

/* Zone 06 / expanded media stage + dedicated CTA footer. */
.showroom.z06-showcase.z06-fold-ready .z06-card-body{
  overflow:hidden;padding:84px clamp(10px,1vw,16px) 0}
.showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-page-window{--z06-page-window:calc(clamp(360px,31vw,480px) - 67px)}
.showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-card-copy{min-height:0;padding:17px 0 16px;gap:0}
.showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-card-actions{
  margin: auto calc(clamp(10px,1vw,16px) * -1) 0;
  padding:12px clamp(10px,1vw,16px) 18px;
  border-top:1px solid var(--z06-line-soft);
}

@media(max-width:1100px){
  .showroom.z06-showcase.z06-fold-ready .z06-card-body{
  display:flex;
  width:100%;
  height:100%;
  overflow:hidden;
  border-top:0;
  border-radius:0 0 8px 8px;padding:84px clamp(10px,1.5vw,16px) 0}
  .showroom.z06-showcase.z06-fold-ready .product-shelves.z06-rail{
  grid-template-columns:none;
  align-items:stretch;height:clamp(700px,72vw,820px)}
  .showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-media{height:clamp(340px,42vw,460px)}
  .showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-page-window{--z06-page-window:calc(clamp(340px,42vw,460px) - 67px)}
  .showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-card-actions{margin: auto calc(clamp(10px,1.5vw,16px) * -1) 0;padding-inline:clamp(10px,1.5vw,16px)}
}

@media(max-width:760px){
  .showroom.z06-showcase.z06-fold-ready .z06-card-body{padding:112px 8px 0}
  .showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-card-actions{margin: auto -8px 0;padding:10px 8px 14px}
}

/* Zone 06 / stronger service subtitle + inline deliverable label. */
.showroom.z06-showcase.z06-fold-ready .product:not(.is-open) .z06-fold-text small{
  font-size:12px;
  line-height:1.3;
  color:var(--z06-copper);
  opacity:1;
}

.showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-fold-tab{
  display:grid;
  column-gap:clamp(8px,1.2vw,16px);
  row-gap:5px;
}
.showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-fold-code{
  white-space:nowrap;
  grid-column:1;
  grid-row:1 / 3;
  align-self:center;
  margin:0;
}
.showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-fold-text{display:contents}
.showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-fold-text strong{
  font-size:clamp(20px,1.8vw,28px);
  line-height:1.05;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  grid-column:2;
  grid-row:1;
  align-self:end;
  margin:0;
}
.showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-fold-text small{
  font-size:clamp(12px,1.05vw,16px);
}
.showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-fold-status{
  overflow:hidden;
}
.showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-fold-arrow{
  grid-column:3;
  grid-row:1 / 3;
  align-self:center;
  margin:0;
  font-size:18px;
}

@media(max-width:1100px){
  .showroom.z06-showcase.z06-fold-ready .product:not(.is-open) .z06-fold-text small{font-size:11px}
  .showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-fold-tab{
  align-items:center;
  justify-content:flex-start;
  border-radius:8px 8px 0 0;
  filter:none;
    column-gap:clamp(6px,1.2vw,12px);
    padding-inline:14px;
  }
  .showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-fold-text small{font-size:clamp(12px,1.3vw,14px)}
}

@media(max-width:760px){
  .showroom.z06-showcase.z06-fold-ready .product:not(.is-open) .z06-fold-text small{font-size:10px}
  .showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-fold-tab{
    position:relative;
    row-gap:4px;
    min-height:100px;
    height:100px;
    padding:10px;
  }
  .showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-fold-status{
  text-align:right;
  }
  .showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-fold-arrow{
    position:absolute;
    top:10px;
    right:10px;
    margin:0;
    font-size:16px;
  }
}

/* Zone 06 / pure backgrounds + supplied transparent image overlays. */
.showroom.z06-showcase.z06-fold-ready .product.z06-card:not(.is-open) .z06-fold-tab{
  background-color:transparent;
  background-blend-mode:normal;
  background-position:center center;
  background-repeat:no-repeat;
  background-size:cover;
}
.showroom.z06-showcase.z06-media-ready .product.z06-card--page:not(.is-open) .z06-fold-tab{background-image:url("../assets/img/zone06-fold-01-web-pure_941w.webp")}
.showroom.z06-showcase.z06-media-ready .product.z06-card--grid:not(.is-open) .z06-fold-tab{background-image:url("../assets/img/zone06-fold-02-social-pure_941w.webp")}
.showroom.z06-showcase.z06-media-ready .product.z06-card--logo:not(.is-open) .z06-fold-tab{background-image:url("../assets/img/zone06-fold-03-brand-pure_941w.webp")}
.showroom.z06-showcase.z06-media-ready .product.z06-card--mail:not(.is-open) .z06-fold-tab{background-image:url("../assets/img/zone06-fold-04-visual-pure_941w.webp")}
.showroom.z06-showcase.z06-media-ready .product.z06-card--motion:not(.is-open) .z06-fold-tab{background-image:url("../assets/img/zone06-fold-05-motion-pure_941w.webp")}

/* The supplied overlays share the same 941x1672 canvas as the pure backgrounds. */
.showroom.z06-showcase.z06-fold-ready .product.z06-card:not(.is-open) .z06-fold-art{
  position:absolute;
  z-index:1;
  inset:0;
  display:block;
  width:100%;
  height:100%;
  max-width:none;
  object-fit:cover;
  object-position:center center;
  pointer-events:none;
  user-select:none;
  opacity:1;
}
.showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-fold-art{display:none}

/* Closed fold art alignment: keep the index near the upper safe area and enlarge the title card in the lower-left. */
.showroom.z06-showcase.z06-fold-ready .product.z06-card:not(.is-open) .z06-fold-index-art{
  transform:translateY(-16.5%);
  transform-origin:center center;
}
.showroom.z06-showcase.z06-fold-ready .product.z06-card:not(.is-open) .z06-fold-title-art{
  transform:translateX(clamp(-76px,-5vw,-46px)) translateY(clamp(160px,24%,170px)) scale(.78);
  transform-origin:center center;
  transition:transform .82s cubic-bezier(.16,1.08,.3,1);
}

@media(max-width:760px){
  /* Mobile keeps the Chinese title scale, moving it slightly lower without changing its proportion. */
  .showroom.z06-showcase.z06-fold-ready .product.z06-card:not(.is-open) .z06-fold-title-art{
    transform:translateY(clamp(124px,24vw,150px)) scale(.78);
  }
  /* Keep the narrow index artwork inside each fold and inside the viewport. */
  .showroom.z06-showcase.z06-fold-ready .product.z06-card:not(.is-open) .z06-fold-index-art{
    width:100%;
    max-width:100%;
    min-width:0;
    transform:translateY(-16.5%) scale(.86);
    transform-origin:center top;
  }
}

/* When desktop or tablet opens one service, the remaining narrow folds keep both supplied cards centered. */
@media(min-width:761px){
  .showroom.z06-showcase.z06-fold-ready.has-fold-open .product.z06-card:not(.is-open) .z06-fold-index-art{
    transform:translateY(-16.5%);
    transform-origin:center center;
  }
  .showroom.z06-showcase.z06-fold-ready.has-fold-open .product.z06-card:not(.is-open) .z06-fold-title-art{
    transform:translateX(0) translateY(clamp(160px,24%,170px)) scale(.78);
    transform-origin:center center;
  }
}

/* Keep the existing semantic HTML for the expanded header, but let the supplied art own the closed state. */
.showroom.z06-showcase.z06-fold-ready .product.z06-card:not(.is-open) .z06-fold-code,.showroom.z06-showcase.z06-fold-ready .product.z06-card:not(.is-open) .z06-fold-text,.showroom.z06-showcase.z06-fold-ready .product.z06-card:not(.is-open) .z06-fold-arrow{
  opacity:0;
  visibility:hidden;
  pointer-events:none;
}

/* Zone 06 / deliverable tag belongs to the lower lead row. */
.showroom.z06-showcase.z06-fold-ready .product:not(.is-open) .z06-card-copy .z06-fold-status{display:none}
.showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-card-copy{
  column-gap:clamp(8px,1.2vw,16px);
}
.showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-card-copy .z06-fold-status{
  color:var(--z06-brown);
}

@media(max-width:1100px){
  .showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-card-copy{column-gap:10px}
}

@media(max-width:760px){
  .showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-card-copy{
    column-gap:7px;
  }
}

/* Zone 06 / expanded showcase uses each service's supplied background; inner frames stay border-only. */
.showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-media{
  background-color:transparent;
  background-position:center center;
  background-repeat:no-repeat;
  background-size:cover;
}
.showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-logo-media video{
  background:transparent;
  box-shadow:none;
  border:1px solid rgba(255,249,238,.78);
}
.showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-logo-media > img{
  box-shadow:none;
}

/* Zone 06 / the supplied service image is the background of the complete expanded card. */
.showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open{
  border-color:var(--z06-copper);
  box-shadow:0 24px 54px rgba(25,19,16,.2),0 6px 0 rgba(200,221,126,.48);
  background-color:transparent;
  background-position:center center;
  background-repeat:no-repeat;
  background-size:cover;
}
.showroom.z06-showcase.z06-media-ready .product.z06-card--page.is-open{background-image:url("../assets/img/zone06-fold-01-web-pure_941w.webp")}
.showroom.z06-showcase.z06-media-ready .product.z06-card--grid.is-open{background-image:url("../assets/img/zone06-fold-02-social-pure_941w.webp")}
.showroom.z06-showcase.z06-media-ready .product.z06-card--logo.is-open{background-image:url("../assets/img/zone06-fold-03-brand-pure_941w.webp")}
.showroom.z06-showcase.z06-media-ready .product.z06-card--mail.is-open{background-image:url("../assets/img/zone06-fold-04-visual-pure_941w.webp")}
.showroom.z06-showcase.z06-media-ready .product.z06-card--motion.is-open{background-image:url("../assets/img/zone06-fold-05-motion-pure_941w.webp")}
.showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-fold-tab,.showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-card-body{
  background:transparent;
}
.showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-fold-tab{
  grid-template-rows:auto auto;
  grid-template-columns:max-content minmax(0,1fr) max-content;
  align-content:center;
  color:var(--z06-card);
  text-shadow:0 2px 9px rgba(25,19,16,.82);
}
.showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-fold-text small{
  grid-row:2;
  align-self:start;
  line-height:1.2;
  letter-spacing:.04em;
  grid-column:2;
  margin:0;
  font-weight:700;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  color:var(--z06-gold);
  opacity:1;
}
.showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-card-copy .z06-card-lead{
  grid-column:1;
  grid-row:1;
  margin:0;
  min-width:0;
  color:var(--z06-card);
  text-shadow:0 2px 9px rgba(25,19,16,.82);
}
.showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-card-actions{
  background:transparent;
  border-top-color:rgba(255,249,238,.58);
}

/* Empty visual placeholders stay still until the replacement display assets arrive. */

@media(prefers-reduced-motion:reduce){
  .showroom.z06-showcase.z06-fold-ready .product-shelves.z06-rail{display:grid;grid-template-columns:1fr;gap:20px;height:auto;padding:18px 0 42px}
  .showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open{transition:none}
  .showroom.z06-showcase.z06-fold-ready .product.z06-card,.showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open{
  display:block;
  width:100%;
  height:auto;
  flex:none;
  transform:none!important;overflow:visible}
  .showroom.z06-showcase.z06-fold-ready .z06-card-body,.showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-card-body{display:flex!important;height:auto;padding:24px;overflow:visible;border:1px solid var(--z06-line);border-radius:8px}
  .showroom.z06-showcase.z06-fold-ready .z06-card-top{display:flex}
  .showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-media{height:clamp(300px,42vw,430px)}
}

/* Zone 06 / real showcase assets: one copper display frame, no white inner frames. */
.showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-media{
  flex:0 0 auto;
  position:relative;
  background-image:none;
  border:1px solid var(--z06-copper);
  box-shadow:none;
}
.showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-browser,.showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-template-stage{
  border:0;
  background:transparent;
  box-shadow:none;
}
.showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-browser{
  inset:14px 12px 16px;
  padding-top:27px;
}
.showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-browser-bar{
  height:27px;
  background:rgba(255,249,238,.08);
  border:0;
}
.showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-page-window{
  inset:27px 0 0;
}
.showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-phone-window{
  width:26%;
  height:auto;
  aspect-ratio:9 / 19;
  min-height:0;
  border:4px solid var(--z06-deep);
  background:var(--z06-card);
  box-shadow:0 12px 25px rgba(0,0,0,.36);
}
.showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-template-card{
  border:0;
}

.showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-logo-media{
  background:transparent;
}

/* Keep the lead row and LP button at the bottom at every fold width. */
.showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-card-copy{
  display:grid;
  grid-template-columns:minmax(0,1fr) max-content;
  align-items:end;
  row-gap:0;
  flex:0 0 auto;
  min-width:0;
}
.showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-card-actions{
  flex:0 0 auto;
  margin-top:auto;
}
.showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-card-body{
  display:flex;
  flex-direction:column;
  min-height:0;
  padding-bottom:0;
}

/* Keep the expanded code, title, and subtitle inside the active card on small screens. */
.showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-fold-code,.showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-fold-text,.showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-fold-text strong,.showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-fold-text small{
  min-width:0;
  max-width:100%;
}
@media(max-width:760px){
  .showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-fold-tab{
  grid-template-rows:auto auto;
    grid-template-columns:minmax(34px,max-content) minmax(0,1fr) max-content;
    column-gap:4px;
    padding-inline:9px;
  }
  .showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-fold-code{
  grid-column:1;
  grid-row:1 / 3;
  text-overflow:ellipsis;
    /* T07：代碼放大到 12px 後，最長的字「MOTION」約 49.5px（字距 .02em）；只在空白處換行，不把英文字拆開。
       欄距 6→4px 把標題欄寬補回來，360px 寬時標題行數與原版相同、320px 不再裁掉「LOGO」 */
    max-width:50px;
    letter-spacing:.02em;
    white-space:normal;
    overflow-wrap:normal;
  }
  .showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-fold-text strong{
  grid-row:1;
  align-self:end;
  font-size:20px;
  line-height:1.05;
  padding-right:20px;
    grid-column:2;
    white-space:normal;
    overflow:hidden;
    overflow-wrap:anywhere;
    text-overflow:clip;
    max-height:2.2em;
  }
  .showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-fold-text small{
  grid-row:2;
  align-self:start;
  font-size:clamp(12px,3vw,13px);
  line-height:1.15;
  letter-spacing:.02em;
    grid-column:2 / 4;
    white-space:normal;
    overflow:hidden;
    overflow-wrap:anywhere;
    text-overflow:clip;
    max-height:2.4em;
  }
  .showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-phone-window{
    width:34%;
    height:auto;
    aspect-ratio:9 / 19;
  }
}

/* Zone 06 / 懂你一頁 uses the real responsive HTML preview in both frames. */
.showroom.z06-showcase.z06-fold-ready .product.z06-card--page.is-open::before{
  content:"";
  position:absolute;
  z-index:0;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(180deg,rgba(18,14,11,.26),rgba(18,14,11,.52)),
    rgba(25,19,16,.38);
  -webkit-backdrop-filter:blur(2px) saturate(.86);
  backdrop-filter:blur(2px) saturate(.86);
}
.showroom.z06-showcase.z06-fold-ready .product.z06-card--page.is-open > .z06-fold-tab,.showroom.z06-showcase.z06-fold-ready .product.z06-card--page.is-open > .z06-card-body{
  position:relative;
  z-index:1;
}
.showroom.z06-showcase.z06-fold-ready .product.z06-card--page.is-open .z06-page-window{
  background:var(--z06-card);
  border:0;
}
.showroom.z06-showcase.z06-fold-ready .product.z06-card--page.is-open .z06-page-frame{
  display:block;
  width:100%;
  height:100%;
  max-width:none;
  border:0;
  background:var(--z06-card);
  overflow:auto;
  pointer-events:auto;
  touch-action:auto;
}
.showroom.z06-showcase.z06-fold-ready .product.z06-card--page.is-open .z06-page-frame--interactive{
  cursor:auto;
}
.showroom.z06-showcase.z06-fold-ready .product.z06-card--page.is-open .z06-page-frame--phone{
  width:320px;
  height:676px;
  max-width:none;
  --z06-phone-preview-scale:.5;
  transform:scale(var(--z06-phone-preview-scale));
  transform-origin:top left;
  pointer-events:none;
  touch-action:none;
}
.showroom.z06-showcase.z06-fold-ready .product.z06-card--page.is-open .z06-phone-window{
  pointer-events:none;
}
@media(max-width:1100px){
  .showroom.z06-showcase.z06-fold-ready .product.z06-card--page.is-open .z06-page-frame--phone{
    --z06-phone-preview-scale:.314;
  }
}
@media(max-width:760px){
  .showroom.z06-showcase.z06-fold-ready .product.z06-card--page.is-open .z06-page-frame--phone{
    --z06-phone-preview-scale:.15;
  }
  /* 手機版只放手機展示：不顯示網頁框與網址列，手機框置中放大到整個展示框高度 */
  .showroom.z06-showcase.z06-fold-ready .product.z06-card--page.is-open .z06-browser{
    padding-top:0;
  }
  .showroom.z06-showcase.z06-fold-ready .product.z06-card--page.is-open .z06-browser-bar,.showroom.z06-showcase.z06-fold-ready .product.z06-card--page.is-open .z06-page-window{
    display:none;
  }
  .showroom.z06-showcase.z06-fold-ready .product.z06-card--page.is-open .z06-phone-window{
    top:0;
    right:auto;
    bottom:0;
    left:50%;
    width:auto;
    height:100%;
    aspect-ratio:9 / 19;
    transform:translateX(-50%);
  }
}
@media(prefers-reduced-motion:reduce){
  .showroom.z06-showcase.z06-fold-ready .product.z06-card--page.is-open::before{
    -webkit-backdrop-filter:none;
    backdrop-filter:none;
  }
}

/* Zone 06 / 02–05 matte treatment and real showcase decks. */
.showroom.z06-showcase.z06-fold-ready .product.z06-card--grid.is-open::before,.showroom.z06-showcase.z06-fold-ready .product.z06-card--logo.is-open::before,.showroom.z06-showcase.z06-fold-ready .product.z06-card--mail.is-open::before,.showroom.z06-showcase.z06-fold-ready .product.z06-card--motion.is-open::before{
  content:"";
  position:absolute;
  z-index:0;
  inset:0;
  pointer-events:none;
  border-radius:inherit;
  background:
    linear-gradient(180deg,rgba(18,14,11,.18),rgba(18,14,11,.46)),
    rgba(25,19,16,.28);
  -webkit-backdrop-filter:blur(2px) saturate(.88);
  backdrop-filter:blur(2px) saturate(.88);
}
.showroom.z06-showcase.z06-fold-ready .product.z06-card--grid.is-open > .z06-fold-tab,.showroom.z06-showcase.z06-fold-ready .product.z06-card--grid.is-open > .z06-card-body,.showroom.z06-showcase.z06-fold-ready .product.z06-card--logo.is-open > .z06-fold-tab,.showroom.z06-showcase.z06-fold-ready .product.z06-card--logo.is-open > .z06-card-body,.showroom.z06-showcase.z06-fold-ready .product.z06-card--mail.is-open > .z06-fold-tab,.showroom.z06-showcase.z06-fold-ready .product.z06-card--mail.is-open > .z06-card-body,.showroom.z06-showcase.z06-fold-ready .product.z06-card--motion.is-open > .z06-fold-tab,.showroom.z06-showcase.z06-fold-ready .product.z06-card--motion.is-open > .z06-card-body{
  position:relative;
  z-index:1;
}

/* 02 / social: four supplied 4:5 posts form a quiet, layered template stack. */
.showroom.z06-showcase.z06-fold-ready .product.z06-card--grid.is-open .z06-template-stage{
  overflow:hidden;
  pointer-events:none;
}

/* 03 / logo: each case keeps the application board visible, with its logo mark layered above. */
.showroom.z06-showcase.z06-fold-ready .product.z06-card--logo.is-open .z06-logo-media:before{display:none}
.showroom.z06-showcase.z06-fold-ready .z06-logo-deck{
  position:absolute;
  z-index:1;
  isolation:isolate;
}
.showroom.z06-showcase.z06-fold-ready .z06-logo-card{
  position:absolute;
  margin:0;
  overflow:hidden;
  border:1px solid rgba(255,249,238,.7);
  border-radius:3px;
  background:rgba(255,249,238,.12);
  box-shadow:0 18px 32px rgba(0,0,0,.28);
  transform-origin:center center;
}
.showroom.z06-showcase.z06-fold-ready .z06-logo-board-image{
  display:block;
  width:100%;
  height:100%;
  max-width:none;
  object-fit:cover;
  background:var(--z06-paper);
}
.showroom.z06-showcase.z06-fold-ready .z06-logo-mark-image{
  position:absolute;
  z-index:2;
  right:5%;
  bottom:6%;
  width:31%;
  height:auto; /* img 標有 width／height 屬性（T04），高度仍依 aspect-ratio 計算 */
  aspect-ratio:1;
  max-width:none;
  object-fit:contain;
  padding:4px;
  border:0;
  border-radius:2px;
  background:rgba(255,249,238,.92);
  transform:rotate(6deg);
  box-shadow:0 12px 24px rgba(0,0,0,.3);
}
.showroom.z06-showcase.z06-fold-ready .z06-logo-card:hover,.showroom.z06-showcase.z06-fold-ready .z06-logo-card:focus-visible{z-index:8;filter:none;box-shadow:0 24px 42px rgba(0,0,0,.4)}
.showroom.z06-showcase.z06-fold-ready .z06-logo-card:focus-visible,.showroom.z06-showcase.z06-fold-ready .z06-visual-card:focus-visible,.showroom.z06-showcase.z06-fold-ready .z06-motion-blind:focus-visible{outline:2px solid var(--z06-gold);outline-offset:-5px}

/* 04 / visual: one main application stays in front while the rest recede as a deck. */
.showroom.z06-showcase.z06-fold-ready .z06-visual-deck{
  position:absolute;
  z-index:1;
  inset:14px 12px 18px;
  isolation:isolate;
}
.showroom.z06-showcase.z06-fold-ready .z06-visual-card{
  position:absolute;
  inset:3% 14%;
  margin:0;
  overflow:hidden;
  border:1px solid rgba(255,249,238,.72);
  border-radius:3px;
  background:rgba(255,249,238,.1);
  box-shadow:0 18px 34px rgba(0,0,0,.3);
  transform-origin:center center;
}
.showroom.z06-showcase.z06-fold-ready .z06-visual-card img{
  display:block;
  width:100%;
  height:100%;
  max-width:none;
  object-fit:cover;
  background:var(--z06-paper);
}
.showroom.z06-showcase.z06-fold-ready .z06-visual-card:hover,.showroom.z06-showcase.z06-fold-ready .z06-visual-card:focus-visible{z-index:8;filter:none;box-shadow:0 26px 46px rgba(0,0,0,.42)}

/* 05 / motion: eleven muted videos are presented as interactive fold slats. */
.showroom.z06-showcase.z06-fold-ready .z06-motion-blinds{
  position:absolute;
  z-index:1;
  inset:14px 12px 18px;
  display:flex;
  align-items:stretch;
  gap:clamp(3px,.55vw,8px);
  overflow:hidden;
  isolation:isolate;
  perspective:1000px;
}
.showroom.z06-showcase.z06-fold-ready .z06-motion-blind video{
  display:block;
  width:100%;
  height:100%;
  max-width:none;
  object-fit:cover;
  background:transparent;
  border:0;
  filter:saturate(.9) contrast(1.05);
}
.showroom.z06-showcase.z06-fold-ready .z06-motion-blind:hover,.showroom.z06-showcase.z06-fold-ready .z06-motion-blind:focus-visible{
  z-index:4;
  flex-grow:1.55;
  transform:translateY(-4px);
  border-color:var(--z06-gold);
  filter:brightness(1.08);
}

@media(max-width:1100px){
  .showroom.z06-showcase.z06-fold-ready .z06-logo-deck,.showroom.z06-showcase.z06-fold-ready .z06-visual-deck{inset:12px 10px 16px}
  .showroom.z06-showcase.z06-fold-ready .z06-motion-blinds{inset:12px 10px 16px;gap:clamp(3px,.7vw,7px)}
}
@media(max-width:760px){
  .showroom.z06-showcase.z06-fold-ready .z06-logo-deck,.showroom.z06-showcase.z06-fold-ready .z06-visual-deck{inset:10px 8px 14px}
  .showroom.z06-showcase.z06-fold-ready .z06-logo-mark-image{width:29%;right:4%;bottom:5%;padding:3px}
  .showroom.z06-showcase.z06-fold-ready .z06-motion-blind:hover,.showroom.z06-showcase.z06-fold-ready .z06-motion-blind:focus-visible{flex-grow:1.3;transform:translateY(-2px)}
}
@media(max-width:760px){
  .showroom.z06-showcase.z06-fold-ready .z06-motion-blinds{inset:8px 6px 12px;gap:2px}
}
@media(prefers-reduced-motion:reduce){
  .showroom.z06-showcase.z06-fold-ready .product.z06-card--grid.is-open::before,.showroom.z06-showcase.z06-fold-ready .product.z06-card--logo.is-open::before,.showroom.z06-showcase.z06-fold-ready .product.z06-card--mail.is-open::before,.showroom.z06-showcase.z06-fold-ready .product.z06-card--motion.is-open::before{
    -webkit-backdrop-filter:none;
    backdrop-filter:none;
  }
}

/* Zone 06 / actual deck and fold states: one readable item leads, the rest recede. */
.showroom.z06-showcase.z06-fold-ready .z06-template-stage[data-z06-deck],.showroom.z06-showcase.z06-fold-ready .z06-logo-deck[data-z06-deck],.showroom.z06-showcase.z06-fold-ready .z06-visual-deck[data-z06-deck]{
  overflow:hidden;
  perspective:1100px;
}
.showroom.z06-showcase.z06-fold-ready .z06-template-card{
  left:16%;
  top:6%;
  width:68%;
  height:84%;
  opacity:.68;
  filter:saturate(.72) brightness(.7);
  animation:none;
  transition:left .78s cubic-bezier(.16,1.08,.3,1),top .78s cubic-bezier(.16,1.08,.3,1),transform .78s cubic-bezier(.16,1.08,.3,1),opacity .5s ease,filter .5s ease;
}
.showroom.z06-showcase.z06-fold-ready .z06-template-card:nth-child(1):not(.is-active){z-index:1;transform:translate3d(-26%,-2%,-90px) rotate(-8deg) scale(.76)}
.showroom.z06-showcase.z06-fold-ready .z06-template-card:nth-child(2):not(.is-active){z-index:2;transform:translate3d(25%,-4%,-110px) rotate(8deg) scale(.76)}
.showroom.z06-showcase.z06-fold-ready .z06-template-card:nth-child(3):not(.is-active){z-index:3;transform:translate3d(12%,4%,-56px) rotate(4deg) scale(.8)}
.showroom.z06-showcase.z06-fold-ready .z06-template-card:nth-child(4):not(.is-active){z-index:2;transform:translate3d(-14%,5%,-74px) rotate(-5deg) scale(.78)}
.showroom.z06-showcase.z06-fold-ready .z06-template-card.is-active{
  z-index:8;
  opacity:1;
  filter:none;
  transform:translate3d(0,0,48px) rotate(0deg) scale(1);
}

.showroom.z06-showcase.z06-fold-ready .z06-logo-card,.showroom.z06-showcase.z06-fold-ready .z06-visual-card{
  opacity:.66;
  filter:saturate(.72) brightness(.68);
  transition:transform .82s cubic-bezier(.16,1.08,.3,1),opacity .5s ease,filter .5s ease,box-shadow .5s ease;
}
.showroom.z06-showcase.z06-fold-ready .z06-logo-card:nth-child(1):not(.is-active),.showroom.z06-showcase.z06-fold-ready .z06-visual-card:nth-child(1):not(.is-active){z-index:1}
.showroom.z06-showcase.z06-fold-ready .z06-visual-card:nth-child(1):not(.is-active){transform:translate3d(-26%,-2%,-100px) rotate(-8deg) scale(.76)}
.showroom.z06-showcase.z06-fold-ready .z06-logo-card:nth-child(2):not(.is-active),.showroom.z06-showcase.z06-fold-ready .z06-visual-card:nth-child(2):not(.is-active){z-index:2}
.showroom.z06-showcase.z06-fold-ready .z06-visual-card:nth-child(2):not(.is-active){transform:translate3d(25%,-5%,-118px) rotate(8deg) scale(.76)}
.showroom.z06-showcase.z06-fold-ready .z06-logo-card:nth-child(3):not(.is-active),.showroom.z06-showcase.z06-fold-ready .z06-visual-card:nth-child(3):not(.is-active){z-index:3}
.showroom.z06-showcase.z06-fold-ready .z06-visual-card:nth-child(3):not(.is-active){transform:translate3d(13%,3%,-62px) rotate(5deg) scale(.8)}
.showroom.z06-showcase.z06-fold-ready .z06-logo-card:nth-child(4):not(.is-active),.showroom.z06-showcase.z06-fold-ready .z06-visual-card:nth-child(4):not(.is-active){z-index:2}
.showroom.z06-showcase.z06-fold-ready .z06-visual-card:nth-child(4):not(.is-active){transform:translate3d(-15%,4%,-82px) rotate(-5deg) scale(.78)}
.showroom.z06-showcase.z06-fold-ready .z06-visual-card.is-active{
  transform:translate3d(0,0,48px) rotate(0deg) scale(1.02);
}
.showroom.z06-showcase.z06-fold-ready .z06-logo-card.is-active,.showroom.z06-showcase.z06-fold-ready .z06-visual-card.is-active{
  z-index:8;
  opacity:1;
  filter:none;
  box-shadow:0 24px 42px rgba(0,0,0,.4);
}
.showroom.z06-showcase.z06-fold-ready .z06-logo-card:hover:not(.is-active),.showroom.z06-showcase.z06-fold-ready .z06-logo-card:focus-visible:not(.is-active),.showroom.z06-showcase.z06-fold-ready .z06-visual-card:hover:not(.is-active),.showroom.z06-showcase.z06-fold-ready .z06-visual-card:focus-visible:not(.is-active){filter:saturate(.9) brightness(.86)}

/* Fold mode: all items remain in the strip, but only the active item gets real width. */
.showroom.z06-showcase.z06-fold-ready .z06-motion-blinds[data-z06-deck]{
  --z06-motion-rest:.5;
  --z06-motion-active:7.2;
}
.showroom.z06-showcase.z06-fold-ready .z06-motion-blind{
  position:relative;
  min-width:0;
  min-height:0;
  margin:0;
  overflow:hidden;
  border:1px solid rgba(255,249,238,.58);
  border-radius:2px;
  background:rgba(25,19,16,.34);
  box-shadow:0 14px 28px rgba(0,0,0,.26);
  transform:translateZ(0);
  flex:var(--z06-motion-rest) 1 0;
  opacity:.64;
  filter:saturate(.66) brightness(.68);
  transition:flex-grow .86s cubic-bezier(.16,1.08,.3,1),transform .86s cubic-bezier(.16,1.08,.3,1),opacity .5s ease,filter .5s ease,border-color .36s ease;
}
.showroom.z06-showcase.z06-fold-ready .z06-motion-blind:not(.is-active):hover,.showroom.z06-showcase.z06-fold-ready .z06-motion-blind:not(.is-active):focus-visible{flex-grow:var(--z06-motion-rest);transform:none}
.showroom.z06-showcase.z06-fold-ready .z06-motion-blind.is-active{
  z-index:8;
  flex-grow:var(--z06-motion-active);
  opacity:1;
  filter:none;
  transform:translateY(-3px);
  border-color:var(--z06-gold);
  box-shadow:0 20px 34px rgba(0,0,0,.42);
}
.showroom.z06-showcase.z06-fold-ready .z06-motion-blind.is-active video{filter:saturate(1) contrast(1.03)}
.showroom.z06-showcase.z06-fold-ready .z06-motion-blind.is-active::after{
  content:attr(aria-label);
  position:absolute;
  z-index:3;
  left:8px;
  right:8px;
  bottom:8px;
  padding:6px 7px;
  background:rgba(25,19,16,.78);
  color:var(--z06-card);
  font:700 9px/1.25 SpaceG,monospace;
  letter-spacing:.04em;
  pointer-events:none;
}

@media(max-width:760px){
  .showroom.z06-showcase.z06-fold-ready .z06-template-card{left:13%;width:74%;height:84%}
  .showroom.z06-showcase.z06-fold-ready .z06-template-card.is-active{transform:translate3d(0,0,32px) rotate(0deg) scale(1)}
  .showroom.z06-showcase.z06-fold-ready .z06-visual-card{inset:3% 12%}
  .showroom.z06-showcase.z06-fold-ready .z06-visual-card.is-active{transform:translate3d(0,0,28px) rotate(0deg) scale(1.01)}
  .showroom.z06-showcase.z06-fold-ready .z06-motion-blinds[data-z06-deck]{--z06-motion-rest:.35;--z06-motion-active:7.2}
  .showroom.z06-showcase.z06-fold-ready .z06-motion-blind.is-active{transform:translateY(-2px)}
  .showroom.z06-showcase.z06-fold-ready .z06-motion-blind.is-active::after{left:5px;right:5px;bottom:5px;padding:5px 5px;font-size:7px}
}
@media(prefers-reduced-motion:reduce){
  .showroom.z06-showcase.z06-fold-ready .z06-template-card,.showroom.z06-showcase.z06-fold-ready .z06-logo-card,.showroom.z06-showcase.z06-fold-ready .z06-visual-card,.showroom.z06-showcase.z06-fold-ready .z06-motion-blind{transition:none!important}
}

/* Mobile fold tabs: replace the cropped horizontal index artwork with a readable vertical code. */
@media(max-width:760px){
  .showroom.z06-showcase.z06-fold-ready .product.z06-card:not(.is-open) .z06-fold-index-art{display:none}
  .showroom.z06-showcase.z06-fold-ready .product.z06-card:not(.is-open) .z06-fold-tab::before{
    position:absolute;
    z-index:4;
    top:14px;
    left:50%;
    display:block;
    width:1em;
    color:var(--z06-card);
    font:700 9px/1.05 SpaceG,monospace;
    letter-spacing:.04em;
    text-align:center;
    text-shadow:0 2px 7px rgba(25,19,16,.8);
    writing-mode:vertical-rl;
    text-orientation:mixed;
    transform:translateX(-50%);
    pointer-events:none;
  }
  .showroom.z06-showcase.z06-fold-ready .product.z06-card--page:not(.is-open) .z06-fold-tab::before{content:"01"}
  .showroom.z06-showcase.z06-fold-ready .product.z06-card--grid:not(.is-open) .z06-fold-tab::before{content:"02"}
  .showroom.z06-showcase.z06-fold-ready .product.z06-card--logo:not(.is-open) .z06-fold-tab::before{content:"03"}
  .showroom.z06-showcase.z06-fold-ready .product.z06-card--mail:not(.is-open) .z06-fold-tab::before{content:"04"}
  .showroom.z06-showcase.z06-fold-ready .product.z06-card--motion:not(.is-open) .z06-fold-tab::before{content:"05"}
}

/* 06 展示件的尺寸與輪播節奏 */
.showroom.z06-showcase.z06-fold-ready .product.z06-card--grid.is-open .z06-template-stage[data-z06-deck]{inset:10px 8px 14px}
.showroom.z06-showcase.z06-fold-ready .product.z06-card--grid.is-open .z06-template-card{
  border-radius:2px;
  object-fit:cover;
  box-shadow:0 17px 29px rgba(0,0,0,.34);
  left:10%;
  top:3%;
  width:80%;
  height:90%;
}
.showroom.z06-showcase.z06-fold-ready .product.z06-card--grid.is-open .z06-template-card.is-active{transform:translate3d(0,0,48px) rotate(0deg) scale(1)}

.showroom.z06-showcase.z06-fold-ready .product.z06-card--mail.is-open .z06-visual-deck[data-z06-deck]{inset:8px 7px 12px}
.showroom.z06-showcase.z06-fold-ready .product.z06-card--mail.is-open .z06-visual-card{inset:1% 7%}
.showroom.z06-showcase.z06-fold-ready .product.z06-card--mail.is-open .z06-visual-card.is-active{transform:translate3d(0,0,48px) rotate(0deg) scale(1.02)}

/* 懂你一格、懂你視覺展開卡：三種尺寸都讓素材完整顯示、不裁切，跟懂你LOGO一樣適應展示框（懂你一頁、懂你會動維持直式展示） */
.showroom.z06-showcase.z06-fold-ready .product.z06-card--mail.is-open .z06-visual-card{inset:1% 4%;display:flex;align-items:center;justify-content:center;border:0;background:transparent;box-shadow:none;overflow:visible}
.showroom.z06-showcase.z06-fold-ready .product.z06-card--mail.is-open .z06-visual-card:hover,.showroom.z06-showcase.z06-fold-ready .product.z06-card--mail.is-open .z06-visual-card:focus-visible{box-shadow:none}
.showroom.z06-showcase.z06-fold-ready .product.z06-card--mail.is-open .z06-visual-card img{width:auto;height:auto;max-width:100%;max-height:100%;object-fit:contain;border:1px solid rgba(255,249,238,.72);border-radius:3px;box-shadow:0 18px 34px rgba(0,0,0,.3)}
@media(min-width:1101px){
  .showroom.z06-showcase.z06-fold-ready .product.z06-card--grid.is-open .z06-template-card{left:0;right:0;width:auto;height:92%;margin-inline:auto;aspect-ratio:1122 / 1402;object-fit:contain}
  .showroom.z06-showcase.z06-fold-ready .product.z06-card--motion.is-open .z06-motion-blind.is-active video{object-fit:contain;background:var(--z06-deep)}
}
@media(max-width:1100px){
  .showroom.z06-showcase.z06-fold-ready .product.z06-card--grid.is-open .z06-template-card{top:0;bottom:0;left:0;right:0;margin:auto;width:auto;height:auto;max-width:100%;max-height:94%;object-fit:contain}
}

/* Logo application boards are supplied as square assets, so the visible cards stay 1:1. */
.showroom.z06-showcase.z06-fold-ready .z06-logo-deck[data-z06-deck]{inset:8px 7px 12px}
.showroom.z06-showcase.z06-fold-ready .z06-logo-card{
  inset:auto;
  top:50%;
  left:50%;
  width:auto;
  height:min(96%,440px);
  aspect-ratio:1 / 1;
  box-sizing:border-box;
}
.showroom.z06-showcase.z06-fold-ready .z06-logo-card:nth-child(1):not(.is-active){transform:translate3d(calc(-50% - 26%),calc(-50% - 2%),-100px) rotate(-8deg) scale(.76)}
.showroom.z06-showcase.z06-fold-ready .z06-logo-card:nth-child(2):not(.is-active){transform:translate3d(calc(-50% + 25%),calc(-50% - 5%),-118px) rotate(8deg) scale(.76)}
.showroom.z06-showcase.z06-fold-ready .z06-logo-card:nth-child(3):not(.is-active){transform:translate3d(calc(-50% + 13%),calc(-50% + 3%),-62px) rotate(5deg) scale(.8)}
.showroom.z06-showcase.z06-fold-ready .z06-logo-card:nth-child(4):not(.is-active){transform:translate3d(calc(-50% - 15%),calc(-50% + 4%),-82px) rotate(-5deg) scale(.78)}
.showroom.z06-showcase.z06-fold-ready .z06-logo-card.is-active{transform:translate3d(-50%,-50%,48px) rotate(0deg) scale(1)}

@media(max-width:760px){
  .showroom.z06-showcase.z06-fold-ready .product.z06-card--grid.is-open .z06-template-stage[data-z06-deck]{inset:8px 6px 12px}
  .showroom.z06-showcase.z06-fold-ready .product.z06-card--grid.is-open .z06-template-card{left:8%;top:2%;width:84%;height:92%}
  .showroom.z06-showcase.z06-fold-ready .product.z06-card--grid.is-open .z06-template-card.is-active{transform:translate3d(0,0,32px) rotate(0deg) scale(1)}
  .showroom.z06-showcase.z06-fold-ready .product.z06-card--mail.is-open .z06-visual-deck[data-z06-deck]{inset:8px 6px 12px}
  .showroom.z06-showcase.z06-fold-ready .product.z06-card--mail.is-open .z06-visual-card{inset:1% 6%}
  .showroom.z06-showcase.z06-fold-ready .product.z06-card--mail.is-open .z06-visual-card.is-active{transform:translate3d(0,0,28px) rotate(0deg) scale(1.01)}
  .showroom.z06-showcase.z06-fold-ready .z06-logo-deck[data-z06-deck]{inset:8px 6px 12px}
  .showroom.z06-showcase.z06-fold-ready .z06-logo-card{width:84%;height:auto}
  .showroom.z06-showcase.z06-fold-ready .z06-logo-card.is-active{transform:translate3d(-50%,-50%,28px) rotate(0deg) scale(1)}
}

/* 其他 Logo 案例在輪到之前留在後排 */
.showroom.z06-showcase.z06-fold-ready .z06-logo-card:nth-child(n + 5):not(.is-active){
  z-index:0;
  opacity:0;
  filter:saturate(.55) brightness(.52);
  transform:translate3d(-50%,-50%,-160px) scale(.72);
  pointer-events:none;
}

/* 06 RWD：展開卡片的媒體區保留足夠高度，並留出標題列的空間
   Keep the expanded media generous, but reserve enough height for the lead row
   and LP action so the copper frame remains self-contained at every breakpoint. */
@media(min-width:1101px){
  .showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-media{
    height:clamp(340px,26vw,400px);
  }
  .showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-page-window{
    --z06-page-window:calc(clamp(340px,26vw,400px) - 67px);
  }
  /* 懂你一頁的手機預覽：寬度同時受素材框高度限制，寬螢幕時不超出框（9:19 手機比例） */
  .showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-phone-window{
    width:min(26%,calc((clamp(340px,26vw,400px) - 40px) * 9 / 19));
  }
}

/* Very narrow phones need a shorter showcase stage; this keeps the CTA visible
   without turning the fold wall into a vertically scrolling card. */

/* 06 文案與方案按鈕 */
.showroom.z06-showcase .z06-intro-copy{
  font-family:"Microsoft JhengHei",GenYo,"Noto Sans TC",sans-serif;
  font-weight:500;
}
.showroom.z06-showcase .z06-intro-copy strong{
  font-family:"Microsoft JhengHei",GenYo,"Noto Sans TC",sans-serif;
}
.showroom.z06-showcase .z06-intro-copy span{font-weight:500}

/* Set-style CTA: a compact, responsive UI component, not a raster button, so
   its text remains crisp and its hit area stays usable on every viewport. */
.showroom.z06-showcase .z06-package-link{
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
  width:min(100%,1180px);
  min-height:86px;
  gap:clamp(12px,1.7vw,24px);
  margin-top:clamp(34px,5vh,56px);
  padding:clamp(14px,1.6vw,22px) clamp(16px,2.5vw,30px);
  border:1px solid rgba(255,249,238,.38);
  border-left:3px solid var(--z06-copper);
  border-radius:4px;
  background:
    linear-gradient(105deg,rgba(255,249,238,.08),transparent 34%,rgba(200,221,126,.1)),
    linear-gradient(90deg,transparent 0 72%,rgba(255,249,238,.06) 72% 72.12%,transparent 72.12% 100%),
    var(--z06-brown);
  color:var(--z06-card);
  box-shadow:6px 6px 0 rgba(194,87,30,.78),0 12px 24px rgba(25,19,16,.16),inset 0 1px rgba(255,249,238,.18);
  box-sizing:border-box;
  isolation:isolate;
  overflow:hidden;
  transition:transform .28s ease,background-color .28s ease,box-shadow .28s ease;
}
.showroom.z06-showcase .z06-package-link::before{
  content:"";
  position:absolute;
  z-index:0;
  inset:0;
  background:linear-gradient(110deg,transparent 28%,rgba(255,249,238,.2) 47%,transparent 62%);
  transform:translateX(-120%);
  transition:transform .72s cubic-bezier(.16,1.08,.3,1);
  pointer-events:none;
}
.showroom.z06-showcase .z06-package-link::after{
  content:"";
  position:absolute;
  z-index:0;
  inset:6px;
  border:1px solid rgba(255,249,238,.14);
  border-radius:2px;
  pointer-events:none;
}
.showroom.z06-showcase .z06-package-link > *{position:relative;z-index:1}
.showroom.z06-showcase .z06-package-copy,.showroom.z06-showcase .z06-package-action{width:auto}
.showroom.z06-showcase .z06-package-link:hover,.showroom.z06-showcase .z06-package-link:focus-visible{
  background-color:var(--z06-copper);
  transform:translateY(-2px);
  box-shadow:8px 9px 0 rgba(74,55,40,.72),0 16px 28px rgba(25,19,16,.2),inset 0 1px rgba(255,249,238,.2);
}
.showroom.z06-showcase .z06-package-link:hover::before,.showroom.z06-showcase .z06-package-link:focus-visible::before{transform:translateX(120%)}
.showroom.z06-showcase .z06-package-link:focus-visible{outline:2px solid var(--z06-gold);outline-offset:4px}
.showroom.z06-showcase .z06-package-mark{
  position:relative;
  display:block;
  width:46px;
  aspect-ratio:1;
  border:1px solid rgba(255,249,238,.56);
  transform:rotate(-5deg);
}
.showroom.z06-showcase .z06-package-mark i{
  position:absolute;
  display:block;
  width:48%;
  aspect-ratio:1;
  border:1px solid var(--z06-gold);
  background:rgba(200,221,126,.16);
}
.showroom.z06-showcase .z06-package-mark i:nth-child(1){left:9%;top:9%}
.showroom.z06-showcase .z06-package-mark i:nth-child(2){right:9%;top:27%;background:rgba(194,87,30,.55)}
.showroom.z06-showcase .z06-package-mark i:nth-child(3){left:25%;bottom:8%;background:rgba(255,249,238,.12)}
.showroom.z06-showcase .z06-package-copy{display:flex;flex-direction:column;gap:3px;min-width:0}
.showroom.z06-showcase .z06-package-copy em{
  color:var(--z06-gold);
  font:600 clamp(13px,.9vw,14px)/1.2 "Microsoft JhengHei UI","Microsoft JhengHei",GenYo,sans-serif;
  font-style:normal;
  letter-spacing:.06em;
}
.showroom.z06-showcase .z06-package-copy strong{
  color:var(--z06-card);
  font:700 clamp(20px,2vw,30px)/1.1 "Microsoft JhengHei UI","Microsoft JhengHei",GenYo,"Noto Sans TC",sans-serif;
  font-synthesis:none;
  letter-spacing:.04em;
  white-space:nowrap;
}
.showroom.z06-showcase .z06-package-action{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  min-height:44px;
  padding:8px 12px;
  border:1px solid rgba(255,249,238,.56);
  border-radius:2px;
  background:linear-gradient(135deg,rgba(255,249,238,.1),rgba(25,19,16,.34));
  font:700 clamp(13px,1.05vw,16px)/1.2 "Microsoft JhengHei UI","Microsoft JhengHei",GenYo,sans-serif;
  letter-spacing:.05em;
  white-space:nowrap;
  box-shadow:inset 0 1px rgba(255,249,238,.22),0 2px 0 rgba(25,19,16,.24);
}
.showroom.z06-showcase .z06-package-link .z06-package-action{color:var(--z06-card)}
.showroom.z06-showcase .z06-package-action b{
  margin:0;
  color:var(--z06-gold);
  font:400 20px/1 SpaceG,monospace;
}
@media(max-width:760px){
  .showroom.z06-showcase .z06-head{
    max-width:100%;
  }
  .showroom.z06-showcase .z06-head,.showroom.z06-showcase .z06-head h2,.showroom.z06-showcase .z06-intro-copy{
  width:100%;
    min-width:0;
  }
  .showroom.z06-showcase .z06-title-line{
    white-space:normal;
    overflow-wrap:anywhere;
  }
  .showroom.z06-showcase .z06-package-link{
    grid-template-columns:40px minmax(0,1fr) auto;
    min-height:80px;
    gap:9px;
    margin-top:clamp(28px,6vh,42px);
    padding:13px 14px;
    box-shadow:5px 5px 0 rgba(194,87,30,.78),0 10px 20px rgba(25,19,16,.15),inset 0 1px rgba(255,249,238,.18);
  }
  .showroom.z06-showcase .z06-package-mark{width:40px}
  .showroom.z06-showcase .z06-package-copy strong{font-size:clamp(18px,5.3vw,26px);letter-spacing:.025em}
  .showroom.z06-showcase .z06-package-action{min-width:max-content;min-height:40px;padding:7px 9px;gap:7px;font-size:13px}
  .showroom.z06-showcase .z06-package-action b{font-size:18px}
}
@media(max-width:380px){
  .showroom.z06-showcase .z06-package-link{grid-template-columns:36px minmax(0,1fr) auto;gap:7px;padding:12px}
  .showroom.z06-showcase .z06-package-mark{width:36px}
  .showroom.z06-showcase .z06-package-copy em{font-size:13px}
  .showroom.z06-showcase .z06-package-copy strong{font-size:18px}
  .showroom.z06-showcase .z06-package-action{padding-inline:7px;font-size:13px}
}
@media(prefers-reduced-motion:reduce){
  .showroom.z06-showcase .z06-package-link{transition:none}
  .showroom.z06-showcase .z06-package-link::before{display:none}
}

/* 05 → 06 捲動轉場：06 從下方進場、蓋住 05
   The hero stage stays pinned for one extra viewport so Zone 06 can enter
   from below, cover the complete Zone 05 scene, and leave the same way when
   the user scrolls upward.
   --z05-dwell-space keeps Zone 05 on screen before that cover starts. It is
   sized for ~300px mouse-wheel gestures at common desktop heights: one gesture
   from 04 lands in 05; once the cards have settled, the next gesture still
   stays in 05 and the one after reaches the Zone 06 trigger band. Phones
   (no wheel alignment) keep their original length. js/app.js subtracts both
   spaces from the chapter span, so 01–04 keep their scroll length.
   While js/zone05-06-transition.js aligns the page, <html> is locked so the
   rest of a running wheel gesture cannot scroll against it; the gutter keeps
   the page width unchanged while the scrollbar is hidden. */
:root{--z06-cover-space:100svh;--z05-dwell-space:calc(750px - 28.5svh)}
.hero-track{height:calc(235svh + var(--z05-dwell-space) + var(--z06-cover-space))}
html.z0506-scroll-locked{overflow:hidden;scrollbar-gutter:stable}
/* 首頁 01–05 一滑停一章（停靠點由 js/app.js 依捲動長度放置）；06 以後自由捲動 */
html.hero-snap{scroll-snap-type:y mandatory}
.hero-snap-point{position:absolute;left:0;width:1px;height:1px;pointer-events:none;scroll-snap-align:start;scroll-snap-stop:always}
.hero-snap-free{position:absolute;left:0;width:1px;pointer-events:none;scroll-snap-align:start}
.showroom.z06-showcase{
  padding:clamp(104px,14vh,176px) var(--pad) clamp(94px,12vh,150px);
  background:
    linear-gradient(180deg,rgba(25,19,16,.22) 0,rgba(25,19,16,.06) 100px,transparent 180px),
    linear-gradient(90deg,rgba(25,19,16,.08),transparent 26%),
    radial-gradient(circle at 88% 6%,rgba(200,221,126,.28),transparent 25%),
    radial-gradient(circle at 12% 80%,rgba(194,87,30,.10),transparent 23%),
    linear-gradient(145deg,var(--z06-paper) 0%,var(--z06-gold-wash) 56%,var(--z06-card) 100%);
  color:var(--z06-deep);
  isolation:isolate;
  overflow:hidden;
  --z06-paper:#F4EFE7;
  --z06-card:#FFF9EE;
  --z06-deep:#191310;
  --z06-brown:#4A3728;
  --z06-copper:#C2571E;
  --z06-gold:#C8DD7E;
  --z06-gold-soft:#D5E1AD;
  --z06-gold-wash:#F6E8CF;
  --z06-line:rgba(74,55,40,.22);
  --z06-line-soft:rgba(74,55,40,.14);
  z-index:12;
  margin-top:calc(var(--z06-cover-space) * -1);
  border-top:1px solid rgba(194,87,30,.28);
  box-shadow:0 -18px 42px rgba(25,19,16,.16);
  transition:box-shadow .42s cubic-bezier(.16,1,.3,1),border-color .42s ease;
}
.showroom.z06-showcase[data-z06-transition="entering"],.showroom.z06-showcase[data-z06-transition="leaving"]{
  border-top-color:rgba(194,87,30,.68);
  box-shadow:0 -24px 52px rgba(25,19,16,.24);
}
.showroom.z06-showcase[data-z06-transition="covered"]{
  border-top-color:rgba(194,87,30,.34);
  box-shadow:0 -10px 28px rgba(25,19,16,.12);
}
@media(max-width:760px){
  :root{--z05-dwell-space:0px}
  .hero-track{height:calc(400svh + var(--z05-dwell-space) + var(--z06-cover-space))}
  .showroom.z06-showcase{
  padding-top:92px;
  padding-bottom:92px;box-shadow:0 -12px 28px rgba(25,19,16,.16)}
  .showroom.z06-showcase[data-z06-transition="entering"],.showroom.z06-showcase[data-z06-transition="leaving"]{box-shadow:0 -16px 34px rgba(25,19,16,.22)}
}
@media(prefers-reduced-motion:reduce){
  :root{--z06-cover-space:0px;--z05-dwell-space:0px}
  .hero-track{height:100svh}
  .showroom.z06-showcase{margin-top:0;border-top-color:transparent;box-shadow:none;transition:none}
}

/* 06 標題字級與捲動觸發的聚焦模式 */
.showroom.z06-showcase .z06-head{
  grid-template-columns:minmax(0,720px) minmax(260px,360px);
  gap:clamp(28px,4vw,64px);
  margin-bottom:clamp(26px,4.2vh,48px);
}
.showroom.z06-showcase .z06-head h2{
  max-width:720px;
  font-family:NotoSerifTC,GenYo,"Microsoft JhengHei",serif;
  font-size:clamp(38px,4.2vw,66px);
  font-weight:650;
  line-height:1.12;
  letter-spacing:-.055em;
  text-wrap:balance;
  font-optical-sizing:auto;
  font-synthesis:none;
}
.showroom.z06-showcase .z06-intro-copy{
  text-rendering:optimizeLegibility;
  margin:0;
  max-width:360px;
  gap:8px;
  padding:12px 16px 13px;
  line-height:1.72;
  letter-spacing:.02em;
}
.showroom.z06-showcase .z06-intro-copy strong{
  font-size:clamp(16px,1.15vw,19px);
  font-weight:650;
  line-height:1.42;
  letter-spacing:.025em;
}
.showroom.z06-showcase .z06-intro-copy span{
  font-size:clamp(14px,1vw,16px);
  line-height:1.78;
}
@media(max-width:760px){
  .showroom.z06-showcase .z06-head{grid-template-columns:1fr;gap:22px;margin-bottom:26px}
  .showroom.z06-showcase .z06-intro-copy{max-width:min(100%,420px);padding:11px 14px 12px}
  .showroom.z06-showcase .z06-intro-copy strong{font-size:clamp(15px,4.5vw,18px)}
  .showroom.z06-showcase .z06-intro-copy span{
  overflow-wrap:anywhere;font-size:clamp(14px,3.7vw,16px)}
}
@media(max-width:760px){
  .showroom.z06-showcase .z06-head h2{
  max-width:100%;
  line-height:1.16;
  letter-spacing:-.045em;font-size:clamp(29px,8.7vw,38px)}
}

/* 06 展開中的服務維持主視覺，但不擋住其他四個分頁
   the other four tabs. Use a black veil, not desaturation, so each supplied
   background keeps its original colour character. */
.showroom.z06-showcase.z06-fold-ready .product.z06-card{
  position:relative;
  --z06-fold-closed-grow:1;
  border-radius:8px;
  will-change:flex-grow;
  transition:flex-grow .82s cubic-bezier(.16,1.08,.3,1),
    box-shadow .52s ease,
    border-color .32s ease;
}
.showroom.z06-showcase.z06-fold-ready .product.z06-card::after{
  content:"";
  position:absolute;
  z-index:20;
  inset:0;
  display:block;
  border-radius:inherit;
  background:rgba(0,0,0,.48);
  opacity:0;
  pointer-events:none;
  transition:opacity .34s ease;
}
.showroom.z06-showcase.z06-fold-ready.has-fold-open .product.z06-card:not(.is-open){
  box-shadow:0 10px 24px rgba(25,19,16,.08),0 2px 0 rgba(74,55,40,.04);
}
.showroom.z06-showcase.z06-fold-ready.has-fold-open .product.z06-card:not(.is-open)::after{opacity:1}
.showroom.z06-showcase.z06-fold-ready.has-fold-open .product.z06-card:not(.is-open) .z06-fold-tab:focus-visible{
  z-index:30;
}
.showroom.z06-showcase.z06-fold-ready.has-fold-open .product.z06-card.is-open{
  position:relative;
  z-index:4;
}
@media(prefers-reduced-motion:reduce){
  .showroom.z06-showcase.z06-fold-ready .product.z06-card,.showroom.z06-showcase.z06-fold-ready .product.z06-card::after{transition:none}
}

/* 06 展開卡的交付標籤：可讀性與手機版下方節奏
   The green label belongs below the lead on narrow cards, so it stays readable
   without compressing the CTA into the showcase frame. */
.showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-card-copy .z06-fold-status{
  grid-column:2;
  grid-row:1;
  align-self:end;
  justify-self:end;
  display:inline-flex;
  margin:0;
  background:var(--z06-gold);
  font:700 9px/1.25 SpaceG,monospace;
  writing-mode:horizontal-tb;
  box-shadow:0 5px 14px rgba(25,19,16,.2);
  box-sizing:border-box;
  min-height:26px;
  max-width:100%;
  padding:6px 9px;
  font-family:SpaceG,"Microsoft JhengHei","Noto Sans TC",sans-serif;
  font-size:clamp(12px,.85vw,13px);
  font-weight:700;
  line-height:1.3;
  letter-spacing:.035em;
  white-space:normal;
  overflow-wrap:anywhere;
  text-overflow:clip;
}

@media(max-width:1100px){
  .showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-card-copy{
    padding-top:20px;
    padding-bottom:18px;
  }
  .showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-card-copy .z06-fold-status{
    min-height:26px;
    padding:6px 8px;
    font-size:12px;
  }
}

@media(max-width:760px){
  /* Use a single column for the lead row on narrow expanded cards. */
  .showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-card-copy{
    display:grid;
    grid-template-columns:minmax(0,1fr);
    grid-template-rows:auto auto;
    align-items:start;
    row-gap:clamp(9px,2.5vw,13px);
    padding-top:clamp(24px,5vw,34px);
    padding-bottom:clamp(14px,3.5vw,22px);
  }
  .showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-card-copy .z06-card-lead{
    grid-column:1;
    grid-row:1;
    width:100%;
    max-width:100%;
  }
  .showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-card-copy .z06-fold-status{
    grid-column:1;
    grid-row:2;
    justify-self:start;
    align-self:start;
    width:max-content;
    max-width:100%;
    min-height:26px;
    padding:6px 8px;
    font-size:12px;
    line-height:1.3;
  }

  /* Add breathing room at the smallest widths; the footer remains pinned low. */
  .showroom.z06-showcase.z06-fold-ready .product-shelves.z06-rail{
    height:clamp(710px,182vw,810px);
  }
  .showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-card-body{
    padding-top:20px;
  }
  .showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-media{
    height:clamp(350px,90vw,400px);
  }
  .showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-page-window{
    --z06-page-window:calc(clamp(350px,90vw,400px) - 67px);
  }
  .showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-card-actions{
    padding-top:12px;
    padding-bottom:8px;
  }
}

@media(max-width:380px){
  .showroom.z06-showcase.z06-fold-ready .product-shelves.z06-rail{
    height:clamp(720px,190vw,780px);
  }
  .showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-media{
    height:clamp(268px,84vw,300px);
  }
  .showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-page-window{
    --z06-page-window:calc(clamp(268px,84vw,300px) - 67px);
  }
  .showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-card-actions{
    padding-top:12px;
    padding-bottom:6px;
  }
  /* T07：標籤 12px 後，320px 寬時「管道尺寸＋圖稿交付」最後一字會掉到第二行；收一點左右內距與字距讓它維持一行 */
  .showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-card-copy .z06-fold-status{
    padding-inline:6px;
    letter-spacing:0;
  }
}

@media(prefers-reduced-motion:reduce){
  .showroom.z06-showcase.z06-fold-ready .product.z06-card.is-open .z06-card-copy .z06-fold-status{
    transition:none;
  }
}