.hero-picture{display:contents}
/* V1 poster composition: independent type, transparent food, and controls. */
.hero{position:relative;min-height:calc(100svh - var(--header-height));padding-block:16px 36px;display:grid;grid-template-columns:37% 1fr 26%;column-gap:24px;isolation:isolate;overflow:clip}
.hero-copy{position:relative;z-index:2;pointer-events:none}.hero-copy>*{pointer-events:auto}
.hero h1{font-size:clamp(72px,7.1vw,110px);line-height:.97;letter-spacing:-.035em;color:var(--brand);white-space:nowrap;margin:0;font-weight:700}
.hero-photo{position:absolute;z-index:0;top:-62px;bottom:-108px;left:12%;width:65%;pointer-events:none}.hero-photo img{width:100%;height:100%;max-width:none;object-fit:contain;object-position:center top;filter:saturate(1.12) contrast(1.03)}

.hero-product{margin-top:96px;max-width:370px}.hero-product h2{font-size:clamp(96px,8.8vw,136px);line-height:.95;color:var(--brand);letter-spacing:-.035em;white-space:nowrap;text-wrap:nowrap;font-weight:700}.hero-price-row{display:block;margin-top:9px}.hero-price-row strong{display:block;font-family:var(--font-display);font-size:clamp(64px,5.3vw,82px);line-height:1.06;white-space:nowrap;font-weight:700}.hero-product p{margin-top:10px;max-width:31ch;color:var(--muted);font:400 21px/1.22 var(--font-body)}

