/* 2026-08-27：首頁出勤獨立區帶、關於與地址頁緊湊排版 */

/* 首頁：縮短主視覺，將出勤名單改為不受照片與營業卡擠壓的完整區帶。 */
.hero{
  min-height:auto;
  padding-top:clamp(6.7rem,10vh,8rem);
  padding-bottom:clamp(2.5rem,5vh,4rem);
}
.hero::before{bottom:1rem;}
.hero-journal{
  grid-template-columns:minmax(320px,.85fr) minmax(0,1.75fr);
  grid-template-rows:minmax(500px,58vh) auto;
  align-items:center;
  max-width:1420px;
}
.hero-letter{
  grid-column:1;
  grid-row:1;
  width:min(480px,105%);
  margin-left:0;
  padding:clamp(2.5rem,4vw,3.8rem) clamp(2rem,3.2vw,3.2rem);
}
.hero h1{font-size:clamp(4.2rem,7vw,6.3rem);}
.hero-photo{
  grid-column:1/-1;
  grid-row:1;
  min-height:500px;
}
.opening-status{
  grid-column:2;
  grid-row:1;
  align-self:end;
  justify-self:end;
  width:min(235px,35%);
  margin:0 1.4rem 1.4rem 0;
  padding:1.65rem 1.35rem;
}
.home-shift{
  grid-column:1/-1;
  grid-row:2;
  display:block;
  width:100%;
  margin:1.35rem 0 0;
  padding:1.3rem 1.45rem 1.5rem;
  overflow:visible;
  border:1px solid rgba(58,43,35,.16);
  border-top:3px solid var(--bloom-deep);
  background:rgba(255,253,248,.9);
}
.home-shift-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:1rem;
  min-width:0;
  margin:0 0 1rem;
  padding:0;
  border:0;
}
.home-shift-label{
  color:var(--ink);
  font-size:1.12rem;
  letter-spacing:.1em;
}
.home-shift-label::before{
  content:"TODAY'S CAST";
  display:block;
  margin-bottom:.3rem;
  color:var(--gold);
  font-family:"Cormorant Garamond",serif;
  font-size:.66rem;
  letter-spacing:.26em;
}
.home-shift-date{font-size:.75rem;color:var(--text-mute);}
.home-shift-list{
  display:grid;
  grid-template-columns:repeat(6,minmax(0,1fr));
  gap:.65rem;
  width:100%;
  overflow:visible;
  padding:0;
}
.home-shift-person{
  width:100%;
  min-width:0;
  min-height:58px;
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:.65rem;
  padding:.6rem .7rem;
  border:1px solid var(--surface-line);
  border-left:1px solid var(--surface-line);
  border-radius:0;
  background:rgba(246,239,231,.78);
}
.home-shift-person::after{margin-left:auto;}
.home-shift-avatar{
  width:40px;
  height:40px;
  border:2px solid #fff;
  background:var(--sage-soft);
  color:var(--bloom-deep);
  font-size:.8rem;
}
.home-shift-avatar img{display:block;width:100%;height:100%;object-fit:cover;}
.home-shift-copy{min-width:0;}
.home-shift-copy strong{font-size:.85rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.home-shift-copy small{font-size:.68rem;}
.home-shift-empty{grid-column:1/-1;padding:.55rem 0;}

/* 關於：標題與文字卡縮小，取消負邊距造成的狹窄斷行。 */
body.tabbed-site #about.page-active{
  padding-top:clamp(6.2rem,10vh,7.5rem);
  padding-bottom:clamp(2rem,4vh,3rem);
}
#about .wrap{max-width:1180px;}
#about .about-grid{
  grid-template-columns:minmax(440px,.92fr) minmax(0,1.08fr);
  gap:1.5rem;
  align-items:center;
}
#about .about-grid>div:first-child{
  margin:0;
  padding:clamp(2rem,3.5vw,3rem);
}
#about .section-title{
  max-width:none;
  margin-bottom:1.25rem;
  font-size:clamp(2.25rem,3vw,2.65rem);
  line-height:1.25;
  letter-spacing:.02em;
  white-space:nowrap;
}
#about .about-grid p:not(.eyebrow){font-size:.9rem;line-height:1.95;}
#about .about-grid>div:first-child::after{margin-top:1.5rem;}

