
:root{
 --primary:#26352F; --dark:#1D2824; --warm:#FAF8F3; --gold:#B89A63; --text:#2E2E2B;
 --muted:#746F67; --border:#E7E1D7; --sage:#EDF4EF; --red:#D95C4A;
 --shadow:0 12px 30px rgba(38,53,47,.09); --radius:18px;
}
*{box-sizing:border-box} html{scroll-behavior:smooth} body{margin:0;color:var(--text);font-family:"Noto Sans CJK TC","Noto Sans TC","PingFang TC","Microsoft JhengHei",sans-serif;background:white}
img{display:block;max-width:100%} a{text-decoration:none;color:inherit} button,input{font:inherit}
.shell{width:min(1300px,calc(100% - 56px));margin:auto}
.site-header{height:76px;background:#fff;border-bottom:1px solid rgba(231,225,215,.8);display:flex;align-items:center;position:relative;z-index:10}
.header-inner{display:flex;align-items:center;justify-content:space-between;gap:28px}.brand{display:grid;grid-template-columns:auto auto;align-items:end;column-gap:8px}.brand-num{font-size:32px;font-weight:900;color:var(--primary);letter-spacing:-1px}.brand-name{font-size:20px;font-weight:800;color:var(--primary)}.brand small{grid-column:1/-1;font-size:9px;letter-spacing:2px;color:#9a8d79}
.nav{display:flex;gap:28px;font-size:14px;font-weight:600;color:#4b514f}.actions{display:flex;align-items:center;gap:14px}.top-icon{width:21px;height:21px}.login{font-size:14px}.hamb{display:none;border:0;background:none}.hamb img{width:24px;height:24px}
.hero{height:430px;position:relative;overflow:hidden}.hero-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 42%}.hero-overlay{position:absolute;inset:0;background:linear-gradient(90deg,rgba(250,248,243,.96) 0%,rgba(250,248,243,.72) 28%,rgba(250,248,243,.10) 55%,rgba(255,255,255,0) 100%)}.hero-content{position:relative;height:100%;padding-top:48px}.hero-copy{width:56%;position:relative}.hero-kicker{font-size:11px;letter-spacing:4px;font-weight:700;color:var(--gold);margin-bottom:14px}.hero-title{font-family:"AR PL KaitiM Big5","LXGW WenKai TC","Noto Serif CJK TC",serif;font-size:54px;margin:0;color:var(--primary);font-weight:600;line-height:1.05;letter-spacing:.02em}.hero-subtitle{font-size:20px;margin:20px 0 0;color:#4c504b;font-weight:500}.hero-underline{width:410px;margin-top:-4px}.hero-plane{width:125px;position:absolute;left:390px;top:130px;transform:rotate(-9deg)}.hero-script-text{position:absolute;right:54px;top:42px;font-family:"URW Bookman","Segoe Script","Brush Script MT",cursive;font-style:italic;font-weight:600;font-size:30px;line-height:.98;color:var(--primary);transform:rotate(-4deg);text-align:center}
.hero-script-text img{width:210px;margin-top:2px}.hero-industries{position:absolute;left:0;bottom:22px;display:flex;gap:34px}.hero-industries>div{width:126px;height:58px;background:transparent;border:0;border-radius:0;display:grid;grid-template-columns:42px 1fr;grid-template-rows:1fr 1fr;padding:0;align-items:center;box-shadow:none}.icon-circle{grid-row:1/3;width:38px;height:38px;border-radius:50%;background:#F6F1E7;display:grid;place-items:center}.icon-circle img{width:24px;height:24px}.hero-industries b{font-size:13px}.hero-industries small{font-size:10px;color:#a29583;letter-spacing:1px}
.section{padding:34px 0}.white{background:#fff}.soft{background:#FBFAF7}.search-head{display:flex;align-items:center;justify-content:space-between;gap:32px}.section-heading{display:flex;align-items:center;gap:16px;min-width:max-content}.section-heading>img{width:46px;height:46px}.section-heading h2{font-size:26px;margin:0 0 6px;color:var(--primary)}.section-heading p{margin:0;color:var(--muted);font-size:14px}.compact h2{font-size:26px}.searchbar{flex:1;display:grid;grid-template-columns:150px 150px 1fr 145px;border:1px solid var(--border);border-radius:15px;overflow:hidden;min-height:52px;background:#fff;box-shadow:0 8px 25px rgba(38,53,47,.04)}.searchbar>button,.searchbar label{border:0;border-right:1px solid var(--border);background:white;display:flex;align-items:center;justify-content:space-between;padding:0 18px;color:#5b5e59}.searchbar button img{width:14px}.searchbar label img{width:18px;margin-right:10px}.searchbar input{border:0;outline:0;width:100%}.searchbar .search-submit{background:var(--primary);color:#fff;justify-content:center;border:0;font-weight:700}.searchbar.activity{grid-template-columns:repeat(4,1fr) 140px}
.industry-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:22px}.industry-card{height:150px;border-radius:20px;overflow:hidden;position:relative;box-shadow:var(--shadow)}.industry-card>img{width:100%;height:100%;object-fit:cover}.industry-card:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(15,22,20,.72),rgba(15,22,20,0) 65%)}.industry-card div{position:absolute;z-index:2;left:20px;right:20px;bottom:17px;color:#fff}.industry-card h3{font-size:22px;margin:0}.industry-card p{margin:4px 0 0;font-size:12px;opacity:.9}.industry-card span{position:absolute;right:0;bottom:2px;width:34px;height:34px;border:1px solid rgba(255,255,255,.7);border-radius:50%;display:grid;place-items:center}
.section-title-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px}.section-title-row>a{color:var(--gold);font-size:13px;font-weight:700}.store-grid,.activity-grid,.guide-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}.store-card,.activity-grid article,.guide-grid article{background:white;border:1px solid #eee9e0;border-radius:18px;overflow:hidden;box-shadow:0 10px 25px rgba(38,53,47,.05)}.photo{height:116px;position:relative}.photo>img:first-child{width:100%;height:100%;object-fit:cover}.photo .heart{position:absolute;right:14px;top:14px;background:white;border-radius:50%;padding:8px;width:34px;height:34px;box-shadow:0 3px 12px rgba(0,0,0,.13)}.card-body{padding:12px}.card-body h3{margin:0 0 7px;font-size:15px;color:#2b302d}.card-body p{font-size:12px;color:#77736d}.card-body b{font-size:13px;color:#A77931}.card-body span{font-size:11px;color:#9a958e}.tags{display:flex;gap:6px;margin-top:10px}.tags i{font-style:normal;font-size:10px;padding:5px 8px;background:#F1F4F0;border-radius:99px;color:#627068}
.activity-list-section{padding-top:38px}.activity-grid article>div{padding:12px}.activity-grid small{font-size:10px;color:#999}.activity-grid h3{font-size:16px;line-height:1.4;margin:7px 0}.activity-grid p{display:flex;align-items:center;gap:5px;font-size:12px;color:#777}.activity-grid p img{width:14px}.activity-grid b{color:#C85346;font-size:14px}
.city-section{padding-bottom:52px}.city-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.city-grid a{min-height:92px;background:#FBFAF7;border:1px solid #eee8dd;border-radius:18px;display:grid;grid-template-columns:1fr auto;grid-template-rows:1fr auto auto;padding:18px;align-items:end;overflow:hidden}.city-grid img{grid-column:1/3;width:100%;height:42px;object-fit:contain;align-self:center}.city-grid strong{font-size:18px;color:var(--primary)}.city-grid small{grid-column:1/3;font-size:9px;letter-spacing:1.2px;color:#9a948c}
.guide-grid article>img{width:100%;height:116px;object-fit:cover}.guide-grid article>div{padding:12px}.guide-grid span{font-size:10px;color:#9B7A42}.guide-grid h3{font-size:16px;line-height:1.45;margin:7px 0 10px}.guide-grid time{font-size:10px;color:#999}
.footer{background:var(--dark);color:#f6f1e8;padding:38px 0 16px}.footer-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1.5fr;gap:48px}.footer-brand{display:flex;gap:8px;align-items:end}.footer-brand b{font-size:38px;color:#fff}.footer-brand span{font-size:20px;font-weight:700}.footer p{font-size:12px;color:#c7bfb4}.footer nav{display:flex;flex-direction:column;gap:9px}.footer h4{font-size:13px;color:#d9c399;margin:0 0 9px}.footer nav a{font-size:12px;color:#d7d2ca}.social{display:flex;gap:12px;margin-top:18px}.social img{width:28px;height:28px;filter:brightness(0) invert(1);opacity:.8}.footer-lettering span{display:block;font-family:"AR PL KaitiM Big5","Noto Serif CJK TC",serif;font-size:22px;color:#eee0c5;transform:rotate(-4deg);white-space:nowrap}
.footer-lettering img{width:260px;margin-top:-2px}.footer-bottom{border-top:1px solid rgba(255,255,255,.12);margin-top:22px;padding-top:18px;font-size:10px;color:#aaa49b}

@media (max-width: 980px){
 .shell{width:min(100% - 36px,860px)} .nav{display:none}.hamb{display:block}.hero{height:610px}.hero-bg{object-position:62% 50%}.hero-overlay{background:linear-gradient(90deg,rgba(250,248,243,.93),rgba(250,248,243,.35) 55%,transparent 80%)}.hero-copy{width:62%}.hero-title{font-size:48px}.hero-script-art{width:220px;right:10px;top:42px}.search-head{align-items:flex-start;flex-direction:column}.searchbar,.searchbar.activity{width:100%;grid-template-columns:repeat(2,1fr)}.searchbar .search-submit{min-height:54px}.industry-grid{grid-template-columns:repeat(3,1fr)}.store-grid,.activity-grid,.guide-grid{grid-template-columns:repeat(2,1fr)}.city-grid{grid-template-columns:repeat(4,1fr)}.footer-grid{grid-template-columns:1.2fr 1fr 1fr}
 .footer-lettering{grid-column:1/-1}
}
@media (max-width: 600px){
 .shell{width:calc(100% - 28px)} .site-header{height:64px}.brand-num{font-size:26px}.brand-name{font-size:16px}.brand small{display:none}.actions .login{display:none}.hero{height:650px}.hero-bg{object-position:68% center}.hero-overlay{background:linear-gradient(180deg,rgba(250,248,243,.78),rgba(250,248,243,.08) 55%,rgba(29,40,36,.15))}.hero-content{padding-top:38px}.hero-copy{width:100%}.hero-kicker{font-size:9px}.hero-title{font-size:40px;max-width:280px}.hero-subtitle{font-size:15px;max-width:300px}.hero-underline{width:290px}.hero-plane{width:95px;left:250px;top:120px}.hero-script-text{right:8px;top:235px;font-size:21px}.hero-script-text img{width:145px}.hero-industries{left:0;right:0;bottom:26px;gap:8px}.hero-industries>div{flex:1;width:auto;height:84px;padding:12px 8px;grid-template-columns:38px 1fr}.hero-industries b{font-size:11px}.hero-industries small{font-size:8px}
 .section{padding:52px 0}.section-heading>img{width:40px;height:40px}.section-heading h2{font-size:24px}.section-heading p{font-size:12px}.searchbar,.searchbar.activity{grid-template-columns:1fr}.searchbar>button,.searchbar label{min-height:50px;border-right:0;border-bottom:1px solid var(--border)}.industry-grid{grid-template-columns:1fr;gap:14px}.industry-card{height:150px}.section-title-row{align-items:flex-end}.section-title-row>a{font-size:11px}.store-grid,.activity-grid,.guide-grid{grid-template-columns:1fr 1fr;gap:12px}.photo{height:130px}.card-body{padding:12px}.card-body h3{font-size:14px}.card-body p{font-size:10px}.guide-grid article>img{height:125px}.activity-grid article>div,.guide-grid article>div{padding:12px}.activity-grid h3,.guide-grid h3{font-size:13px}.city-grid{grid-template-columns:repeat(2,1fr);gap:12px}.city-grid a{min-height:125px}.footer-grid{grid-template-columns:1fr 1fr;gap:28px}.footer-grid>div:first-child,.footer-lettering{grid-column:1/-1}
}

@media (min-width:981px){
  .hero-subtitle{font-family:"AR PL KaitiM Big5","Noto Serif CJK TC",serif;font-size:18px}
  .hero-underline{width:360px}
  .hero-plane{width:110px;left:355px;top:116px}
  .icon-circle{background:transparent;width:34px;height:34px}
  .icon-circle img{width:28px;height:28px}
  .hero-industries b{font-size:14px}
  .hero-industries small{font-size:9px}
  .store-card,.activity-grid article,.guide-grid article{border-radius:10px}
  .city-grid{gap:12px}
  .city-grid a{border-radius:10px;padding:12px}
}


/* Production Shared Header clear — mock reference header/footer unused */
body.ett-home-body{
  --ett-home-header-offset:76px;
}
@media (max-width:980px){
  body.ett-home-body{--ett-home-header-offset:66px;}
}
body.ett-home-body .home-page{
  padding-top:var(--ett-home-header-offset);
}
body.ett-home-body .site-header,
body.ett-home-body .footer{
  display:none !important;
}

/* Production searchbar native selects (replace non-functional mock/filter links) */
.searchbar > .ett-home-select-wrap{
  display:flex;align-items:stretch;margin:0;border-right:1px solid var(--border);background:white;min-width:0;
}
.searchbar > .ett-home-select-wrap > select{
  width:100%;border:0;background:transparent;padding:0 18px;color:#5b5e59;font:inherit;
  appearance:auto;-webkit-appearance:menulist;cursor:pointer;min-height:54px;
}
.visually-hidden{
  position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;
}
.store-card > a,.activity-grid article > a{display:block;color:inherit;text-decoration:none}
.ett-home-empty{grid-column:1/-1;margin:0;padding:18px;color:var(--muted);font-size:14px}

/* Store logo: contain within photo well — no crop/stretch; source is store logoFile */
.store-card .photo{
  display:flex;align-items:center;justify-content:center;
  padding:16px;box-sizing:border-box;background:#FBF9F4;
}
.store-card .photo > img:first-child{
  width:auto;height:auto;max-width:72px;max-height:72px;
  object-fit:contain;object-position:center;
}

@media (max-width:600px){
 .searchbar > .ett-home-select-wrap{min-height:50px;border-right:0;border-bottom:1px solid var(--border)}
 .searchbar > .ett-home-select-wrap > select{min-height:50px}
}

/* Recommended store cards: Desktop left photo / right body; same DOM reflows on tablet/mobile */
@media (min-width:981px){
  .store-card > a{
    display:grid;
    grid-template-columns:128px minmax(0,1fr);
    align-items:stretch;
  }
  .store-card .photo{
    height:auto;
    min-height:128px;
  }
  .store-card .photo > img:first-child{
    max-width:80px;
    max-height:80px;
  }
  .store-card .card-body{
    padding:14px 14px 14px 12px;
    display:flex;
    flex-direction:column;
    justify-content:center;
  }

  /* Desktop: widen 找店家 industry/city; keep keyword + submit proportion */
  .searchbar{
    grid-template-columns:200px 180px minmax(0,1fr) 145px;
  }
  .searchbar > .ett-home-select-wrap > select{
    padding:0 14px;
    white-space:nowrap;
    text-overflow:clip;
  }

  /* Desktop: activity keyword wider; submit matches 找店家 button */
  .searchbar.activity{
    grid-template-columns:minmax(120px,0.9fr) minmax(120px,0.9fr) minmax(220px,1.5fr) 145px;
  }
  .searchbar .search-submit,
  .searchbar.activity .search-submit{
    min-height:54px;
    height:100%;
    padding:0 18px;
    box-sizing:border-box;
    display:flex;
    align-items:center;
    justify-content:center;
    white-space:nowrap;
  }

  /* Hero three industries: enlarge text + existing SVG (no transform:scale) */
  .hero-industries{gap:42px}
  .hero-industries>div{
    width:152px;
    height:70px;
    grid-template-columns:52px 1fr;
  }
  .hero-industries .icon-circle{
    width:46px;
    height:46px;
  }
  .hero-industries .icon-circle img{
    width:28px;
    height:28px;
  }
  .hero-industries b{font-size:15px;line-height:1.2}
  .hero-industries small{font-size:11px}
}

/* Tablet/Mobile hero industries: proportional enlarge within existing reflow */
@media (max-width:980px) and (min-width:601px){
  .hero-industries{gap:16px}
  .hero-industries>div{height:92px;grid-template-columns:44px 1fr}
  .hero-industries .icon-circle{width:42px;height:42px}
  .hero-industries .icon-circle img{width:26px;height:26px}
  .hero-industries b{font-size:13px}
  .hero-industries small{font-size:9px}
}
@media (max-width:600px){
  .hero-industries{gap:10px}
  .hero-industries>div{height:90px;padding:12px 6px;grid-template-columns:40px 1fr}
  .hero-industries .icon-circle{width:38px;height:38px}
  .hero-industries .icon-circle img{width:24px;height:24px}
  .hero-industries b{font-size:12px}
  .hero-industries small{font-size:9px}
}

/* 598 store-activity image size Authority (home)
   DOM: .activity-grid article > a > img
   Desktop max 460 / Tablet 520 / Mobile 270; natural under max; cover+center crop when over;
   top dual radius matches card; no bottom radius (no seam with body). */
.activity-grid article > a > img{
  width:100%;
  height:auto;
  max-height:460px;
  object-fit:cover;
  object-position:center;
  display:block;
  border-radius:18px 18px 0 0;
}
@media (min-width:981px){
  .activity-grid article > a > img{
    border-radius:10px 10px 0 0;
    max-height:460px;
  }
}
@media (max-width:980px){
  .activity-grid article > a > img{ max-height:520px; }
}
@media (max-width:767px){
  .activity-grid article > a > img{ max-height:270px; }
}

/* Home rails: horizontal overflow + scroll-snap; card width matches prior 4/2 grid fr. */
.ett-home-rail{
  position:relative;
}
.ett-home-rail__viewport{
  overflow-x:auto;
  overflow-y:hidden;
  scroll-snap-type:x mandatory;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
  outline:none;
  container-type:inline-size;
  container-name:home-rail;
}
.ett-home-rail__viewport::-webkit-scrollbar{ display:none; }
.ett-home-rail__track.store-grid,
.ett-home-rail__track.activity-grid{
  display:flex;
  flex-wrap:nowrap;
  gap:20px;
  grid-template-columns:none;
  width:max-content;
  min-width:100%;
  align-items:stretch;
}
.ett-home-rail__track.store-grid > .store-card,
.ett-home-rail__track.activity-grid > article{
  flex:0 0 calc((100cqw - 60px) / 4);
  width:calc((100cqw - 60px) / 4);
  max-width:calc((100cqw - 60px) / 4);
  scroll-snap-align:start;
  min-width:0;
}
.ett-home-rail__btn{
  position:absolute;
  top:50%;
  z-index:3;
  transform:translateY(-50%);
  width:40px;
  height:40px;
  border-radius:50%;
  border:1px solid var(--border);
  background:#fff;
  box-shadow:0 6px 18px rgba(38,53,47,.12);
  cursor:pointer;
  color:var(--primary);
  padding:0;
}
.ett-home-rail__btn::before{
  content:"";
  display:block;
  width:10px;
  height:10px;
  margin:0 auto;
  border-top:2px solid currentColor;
  border-right:2px solid currentColor;
}
.ett-home-rail__btn--prev{ left:-6px; }
.ett-home-rail__btn--prev::before{ transform:rotate(-135deg); margin-left:14px; }
.ett-home-rail__btn--next{ right:-6px; }
.ett-home-rail__btn--next::before{ transform:rotate(45deg); margin-left:10px; }
.ett-home-rail__btn:focus-visible{
  outline:3px solid rgba(143,175,157,.55);
  outline-offset:2px;
}
.ett-home-rail__btn[hidden]{
  display:none !important;
}
.ett-home-rail__track.activity-grid > article{
  display:flex;
  flex-direction:column;
}
.activity-grid article > div{
  display:flex;
  flex-direction:column;
  flex:1 1 auto;
  min-height:0;
}
.activity-grid article h3{
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
  line-clamp:2;
  overflow:hidden;
  text-overflow:ellipsis;
  overflow-wrap:anywhere;
}
.activity-grid article > a.ett-home-act-photo{
  position:relative;
  display:block;
  color:inherit;
  flex:0 0 auto;
}
.activity-grid article h3 a{
  color:inherit;
  text-decoration:none;
}
.ett-home-act-badge{
  position:absolute;
  top:8px;
  right:8px;
  z-index:2;
  font-size:10px;
  font-weight:700;
  color:#fff;
  padding:3px 9px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.92);
  letter-spacing:.02em;
  background:linear-gradient(145deg,#BE5A46,#984032);
}
.ett-home-act-badge.ett-act-audience--trade{
  background:linear-gradient(145deg,#8A9C68,#657846);
}
.ett-home-act-badge.ett-act-audience--both{
  background:linear-gradient(145deg,#7088B1,#50678E);
}
.ett-home-act-foot{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  margin-top:auto;
  padding-top:6px;
  border-top:1px solid #eeeae3;
  font-size:12px;
  flex-shrink:0;
}
.ett-home-act-foot strong{
  font-size:12px;
  color:#2b302d;
  font-weight:700;
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.ett-home-act-hub{
  flex:0 0 auto;
  color:var(--gold);
  font-size:12px;
  font-weight:700;
  text-decoration:none;
  white-space:nowrap;
}
.ett-home-act-hub:hover,
.ett-home-act-hub:focus-visible{
  text-decoration:underline;
  text-underline-offset:3px;
}
@media (max-width:980px){
  .ett-home-rail__track.store-grid > .store-card,
  .ett-home-rail__track.activity-grid > article{
    flex:0 0 calc((100cqw - 20px) / 2);
    width:calc((100cqw - 20px) / 2);
    max-width:calc((100cqw - 20px) / 2);
  }
}
@media (max-width:600px){
  .ett-home-rail__track.store-grid{
    gap:12px;
  }
  .ett-home-rail__track.store-grid > .store-card{
    flex:0 0 calc((100cqw - 12px) / 2);
    width:calc((100cqw - 12px) / 2);
    max-width:calc((100cqw - 12px) / 2);
  }
  /* Activity mobile: 2 rows × 2 visible columns, scroll right */
  .ett-home-rail__track.activity-grid{
    display:grid;
    grid-auto-flow:column;
    grid-template-rows:auto auto;
    grid-auto-columns:calc((100cqw - 12px) / 2);
    gap:12px;
    width:max-content;
    min-width:100%;
  }
  .ett-home-rail__track.activity-grid > article{
    width:auto;
    max-width:none;
    flex:none;
  }
  .ett-home-rail__btn{ width:34px; height:34px; }
  .ett-home-rail__btn--prev{ left:0; }
  .ett-home-rail__btn--next{ right:0; }
}