.hero-rail{grid-column:3;align-self:start;position:relative;z-index:3;margin-top:28px}.taste-previews{display:grid;gap:12px}.taste-preview{text-decoration:none;position:relative;width:100%;min-width:0;display:grid;grid-template-columns:45% 1fr;align-items:center;text-align:left;padding:8px;border:1.5px solid var(--line);border-radius:22px;overflow:hidden;background:var(--paper);height:164px}.taste-preview[aria-pressed=true]{background:var(--tint)}@media(hover:hover) and (pointer:fine){.taste-preview:hover{border-color:var(--action)}}.taste-preview img{width:100%;height:148px;object-fit:cover;object-position:20% 18%;border-radius:15px;filter:saturate(1.2) contrast(1.03)}.taste-preview>span{padding:4px 12px;font:700 28px/1.08 var(--font-interface);letter-spacing:-.02em}.taste-preview strong{display:block;font:700 42px/1.05 var(--font-interface);margin-top:10px}.taste-preview[aria-pressed=true]>span{color:var(--action)}.taste-preview[aria-pressed=true] strong{color:var(--ink)}
.all-flavors{width:100%;margin-top:14px;min-height:72px;font:700 27px/1.1 var(--font-interface);background:var(--paper);border-radius:22px;gap:16px}.all-flavors .icon{transform:rotate(-90deg);width:26px;height:26px}
@media(min-width:1001px){.hero{min-height:max(800px,calc(100svh - var(--header-height)))}.hero-photo img{transform:scale(1.08)}.hero-rail{min-width:0}}
@media(max-width:1390px) and (min-width:1001px){.hero{min-height:740px;grid-template-columns:37% 1fr 27%;column-gap:20px}.hero h1{font-size:7.2vw}.hero-product{margin-top:85px;max-width:320px}.hero-product h2{font-size:9vw}.hero-product p{font-size:19px;max-width:30ch}.taste-preview{height:148px}.taste-preview img{height:132px}.taste-preview>span{font-size:25px;padding-inline:8px}.taste-preview strong{font-size:37px}.all-flavors{min-height:64px;font-size:24px}.hero-photo{left:13%;width:64%;bottom:-70px}}
@media(max-width:1050px) and (min-width:1001px){.hero{grid-template-columns:39% 1fr 27%;min-height:700px;column-gap:12px}.hero h1{font-size:7.4vw}.hero-product p{font-size:17px;max-width:27ch}.taste-preview{grid-template-columns:42% 1fr;height:140px}.taste-preview img{height:124px}.taste-preview>span{font-size:21px}.taste-preview strong{font-size:32px}}
@media(max-width:1000px){
 .hero{padding-top:2px;padding-bottom:8px;min-height:0;display:flex;flex-direction:column;gap:0;overflow:clip}.hero-copy{display:contents}
 .hero h1{font-size:15.7vw;line-height:.91;letter-spacing:-.035em;order:0;max-width:100%;z-index:2;position:relative}
 
 
 .hero-photo{position:relative;left:auto;top:auto;bottom:auto;width:calc(100% + 32px);height:calc(61.5vw - 22px);max-height:238px;margin:0 -16px;z-index:0;order:3;overflow:visible}.hero-photo img{position:absolute;left:-7%;top:-2%;width:120%;height:124%;max-width:none;object-fit:contain;object-position:center top;transform:rotate(16deg) scale(1.1);transform-origin:center center}
 .hero-product{order:4;max-width:none;margin-top:-80px;position:relative;z-index:2;align-self:stretch;padding-top:8px;background:transparent}.hero-product h2{font-size:64px;line-height:.92;letter-spacing:-.035em;width:max-content;max-width:100%;background:var(--paper);padding:8px 14px 0 0}.hero-price-row{margin-top:10px;width:max-content;background:var(--paper);padding:0 16px 0 0}.hero-price-row strong{font-size:39px;line-height:1.06}.hero-product p{background:var(--paper);max-width:none;font-size:15px;line-height:1.22;margin-top:0;padding-top:3px;width:100%;min-height:34px}
 .hero-rail{order:5;width:100%;margin-top:12px}.taste-previews{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.taste-preview{display:flex;flex-direction:column;align-items:stretch;height:128px;min-height:0;padding:5px;border-radius:12px}.taste-preview img{height:72px;border-radius:7px;object-fit:cover;object-position:18% 16%}.taste-preview>span{font-size:16px;padding:4px 5px 0;line-height:1.05;letter-spacing:-.025em}.taste-preview strong{font-size:20px;margin-top:3px}.all-flavors{margin-top:8px;min-height:44px;border-radius:22px;font-size:20px;padding:7px 12px;gap:10px}.all-flavors .icon{width:22px;height:22px}
}
@media(max-width:360px){.hero-product h2{font-size:61px}.taste-preview>span{font-size:14px;padding-inline:3px}}

/* Close crops remain an editable CSS layer; source photographs are untouched. */
.taste-image{height:148px;overflow:hidden;border-radius:15px}.taste-image img{width:175%;height:160%;max-width:none;object-fit:cover;object-position:left 20%;border-radius:0;transform:translate(-8%,-9%)}
.hero-product h2.is-long{font-size:clamp(60px,5.4vw,84px);padding-top:36px}
@media(max-width:1390px) and (min-width:1001px){.taste-image{height:132px}.hero-product h2.is-long{padding-top:30px}}
@media(max-width:1050px) and (min-width:1001px){.taste-image{height:124px}.hero-product h2.is-long{font-size:5.6vw}}
@media(max-width:1000px){.taste-image{height:72px;flex:none;border-radius:7px}.taste-image img{width:175%;height:160%;max-width:none;transform:translate(-8%,-9%)}.hero-product h2.is-long{font-size:42px;padding-top:18px;min-height:72px}}

/* Transparent cutouts carry the contour; no photo rectangles or geometric masks. */
@media(min-width:1001px){.hero-photo{left:13%;width:65%;top:-62px;bottom:-110px}.hero-photo img{object-position:center top;transform:scale(1.12);filter:saturate(1.02) contrast(1.01)}}
@media(max-width:1000px){.hero-photo img{left:-17%;top:-5%;width:142%;height:168%;object-fit:contain;object-position:center top;transform:rotate(16deg) scale(1.04);filter:none}}

/* Reference correction: preserve the food's top contour and larger mobile close-up. */
@media(min-width:1001px){.hero{overflow:visible}.hero-photo{left:17%;width:61%;top:-52px;bottom:0;overflow:hidden}.hero-photo img{object-position:center top;transform:none}}
@media(max-width:1000px){.hero-photo{margin-top:12px;height:69.2vw;max-height:286px;clip-path:inset(-12px -32px -54px -32px)}.hero-photo img{left:-26%;top:-1%;width:170%;height:176%;transform:rotate(16deg) scale(1.08);transform-origin:50% 0}.hero-product{margin-top:-60px}.hero-product h2{font-size:68px}.hero-product p{position:relative}.hero-rail{background:var(--paper)}}

@media(min-width:1001px){.hero-photo img[data-variant="S02-C"]{transform:scaleX(-1)}}
@media(max-width:1000px){.hero-photo img[data-variant="S02-C"]{transform:rotate(16deg) scale(1.08) scaleX(-1)}}

/* The compact header leaves the food below the navigation row. */
@media(min-width:1001px){.hero-photo{top:0}}

/* Final V1 correction: readable complete tips and one curved information surface. */
.taste-image img{width:130%;height:220%;object-fit:cover;object-position:center top;transform:translate(-11.5%,-3%);filter:none}
@media(min-width:1001px){.hero-product p{max-width:290px}}
@media(max-width:1000px){
 
 
 
 .hero-photo{height:70.2vw;max-height:clamp(240px,calc(100svh - 570px),274px);clip-path:inset(-12px -32px -50px -32px)}
 .hero-photo img{top:-5%;height:122vw;max-height:475px}
 .hero-product{margin-top:-72px;padding-top:0;isolation:isolate}
 .hero-product::before{content:"";position:absolute;inset:0 -16px -1px;z-index:-1;background:var(--paper);border-top-right-radius:70% 100px}
 .hero-product h2{background:transparent;padding:0;font-size:62px;line-height:.9}
 .hero-price-row{background:transparent;padding:0}
 .hero-price-row strong{font-size:36px;line-height:1}
 .hero-product p{background:transparent;font-size:14px;line-height:1.12;min-height:32px;padding-top:2px;max-width:34ch}
 .hero-rail{margin-top:4px}
 .taste-preview{height:116px}
 .taste-image{height:60px}
 .all-flavors{margin-top:4px}
 .taste-image img{width:130%;height:220%;object-fit:cover;object-position:center top;transform:translate(-11.5%,-3%)}
 .hero-product h2.is-long{font-size:42px;line-height:1.33;min-height:0;padding-top:0}
}

/* Open-licensed display face has tighter side bearings than the sketch font. */
.hero h1,.hero-product h2{letter-spacing:0}

/* A compact tablet uses the same clear vertical showcase as the phone. */
@media(min-width:761px) and (max-width:1000px){
 .hero{max-width:640px}
 .hero h1{font-size:100px}
 .hero-photo{max-height:274px}
 .taste-preview{height:144px}
 .taste-image{height:88px}
 .taste-preview>span{font-size:19px}
 .taste-preview strong{font-size:23px}
 .all-flavors{min-height:52px;font-size:23px}
}
