/* Homepage: card hero, more room between sections, sticker-style cards (same look as Build-A-Tin / Pick 6). */

/* Hero: navy with a faint popcorn pattern; each slide = copy on the left + its photo as a card. */
.home-hero{background-color:#143154;background-size:140px 140px;position:relative}
.home-hero__slide{background:transparent!important;min-height:clamp(520px,40vw,640px)}
.home-hero .bat-hero__inner{padding:5rem 1.5rem 4.5rem}
.home-hero__card{width:min(500px,40vw)!important;padding:.6rem}
.home-hero__card img{width:100%;aspect-ratio:5/4;object-fit:cover;border-radius:1rem;display:block}
.bat-hero__btn--ghost{background:transparent;color:#fff;border-color:#fff;box-shadow:4px 4px 0 rgba(0,0,0,.35)}
.bat-hero__btn--ghost:hover{background:#fff;color:#143154;box-shadow:6px 6px 0 rgba(0,0,0,.35)}
.home-hero .slick-dots{bottom:2.25rem!important}
@media (max-width:767px){
	.home-hero__slide{min-height:0}
	.home-hero .bat-hero__inner{padding:2.5rem 1.25rem 4rem}
	.home-hero__card{width:min(320px,82vw)!important}
}

/* Section headings: a yellow squiggle underneath. */
.home-sec h2.font-fredoka:not(.sr-only)::after{content:"";display:block;width:190px;height:14px;margin:.75rem auto 0;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 240 16'%3E%3Cpath d='M4 10 Q 24 2 44 10 T 84 10 T 124 10 T 164 10 T 204 10 T 236 10' fill='none' stroke='%23f8d349' stroke-width='5' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat center/contain}
.home-sec--about h2.font-fredoka::after{margin-left:0}

/* Store finder: light section (the hero above is navy), search in a white card, pill controls. */
.home-sec--finder > section{background:#e8f5fc!important}
.home-sec--finder > section > div{padding-top:4.5rem!important;padding-bottom:4rem!important;color:#143154!important}
.home-sec--finder h2{color:#143154}
.home-sec--finder p.text-center{color:#3d6684!important;font-size:1.05rem;line-height:1.5}
.home-sec--finder .clusters-store-search{max-width:52rem;margin:1.75rem auto 0;background:#fff;border:3px solid #143154;border-radius:1.5rem;box-shadow:8px 8px 0 #143154;padding:1.5rem 1.5rem 1.1rem}
.home-sec--finder input[name="clusters_place"]{height:3.25rem;border:2px solid #143154;border-radius:9999px!important;padding:0 1.25rem!important;font-size:1.05rem}
.home-sec--finder input[name="clusters_place"]:focus{outline:3px solid #67afcd;outline-offset:2px}
.home-sec--finder label[for^="miles-"]{border:2px solid #143154!important;color:#143154;font-weight:600;padding:.3rem 1rem!important}
.home-sec--finder label[for^="miles-"]:hover{background:#fff8d6;color:#143154!important}
.home-sec--finder .font-fredoka:not(button):not(h2){color:#143154}
.home-sec--finder .clusters-reset{color:#143154!important}
.home-sec--finder .clusters-locate-msg{color:#143154!important;font-weight:600}

/* Map: yellow section, a bigger framed map and a matching list card. */
.home-sec--map > section{background:#f8d349!important}
.home-sec--map > section > div{padding-top:7.5rem!important;padding-bottom:7rem!important}
.home-sec--map .grid{gap:2.5rem!important;align-items:stretch}
.home-sec--map .grid > div:first-child{border:3px solid #143154;border-radius:1.5rem!important;box-shadow:8px 8px 0 #143154}
.home-sec--map iframe{height:clamp(320px,36vw,480px)!important}
.home-sec--map .grid > div:last-child{background:#fff;border:3px solid #143154;border-radius:1.5rem;box-shadow:8px 8px 0 #143154;padding:1.5rem 1.5rem 1rem}
.home-sec--map h3{color:#143154!important}
.home-sec--map .h-64{height:clamp(240px,26vw,360px)!important}

/* Everyday flavors: more room (it starts under the yellow curve), navy heading, pill group labels, sticker tiles. */
.home-sec--flavors > section > div:first-child{padding-top:8rem!important;padding-bottom:5.5rem!important}
.home-sec--flavors h2{color:#143154!important}
.home-sec--flavors h4{display:inline-flex!important;align-items:center;background:#143154;color:#fff!important;padding:.35rem 1.1rem .35rem .6rem;border-radius:9999px;font-size:1.15rem;box-shadow:3px 3px 0 #67afcd}
.home-sec--flavors section > div:first-child > p.text-sm{max-width:40rem!important;background:#fff;border:2px dashed #9cc7dc;border-radius:1rem;padding:.75rem 1.25rem;color:#3d6684!important}
.home-sec--flavors .products-slider .rounded-md{border:2px solid #143154!important;border-radius:1.1rem!important;box-shadow:5px 5px 0 #143154!important;transition:transform .15s ease,box-shadow .15s ease}
.home-sec--flavors .products-slider .rounded-md:hover{transform:translate(-2px,-3px);box-shadow:8px 8px 0 #143154!important}
.home-sec--flavors h4{margin-top:1rem}

/* Freshest ingredients banner as a framed card. */
.home-sec--fresh{padding:2rem 1.5rem 4.5rem!important}
.home-sec--fresh img{border:3px solid #143154;border-radius:1.5rem;box-shadow:8px 8px 0 #143154;transform:rotate(-1deg);transition:transform .2s ease}
.home-sec--fresh a:hover img{transform:rotate(0)}

/* About: the owners' photo as a tilted card, more room. */
.home-sec--about > div:first-child{padding-top:5rem!important;padding-bottom:5.5rem!important}
.home-sec--about > div:last-child{padding:1.5rem}
.home-sec--about > div:last-child img{border:3px solid #143154;border-radius:1.5rem;box-shadow:8px 8px 0 #143154}
@media (min-width:1024px){
	.home-sec--about{min-height:640px!important}
	.home-sec--about > div:last-child{padding:3.5rem 3rem 3.5rem 1rem}
	.home-sec--about > div:last-child img{transform:rotate(2deg)}
}

/* White curve into the navy rewards section. */
.home-wave{position:relative;z-index:5;height:90px;margin-bottom:-90px;line-height:0;pointer-events:none}
.home-wave svg{display:block;width:100%;height:100%}

/* Rewards: more room (it starts under the curve), sticker cards. */
.home-sec--rewards > section > div{padding-top:8rem!important;padding-bottom:5.5rem!important}
.home-sec--rewards .grid > div{border:3px solid #f8d349;border-radius:1.25rem!important;box-shadow:8px 8px 0 rgba(0,0,0,.3)!important;transition:transform .15s ease}
.home-sec--rewards .grid > div:hover{transform:translateY(-4px)}

/* Reviews: sticker cards, room before the newsletter curve. */
.home-sec--reviews > div:last-child{padding-bottom:7rem!important}
.home-sec--reviews .testimonial-slider .rounded-md{background:#fff;border:2px solid #143154!important;border-radius:1.25rem!important;box-shadow:5px 5px 0 #143154!important}

/* Buttons: the theme's small gradient buttons become big pills with a bold outline. */
.home-sec a[class*="from-cyan-500"],.home-sec a[class*="from-yellow-300"],.home-sec button[class*="from-cyan-500"],.home-sec button[class*="from-yellow-300"]{background-image:none!important;border:3px solid #143154!important;border-radius:9999px!important;padding:.7rem 1.7rem!important;font-size:1.15rem!important;font-weight:700!important;line-height:1.2;box-shadow:4px 4px 0 #143154!important;transition:transform .15s ease,box-shadow .15s ease!important}
.home-sec a[class*="from-cyan-500"],.home-sec button[class*="from-cyan-500"]{background-color:#67afcd!important;color:#fff!important}
.home-sec a[class*="from-yellow-300"],.home-sec button[class*="from-yellow-300"]{background-color:#f8d349!important;color:#143154!important}
.home-sec a[class*="from-cyan-500"]:hover,.home-sec a[class*="from-yellow-300"]:hover,.home-sec button[class*="from-cyan-500"]:hover,.home-sec button[class*="from-yellow-300"]:hover{transform:translate(-2px,-2px);box-shadow:6px 6px 0 #143154!important}
.home-sec--finder button[class*="from-"]{padding:.55rem 1.3rem!important;height:3.25rem;white-space:nowrap}
.home-sec--rewards a[class*="from-"]{border-color:#fff!important;box-shadow:4px 4px 0 rgba(0,0,0,.4)!important}

/* Newsletter: pushed below the yellow curve. */
.bat-wave--news ~ section .pt-10{padding-top:7rem!important}

@media (max-width:767px){
	.home-sec--finder > section > div{padding-top:3rem!important;padding-bottom:3rem!important}
	.home-sec--map > section > div{padding-top:4.5rem!important;padding-bottom:4.5rem!important}
	.home-sec--finder .clusters-store-search{padding:1.1rem;box-shadow:5px 5px 0 #143154}
	.home-sec--finder button[class*="from-"]{padding:.5rem 1rem!important;font-size:1.05rem!important}
	.home-sec--flavors > section > div:first-child{padding-top:5rem!important;padding-bottom:3.5rem!important}
	.home-sec--about > div:first-child{padding-top:3.5rem!important;padding-bottom:3.5rem!important}
	.home-sec--rewards > section > div{padding-top:5rem!important;padding-bottom:4rem!important}
	.home-wave{height:50px;margin-bottom:-50px}
	.home-sec--fresh{padding:1rem 1rem 3rem!important}
	.home-sec--fresh img{transform:none}
}