/* Homepage shop composition: Figma desktop 271:1559 and mobile 318:338. */
.home-shop{padding:24px 0}
.home-shop>.panel{max-width:1120px;min-height:424px;padding:40px 56px;background:var(--card);overflow:hidden}
.home-shop-layout{display:grid;grid-template-columns:360px 410px;grid-template-areas:"copy preview" "brand preview" "note preview";grid-template-rows:184px 84px 21px;gap:24px 110px;align-content:center;align-items:start;justify-content:center;min-height:344px;max-width:880px;margin:auto}
.home-shop-copy{grid-area:copy;min-width:0}
.home-shop-copy h2{font-size:46px;line-height:52px;letter-spacing:-1.38px;margin:0 0 24px}
.home-shop-copy p{font-size:18px;line-height:28px;margin:0}
.home-shop-note{grid-area:note;display:block;font:500 13px/21px var(--mono);margin:0;color:var(--ink)}
.home-brand-strip{grid-area:brand;display:flex;align-items:center;justify-content:space-between;gap:12px;width:360px;max-width:100%;height:84px;padding:16px;border:1px solid var(--line);border-radius:12px;background:var(--card)}
.home-brand-item{display:flex;flex-direction:column;justify-content:center;gap:8px;width:92px;min-width:0;height:48px}
.home-brand-label{font-size:12px;line-height:16px;color:var(--secondary)}
.home-brand-value{display:flex;align-items:center;gap:6px;height:24px;font-size:13px;line-height:20px;color:var(--ink);white-space:nowrap}
.home-brand-colors i{display:block;flex:none;width:18px;height:18px;border-radius:50%;background:var(--ink)}
.home-brand-colors i:first-child{border:1px solid var(--line)}
.home-brand-colors i:nth-child(2){background:var(--bg)}
.home-brand-colors i:nth-child(3){background:var(--blue)}
.home-brand-value b{font-size:20px;line-height:24px;font-weight:500}
.home-brand-corner{display:block;flex:none;width:20px;height:20px;border:1.2px solid var(--secondary);border-radius:6px}
.home-brand-item:last-child .home-brand-value{font-size:12px}
.home-brand-divider{flex:none;width:1px;height:36px;background:var(--line)}
.home-shop-preview{grid-area:preview;align-self:center;position:relative;width:410px;max-width:100%;aspect-ratio:1.2;min-width:0;margin:0}
.home-shop-preview .home-shop-phone{position:absolute;width:127.272727%;height:auto;max-width:none;left:-11.544012%;top:calc(-6.71% + 16px)}
@media(min-width:801px){
 .home-shop-preview .home-shop-phone{width:102.439024%;left:-1.219512%;top:-54.487805%}
}
@media(min-width:801px) and (max-width:1100px){
 .home-shop>.panel{padding:36px}
 .home-shop-layout{grid-template-columns:minmax(0,360px) minmax(0,410px);grid-template-rows:auto 84px auto;gap:24px 32px}
 .home-shop-copy h2{font-size:40px;line-height:46px}
 .home-shop-copy p{font-size:17px;line-height:26px}
 .home-shop-preview{width:100%}
 .home-brand-strip{padding-inline:12px;gap:8px}
 .home-brand-item{width:auto;flex:1}
}
@media(max-width:800px){
 .home-shop{padding:16px 0 24px}
 .home-shop>.panel{padding:24px 24px 0;min-height:0;border-radius:20px}
 .home-shop-layout{grid-template-columns:minmax(0,1fr);grid-template-areas:"copy" "brand" "note" "preview";grid-template-rows:auto;gap:20px;min-height:0;max-width:430px}
 .home-shop-copy h2{font-size:30px;line-height:36px;letter-spacing:-.6px;margin:0 0 16px}
 .home-shop-copy h2 br{display:none}
 .home-shop-copy p{font-size:16px;line-height:24px}
 .home-shop-copy .shop-copy-break{display:none}
 .home-brand-strip{width:100%;margin-top:8px}
 .home-brand-item{width:74px}
 .home-brand-label{font-size:11px}
 .home-brand-value{font-size:12px}
 .home-brand-item:last-child .home-brand-value{font-size:11px}
 .home-shop-preview{justify-self:center;width:calc(100% + 48px);max-width:350px;aspect-ratio:350/330;overflow:hidden}
 .home-shop-preview .home-shop-phone{width:88.5714286%;left:5.72707149%;top:0}
 .home-shop-note{text-align:center;font-size:11px;line-height:18px}
}
@media(max-width:360px){
 .home-brand-strip{padding-inline:10px;gap:8px}
 .home-brand-item{width:auto;flex:1}
 .home-brand-colors{gap:4px}
 .home-brand-colors i{width:15px;height:15px}
 .home-brand-value{gap:4px}
 .home-brand-item:last-child .home-brand-value{font-size:10px}
 .home-brand-corner{width:17px;height:17px}
 .home-shop-note{font-size:10px}
}

/* Ticket sales keeps its own copy within the shared responsive shop graphic. */
.sales-page .sales-shop .home-shop-layout{grid-template-columns:400px 410px;grid-template-rows:auto 84px 21px;column-gap:70px}
.sales-page .sales-shop .home-shop-copy h2{font-size:36px;line-height:42px;letter-spacing:-1.2px;margin:0 0 24px}
.sales-page .sales-shop .home-shop-copy p{font-size:18px;line-height:28px;margin:0}
@media(min-width:801px) and (max-width:1100px){
 .sales-page .sales-shop .home-shop-layout{grid-template-columns:minmax(0,400px) minmax(0,410px);column-gap:32px}
 .sales-page .sales-shop .home-shop-copy h2{font-size:32px;line-height:38px}
 .sales-page .sales-shop .home-shop-copy p{font-size:17px;line-height:26px}
}
@media(max-width:800px){
 .sales-page .sales-shop .home-shop-layout{grid-template-columns:minmax(0,1fr);grid-template-rows:auto;gap:20px}
 .sales-page .sales-shop .home-shop-copy h2{font-size:30px;line-height:36px;letter-spacing:-.6px;margin:0 0 16px}
 .sales-page .sales-shop .home-shop-copy h2 br{display:initial}
 .sales-page .sales-shop .home-shop-copy p{font-size:16px;line-height:24px}
}