.hub-home, .hub-home * { box-sizing: border-box; }
.hub-home {
  width: min(1200px, calc(100% - 64px));
  margin: 0 auto;
  padding: 46px 0 60px;
}
.hub-masthead { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; margin-bottom: 32px; }
.hub-date {
  display: flex; align-items: center; gap: 10px; margin: 0 0 12px;
  color: #86586a; font: 600 12px/1.4 "Segoe UI", "Microsoft YaHei", sans-serif;
  letter-spacing: .08em; font-variant-numeric: tabular-nums;
}
.hub-date > span { width: 24px; height: 1px; background: #ab7386; }
.hub-masthead h1 {
  margin: 0; font: 600 clamp(35px, 4.4vw, 60px)/1.18 "Songti SC", "Noto Serif CJK SC", SimSun, Georgia, serif;
  color: #4a2132; letter-spacing: -.055em;
}
.hub-masthead h1 i { font: italic 500 1.22em/.9 Georgia, "Times New Roman", serif; letter-spacing: -.075em; margin-right: .06em; }
.hub-today {
  display: inline-flex; align-items: center; justify-content: center; gap: 17px;
  margin-bottom: 4px; padding: 11px 18px; color: #fff; background: var(--hub-berry);
  border-radius: 25px; font-size: 13px; font-weight: 600; line-height: 1.4;
}
.hub-today:hover { background: #68213a; }
.hub-today span { font-size: 16px; line-height: 1; }
.hub-covers { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(14px, 1.65vw, 23px); }
.hub-card {
  display: flex; flex-direction: column; overflow: hidden; color: inherit;
  border: 1px solid var(--hub-border); border-radius: 16px; background: #fff;
  transition: border-color .18s, box-shadow .18s, transform .18s;
}
.hub-card:hover { border-color: #caa4b1; box-shadow: 0 6px 20px #5923360f; transform: translateY(-2px); }
.hub-photo { aspect-ratio: 1.77; background: #f4dfe4; overflow: hidden; }
.hub-photo img { display: block; width: 100%; height: 100%; object-fit: cover; }
.hub-photo picture { display: block; width: 100%; height: 100%; }
.hub-mazda img { object-position: 74% center; }
.hub-card-copy { display: flex; flex-direction: column; flex: 1; padding: clamp(16px, 2vw, 27px); }
.hub-category { font-size: 12px; font-weight: 650; letter-spacing: .12em; color: #8b425a; }
.hub-card-copy h2 { margin: 6px 0 9px; font: 500 clamp(29px, 3.2vw, 45px)/1.1 Georgia, "Times New Roman", serif; letter-spacing: -.055em; color: #472031; }
.hub-card-copy p { margin: 0 0 20px; font-size: 14px; line-height: 1.65; color: #68535c; }
.hub-card-foot {
  margin-top: auto; padding-top: 14px; border-top: 1px solid #efdee4;
  display: flex; align-items: center; justify-content: space-between; gap: 5px;
  color: #794654; font-size: 12px; font-weight: 550;
}
.hub-card-foot > span:first-child { display: flex; align-items: center; gap: 6px; }
.hub-card-foot b { font-weight: normal; color: #a57685; }
.hub-arrow {
  display: inline-grid; place-items: center; width: 29px; height: 29px;
  color: #812843; border-radius: 50%; background: #f8edf0; font-size: 19px;
  font-family: Arial, sans-serif; line-height: 1;
}
.hub-week { margin-top: 31px; }
.hub-week header { display: flex; gap: 15px; justify-content: space-between; align-items: center; margin-bottom: 14px; }
.hub-week h2 { font-size: 20px; line-height: 1.4; margin: 0; color: #50313d; letter-spacing: .01em; }
.hub-week header a { display: inline-flex; align-items: center; gap: 7px; padding: 7px 0 7px 10px; font-size: 13px; color: var(--hub-berry); }
.hub-week-days { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 8px; }
.hub-week-days a {
  display: grid; grid-template-columns: auto 1fr; align-items: baseline; gap: 4px 9px;
  padding: 14px 14px 13px; border: 1px solid var(--hub-border); border-radius: 10px; background: #fff;
  color: #5f3c49;
}
.hub-week-days a:hover { border-color: #b67a90; }
.hub-week-days small { grid-column: 1/-1; font: 650 10px/1.4 "Segoe UI", Arial, sans-serif; letter-spacing: .11em; color: #986475; }
.hub-week-days strong { font-size: 14px; }
.hub-week-days span { font-size: 12px; line-height: 1.5; color: #73616a; }
.hub-week-days a[aria-current=date] { background: #812843; color: #fff; border-color: #812843; }
.hub-week-days a[aria-current=date] :is(small, span) { color: #fae6ec; }
@media (max-width: 1030px) {
  .hub-week-days a { display: flex; flex-direction: column; gap: 3px; }
}
@media (max-width: 850px) {
  .hub-home { width: calc(100% - 40px); }
  .hub-covers { gap: 12px; }
  .hub-card-copy { padding: 17px 14px; }
  .hub-card-copy p { font-size: 13px; }
}
@media (max-width: 700px) {
  .hub-home { width: calc(100% - 32px); padding: 28px 0 36px; }
  .hub-masthead { margin-bottom: 20px; align-items: flex-start; flex-direction: column; gap: 12px; }
  .hub-date { font-size: 10px; margin-bottom: 8px; }
  .hub-today { padding: 8px 11px; gap: 7px; font-size: 12px; margin-bottom: 1px; white-space: nowrap; }
  .hub-covers { grid-template-columns: 1fr; }
  .hub-card { display: grid; grid-template-columns: 35% 1fr; border-radius: 12px; }
  .hub-photo { width: 100%; height: 100%; aspect-ratio: auto; }
  .hub-mazda { display: flex; flex-direction: column; justify-content: center; background: #f7bbd5; }
  .hub-mazda picture { height: auto; flex: none; }
  .hub-mazda img { width: 100%; height: auto; }
  .hub-mazda::before, .hub-mazda::after {
    content: ""; flex: 1; background-image: url("driving-mobile.webp");
    background-repeat: no-repeat; background-size: 100% 10000%; background-position: center top;
  }
  .hub-mazda::after { background-position: center bottom; }
  .hub-card-copy { padding: 14px 15px 12px; }
  .hub-category { font-size: 11px; }
  .hub-card-copy h2 { margin: 2px 0 4px; font-size: 29px; }
  .hub-card-copy p { margin: 0 0 9px; line-height: 1.5; }
  .hub-card-foot { padding-top: 8px; font-size: 11px; }
  .hub-arrow { width: 23px; height: 23px; font-size: 16px; }
  .hub-week { margin-top: 24px; }
  .hub-week-days { grid-template-columns: repeat(4,minmax(0,1fr)); gap: 6px; }
  .hub-week-days a { padding: 10px 8px; border-radius: 8px; }
}
@media (max-width: 370px) {
  .hub-home { width: calc(100% - 24px); }
  .hub-card { grid-template-columns: 31% 1fr; }
  .hub-masthead { align-items: start; flex-direction: column; gap: 10px; }
  .hub-card-copy { padding: 12px; }
  .hub-card-copy h2 { font-size: 27px; }
}
@media (prefers-reduced-motion: reduce) {
  .hub-card { transition: none; }
  .hub-card:hover { transform: none; }
}
.hub-week-days small[hidden] {display:none}
.hub-week-days a { display:flex; flex-direction:column; }
.hub-card-foot > span:first-child {flex-wrap:wrap}
html[lang=my] .hub-home :is(h1,h2,.hub-category,.hub-date,.hub-week-days strong,.hub-card-copy p,.hub-card-foot,.hub-today) {font-family:"Myanmar Text","Noto Sans Myanmar","Myanmar Sangam MN",sans-serif;letter-spacing:0;line-height:1.7}
html[lang=my] .hub-masthead h1 {font-size:clamp(28px,4vw,50px)}
html[lang=my] .hub-card-copy h2 {font-size:clamp(20px,2.3vw,32px)}
html[lang=my] .hub-home {overflow-wrap:anywhere}
@media(max-width:700px){html[lang=my] .hub-card{grid-template-columns:30% 1fr}html[lang=my] .hub-week-days{grid-template-columns:repeat(3,minmax(0,1fr))}}