/* 地址：兩張資訊卡各自依內容高度，不再讓右側時間軸撐出大面積空白。 */
body.tabbed-site #location[data-page="about"]{
  padding-top:1.25rem;
  padding-bottom:clamp(3rem,7vh,5rem);
}
#location .wrap{max-width:1120px;}
#location .location-grid{
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:1rem;
  align-items:start;
}
#location .location-grid>div{
  width:100%;
  margin:0;
  padding:clamp(1.8rem,3vw,2.5rem);
}
#location .section-title{
  margin-bottom:1.25rem;
  font-size:clamp(2.2rem,3.4vw,2.85rem);
  line-height:1.25;
}
#location .info-list dt,
#location .info-list dd{padding:.8rem 0;}

@media(max-width:1100px) and (min-width:861px){
  .hero-journal{
    grid-template-columns:minmax(280px,.82fr) minmax(0,1.55fr);
    grid-template-rows:minmax(480px,56vh) auto;
  }
  .hero-letter{width:min(430px,108%);}
  .opening-status{width:min(225px,38%);margin:0 1rem 1rem 0;}
  .home-shift-list{grid-template-columns:repeat(4,minmax(0,1fr));}
  #about .about-grid{grid-template-columns:minmax(390px,.95fr) minmax(0,1.05fr);}
  #about .section-title{font-size:clamp(2.05rem,3.4vw,2.35rem);}
}

@media(max-width:860px){
  .hero{padding:5.4rem .7rem 2.5rem;}
  .hero-journal{display:flex;flex-direction:column;}
  .hero-photo{order:1;min-height:0;aspect-ratio:16/10;}
  .hero-letter{
    order:2;
    width:calc(100% - 1.25rem);
    margin:-2rem auto 0;
    padding:2rem 1.5rem 1.8rem;
  }
  .hero h1{font-size:clamp(3.1rem,16vw,4.4rem);}
  .opening-status{
    order:3;
    width:calc(100% - 1.25rem);
    margin:.75rem auto 0;
    padding:1.25rem 1.15rem;
  }
  .home-shift{
    order:4;
    width:calc(100% - 1.25rem);
    margin:.75rem auto 0;
    padding:1.15rem 1rem 1.25rem;
    overflow:visible;
  }
  .home-shift-head{margin-bottom:.85rem;padding:0;border:0;}
  .home-shift-label{font-size:1.05rem;}
  .home-shift-list{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:.55rem;
    width:100%;
    overflow:visible;
    padding:0;
  }
  .home-shift-person{min-height:56px;padding:.55rem .6rem;}
  .home-shift-avatar{width:38px;height:38px;}
  .home-shift-copy strong{font-size:.8rem;}
  .home-shift-copy small{font-size:.64rem;}
  .home-shift-person::after{display:none;}

  body.tabbed-site #about.page-active{padding-top:5.5rem;padding-bottom:1rem;}
  #about .about-grid{grid-template-columns:1fr;gap:1rem;}
  #about .about-grid .photo-frame{order:-1;}
  #about .about-grid>div:first-child{padding:1.8rem 1.4rem;}
  #about .section-title{font-size:clamp(2rem,9vw,2.55rem);white-space:normal;}
  body.tabbed-site #location[data-page="about"]{padding-top:1rem;}
  #location .location-grid{grid-template-columns:1fr;gap:.8rem;}
  #location .location-grid>div{padding:1.7rem 1.35rem;}
  #location .section-title{font-size:clamp(2rem,9vw,2.5rem);}
}

@media(max-width:380px){
  .home-shift-list{grid-template-columns:1fr;}
}