@import url('https://fonts.googleapis.com/css2?family=Allura&display=swap');
/* Only the existing banner and creator signature are styled here. */
.creator-credit{gap:.75em;line-height:1.8}
.creator-credit .credit-label,.creator-credit .creator-name{font:600 .875rem/1.8 'Avenir Next','Segoe UI',Arial,sans-serif;letter-spacing:.12em;text-transform:uppercase}
.creator-credit .creator-name{font-weight:700;color:var(--deep)}
.site-footer .creator-credit .credit-label{letter-spacing:.12em}
.hero-carousel{position:relative;isolation:isolate;container-type:inline-size;min-width:0;direction:ltr;background:#211912;overflow:hidden}
/* Keep the minimum height from expanding the aspect-ratio box beyond its parent. */
.hero-viewport{position:relative;width:100%;max-width:100%;min-width:0;aspect-ratio:2.6;min-height:11.5rem;overflow:hidden;touch-action:pan-y}
.hero-slide{position:absolute;inset:0;overflow:hidden;visibility:hidden;pointer-events:none;transform:translateX(100%);transition:transform .65s cubic-bezier(.22,.61,.36,1);background:#211912}
.hero-slide.is-current{visibility:visible;transform:translateX(0)}
.hero-slide.is-entering{visibility:visible;transform:translateX(100%)}
.hero-slide.is-exiting{visibility:visible;transform:translateX(-100%)}
.hero-slide.is-settling{transition:none}
.hero-brand{display:grid;place-items:center;background:#fbfaf8}
.brand-photo .hero-logo{position:static;display:block;width:100%;height:auto;max-width:100%;max-height:100%;aspect-ratio:2.6;transform:none;object-fit:cover;object-position:center}
.hero-drink{background:#211912}
.hero-item-link,.hero-delivery{grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:minmax(0,1fr)}
.hero-delivery{display:grid}
.brand-photo .hero-drink-image{position:static;grid-column:2;grid-row:1;display:block;align-self:center;justify-self:center;width:auto;height:auto;min-width:0;min-height:0;max-width:100%;max-height:100%;aspect-ratio:auto;object-fit:contain;object-position:center;transform:none}
.hero-drink:after{content:none}
.hero-slide.is-current{pointer-events:auto}
.hero-item-link{position:absolute;inset:0;display:grid;color:inherit;text-decoration:none}
.hero-item-link:focus-visible{outline:2px solid var(--gold);outline-offset:-4px}
.hero-copy{position:absolute;z-index:1;left:6%;top:56%;transform:translateY(-42%);display:flex;flex-direction:column;gap:.6rem;width:43%;text-align:left}
.hero-drink-name{display:block;color:#fff9f0;font:600 clamp(1rem,2.4vw,1.75rem)/1.2 'Avenir Next','Segoe UI',Arial,sans-serif;font-size:clamp(1rem,4.2cqi,1.75rem);letter-spacing:.025em;text-wrap:balance;overflow-wrap:anywhere}
.hero-prices{display:flex;flex-wrap:wrap;align-items:center;gap:.25rem .8rem;font:.875rem/1.4 'Avenir Next','Segoe UI',Arial,sans-serif;color:#dfc6aa}
.hero-price{display:inline-flex;gap:.3rem;align-items:baseline;white-space:nowrap}
.hero-price strong{font-size:1em;font-weight:600;color:#fff0dc}
.hero-delivery .hero-copy{top:50%;transform:translateY(-50%);gap:.4rem}
.hero-delivery-ar{font-size:.875rem;color:#dfc6aa;text-align:left}
.hero-delivery-link{align-self:flex-start;display:inline-flex;align-items:center;justify-content:center;gap:.25rem;min-height:44px;margin-top:.25rem;padding:.4rem .65rem;border:1px solid #f3d5a866;border-radius:6px;background:#f3d5a81a;color:#f3d5a8;text-decoration:none;font-size:.875rem;line-height:1.5;text-align:center}
.hero-delivery-link:hover{background:#f3d5a82a}
.hero-controls{display:flex;align-items:center;justify-content:center;gap:6px;min-height:44px;padding-inline:4px;background:#211912;color:#e7c69d}
.hero-controls button{display:inline-flex;align-items:center;justify-content:center;flex:none;border:0;background:transparent;color:inherit;padding:0;min-width:32px;width:clamp(32px,7cqi,44px);min-height:44px;cursor:pointer;border-radius:4px}
.hero-pause{font:600 1rem/1 Arial,sans-serif}
.hero-dots{display:flex;align-items:center;direction:ltr;min-width:0}
.hero-counter{min-width:42px;font:500 .8125rem/1.4 'Avenir Next','Segoe UI',Arial,sans-serif;font-variant-numeric:tabular-nums;text-align:center;color:#d1bba6}
.hero-dot span{display:block;width:5px;height:5px;border-radius:999px;background:#b5a190;transition:width .25s,background .25s}
.hero-dot[aria-current=true] span{width:18px;background:#f3d5a8}
.hero-controls button:focus-visible{outline:2px solid var(--gold);outline-offset:-3px}
@media(max-width:700px){.hero-copy{left:5%;width:44%}}
@media(max-width:370px){.hero-delivery-link{padding-inline:.35rem}.creator-credit .credit-label,.creator-credit .creator-name{font-size:.8125rem;letter-spacing:.1em}}
@media(prefers-reduced-motion:reduce){.hero-slide,.hero-dot span{transition:none}}

/* The gold picks and light discovery labels crossfade in the same reserved space. */
.hero-best-sellers,.hero-try{position:absolute;z-index:2;left:6%;top:8%;max-width:43%;pointer-events:none;color:var(--gold,#d9ad73);font:400 clamp(1.4rem,3.3vw,2rem)/1.05 'Allura','Brush Script MT',cursive;white-space:nowrap;padding:.15em .45em .18em;background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.15);border-radius:.3em;transform-origin:left center;transform:translateY(5px) rotate(-5deg);opacity:0;visibility:hidden;transition:opacity .18s ease,transform .18s ease,visibility 0s linear .18s}

.hero-carousel.has-best-seller .hero-best-sellers{opacity:1;visibility:visible;transform:translateY(0) rotate(-5deg);transition:opacity .38s ease .22s,transform .45s cubic-bezier(.22,.61,.36,1) .22s,visibility 0s}
@media(max-width:700px){.hero-best-sellers{left:5%;top:7%;font-size:clamp(1.3rem,5.5vw,1.85rem)}}
@media(max-width:370px){.hero-best-sellers{font-size:1.2rem;top:6%}}
.hero-try{color:#fff9f0;font:italic 600 clamp(.8125rem,2.6cqi,1rem)/1.25 'Avenir Next','Segoe UI',Arial,sans-serif;letter-spacing:.015em;padding:.38em .65em;border-radius:999px;background:rgba(255,249,240,.12);border-color:rgba(255,249,240,.28);transform:translateY(6px) rotate(-3deg) scale(.96)}
.hero-carousel.has-worth-trying .hero-try{opacity:1;visibility:visible;transform:translateY(0) rotate(-3deg) scale(1);transition:opacity .34s ease .2s,transform .45s cubic-bezier(.22,.61,.36,1) .2s,visibility 0s}
@media(max-width:700px){.hero-try{left:5%;top:7%}}
@media(max-width:370px){.hero-try{top:6%}}
@media(prefers-reduced-motion:reduce){.hero-best-sellers,.hero-carousel.has-best-seller .hero-best-sellers{transform:rotate(-5deg);transition:none}.hero-try,.hero-carousel.has-worth-trying .hero-try{transform:rotate(-3deg);transition:none}}

.card.is-hero-target{outline:2px solid var(--accent);outline-offset:5px;box-shadow:0 0 0 7px #d9ad731a}
