/* Startsidan ryms i första vyn genom kompakt layout, inte dolt innehåll. */
.shopStart{display:flex;flex-direction:column;min-height:100dvh}
.startHeader{flex:none;width:min(1120px,100%);margin:0 auto;padding:12px 24px;gap:6px}
.brandHome img{height:clamp(50px,12dvh,94px);width:clamp(90px,22dvh,168px)}
.headerSeason{padding:5px 12px;font-size:12px;line-height:1.25}
.startMain{width:100%;margin:0 auto;padding:0 24px 10px;display:flex;flex-direction:column;gap:12px}
.startWelcome{padding:12px 0 0}
.startEyebrow{font-size:10px;margin-bottom:7px;letter-spacing:.14em}
.startWelcome h1{font-size:clamp(24px,4.6dvh,36px);line-height:1.08;margin-bottom:8px}
.startLead{font-size:14px;line-height:1.4;max-width:600px}
.saleGrid,.saleGrid.single{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;max-width:none}
.saleGrid.single{grid-template-columns:1fr;max-width:560px;margin:auto}
.saleCard{border-radius:18px}
.saleVisual{height:clamp(65px,16dvh,145px);flex:none}
.saleCopy{padding:14px 16px;gap:6px}
.saleCopy .smallLabel{font-size:9px;line-height:1.3;letter-spacing:.08em}
.saleCopy h2{font-size:23px;line-height:1.12}
.saleCopy p{font-size:13px;line-height:1.35;margin:0}
.saleCta{padding-top:9px;min-height:44px;font-size:13px;gap:8px}
.saleCta span:last-child{width:28px;height:28px;flex:none;font-size:20px}
.howToOrder{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:0;padding:10px 0}
.howToOrder>div{gap:8px}
.howToOrder span{width:24px;height:24px;font-size:10px}
.howToOrder p{font-size:12px;line-height:1.25}
.startFooter{flex-direction:row;align-items:center;padding:0;font-size:12px;gap:14px}
.staffEntry{position:relative;text-align:right}
.staffEntry summary{min-height:36px;display:flex;align-items:center;cursor:pointer;white-space:nowrap}
.staffLinks{position:absolute;z-index:100;right:0;bottom:calc(100% + 8px);min-width:230px;max-width:calc(100vw - 24px);display:flex;flex-direction:column;gap:7px;padding:12px;background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:0 8px 35px #30130b25;text-align:left}
.staffLinks a{min-height:44px;display:flex;align-items:center}
.shopStart>.staffBar{flex:none;gap:8px;padding:6px 12px;font-size:12px}
.shopStart>.staffBar label{width:auto;flex:1;margin:0}
.shopStart>.staffBar label select{display:inline-block;width:auto;max-width:100%;margin:0;min-height:36px;padding:6px;font-size:13px!important}
.shopStart>.staffBar>span{flex:none}
.shopStart>.staffBar>button{min-height:36px;font-size:12px;padding:6px 10px}
@media(max-width:700px){
 .startHeader{padding:8px 12px;gap:5px}
 .brandHome img{height:clamp(54px,11dvh,88px);width:clamp(100px,20dvh,157px)}
 .startMain{padding:0 12px 8px;gap:10px}
 .startWelcome{padding:8px 0 0}
 .startWelcome h1{font-size:clamp(23px,3.6dvh,29px)}
 .startLead{font-size:13px;line-height:1.35}
 .saleGrid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
 .saleVisual{height:clamp(60px,12dvh,105px)}
 .saleCopy{padding:10px;gap:5px}
 .saleCopy h2{font-size:19px;line-height:1.12}
 .saleCopy p{font-size:12px;line-height:1.35}
 .saleCopy .smallLabel{font-size:8px;letter-spacing:.04em}
 .saleCta{font-size:12px;gap:5px;padding-top:7px}
 .saleCta span:last-child{width:24px;height:24px;font-size:18px}
 .howToOrder{gap:8px;padding:8px 0}
 .howToOrder>div{flex-direction:column;align-items:center;text-align:center;gap:3px}
 .howToOrder span{width:20px;height:20px;font-size:9px}
 .howToOrder p{font-size:11px}
 .startFooter{font-size:11px;gap:8px}
 .staffEntry summary{font-size:11px}
 .shopStart>.staffBar{flex-wrap:wrap}
 .shopStart>.staffBar label{width:100%}
}
@media(max-height:650px){
 .startHeader{padding-top:5px;padding-bottom:5px}
 .brandHome img{width:108px;height:61px}
 .headerSeason{font-size:10px;padding:3px 10px}
 .startMain{gap:7px}
 .startWelcome{padding-top:4px}
 .startWelcome h1{font-size:23px;margin-bottom:5px}
 .startEyebrow{font-size:9px;margin-bottom:4px}
 .startLead{font-size:12px;line-height:1.25}
 .saleVisual{height:60px}
 .saleCopy{padding:9px;gap:4px}
 .saleCopy h2{font-size:18px}
 .saleCopy p{font-size:11px;line-height:1.3}
 .saleCopy .smallLabel{font-size:8px}
 .saleCta{font-size:11px;padding-top:5px}
 .howToOrder{padding:6px 0}
 .howToOrder p{font-size:10px}
 .startFooter{font-size:10px}
 .staffEntry summary{font-size:10px;min-height:28px}
}
@media(max-height:460px) and (min-width:701px){
 .startHeader{position:relative;padding:3px 12px;min-height:48px}
 .brandHome img{width:82px;height:46px}
 .headerSeason{position:absolute;right:24px;top:14px}
 .startWelcome h1{font-size:21px}
 .startWelcome{padding-top:0}
 .startLead{max-width:800px;font-size:11px}
 .saleVisual{height:45px}
 .saleCopy{padding:7px 12px;gap:3px}
 .saleCopy h2{font-size:17px}
 .saleCopy p{font-size:11px}
 .saleCta{min-height:30px;padding-top:4px}
 .howToOrder{padding:4px 0}
}
/* Även admins extra navigation ska rymmas utan att kundinnehåll försvinner. */
.shopStart.hasStaffNavigation>.staffBar label{display:flex;align-items:center;gap:6px}
.shopStart.hasStaffNavigation>.staffBar label select{flex:1;min-width:0}
@media(max-height:740px){
 .hasStaffNavigation .startHeader{position:relative;min-height:47px;padding:3px 12px}
 .hasStaffNavigation .brandHome img{width:82px;height:46px}
 .hasStaffNavigation .headerSeason{position:absolute;right:12px;top:16px;font-size:9px}
 .hasStaffNavigation .startWelcome{padding:0}
 .hasStaffNavigation .startWelcome h1{font-size:20px;margin-bottom:4px}
 .hasStaffNavigation .startLead{font-size:11px;line-height:1.25}
 .hasStaffNavigation .startEyebrow{font-size:8px;margin-bottom:3px}
 .hasStaffNavigation .startMain{gap:5px}
 .hasStaffNavigation .saleVisual{height:30px}
 .hasStaffNavigation .saleCopy{padding:8px;gap:3px}
 .hasStaffNavigation .saleCopy h2{font-size:17px}
 .hasStaffNavigation .howToOrder{padding:4px 0}
}
@media(max-width:700px){
 .shopStart.hasStaffNavigation>.staffBar{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:3px 8px;padding:4px 12px}
 .shopStart.hasStaffNavigation>.staffBar label{grid-column:1;grid-row:1;width:100%;min-width:0;font-size:11px}
 .shopStart.hasStaffNavigation>.staffBar label select{width:100%;min-width:0}
 .shopStart.hasStaffNavigation>.staffBar>span{grid-column:1/-1;grid-row:2;font-size:11px;line-height:1.1}
 .shopStart.hasStaffNavigation>.staffBar>button{grid-column:2;grid-row:1}
 .hasStaffNavigation .startMain{gap:4px}
}
@media(max-height:460px) and (min-width:701px){.hasStaffNavigation .brandHome img{height:40px;width:72px}.hasStaffNavigation .startHeader{min-height:43px}.hasStaffNavigation .startMain{padding-bottom:3px}}

.saleGrid.three{grid-template-columns:repeat(3,minmax(0,1fr))}.saleVisual.bingolotto{background:#501107}.saleVisual.bingolotto img{object-fit:contain}@media(max-width:700px){.saleGrid.three{gap:6px}.saleGrid.three .saleCopy{padding:7px;gap:3px}.saleGrid.three .saleCopy h2{font-size:16px}.saleGrid.three .saleCopy p{font-size:10px;line-height:1.25}.saleGrid.three .saleCopy .smallLabel{font-size:7px}.saleGrid.three .saleCta{font-size:10px;gap:4px;min-height:36px}.saleGrid.three .saleCta span:last-child{width:20px;height:20px;font-size:16px}.saleGrid.three .saleVisual{height:55px}}

/* Shop ligger under klubbmärket, före säsongsrutan, inom samma kompakta yta. */
.startHeader .brandHome{display:flex;flex-direction:column;align-items:center;gap:3px;text-decoration:none}.startHeader .brandHome img{height:clamp(32px,calc(12dvh - 30px),64px)}.startShopBadge{font-size:clamp(16px,2.5dvh,22px);line-height:1.05;padding:2px 18px}@media(max-width:700px){.startHeader .brandHome img{height:clamp(32px,calc(11dvh - 27px),61px)}}@media(max-height:650px){.startHeader .brandHome img{height:35px}.startShopBadge{font-size:14px;padding:2px 15px}}@media(max-height:740px){.hasStaffNavigation .startHeader .brandHome img{height:24px}.hasStaffNavigation .startShopBadge{font-size:13px;padding:1px 13px}}@media(max-height:460px) and (min-width:701px){.startHeader .brandHome img{height:25px}.startShopBadge{font-size:13px;padding:1px 13px}}

/* Mobil: håll klubbmärket tydligt och placera säsongen direkt under. */
@media(max-width:700px){
 .shopStart .startHeader{display:grid;grid-template-columns:minmax(0,1fr);justify-items:center;gap:7px;padding:10px 12px}
 .shopStart .startHeader .brandHome{grid-row:1}
 .shopStart .startHeader .brandHome img{width:clamp(145px,41vw,190px);height:clamp(76px,21vw,100px)}
 .shopStart .startHeader .startShopBadge{font-size:18px;padding:2px 18px}
 .shopStart .startHeader .headerSeason{position:static;inset:auto;grid-row:2;justify-self:center;max-width:100%;font-size:12px;line-height:1.25;text-align:center}
}

@media(max-width:700px) and (max-height:650px){.shopStart .startHeader{gap:4px;padding-top:4px;padding-bottom:4px}.shopStart .startHeader .brandHome img{width:124px;height:56px}.shopStart .startHeader .startShopBadge{font-size:14px;padding:1px 15px}.shopStart .startHeader .headerSeason{font-size:10px;padding:3px 10px}.shopStart .startFooter{justify-content:flex-end}.shopStart .startFooter>p{max-width:146px;text-align:right}}