/* HelloFresh case study. Shared V4 chrome and typography are retained. */
.hellofresh-page{background:#eff9ec;--hf-green:#78c800;font-family:'Google Sans Flex',Arial,sans-serif}
.hellofresh-page .case-intro h1{font-size:clamp(54px,8.3vw,150px)}
.hellofresh-page .case-intro h1 span{font-family:'Google Sans Flex',Arial,sans-serif}
.hf-introduction{width:78%;max-width:1100px;margin:clamp(38px,4vw,76px) auto clamp(44px,5vw,88px);text-align:center;font-size:clamp(16px,1.35vw,23px);line-height:1.55}
.hf-introduction h2{font-size:inherit;font-weight:650;margin:0 0 1.1em}
.hf-introduction p{margin:0 auto 1.3em}
.hf-introduction .hf-disclaimer{font-size:.78em;margin-top:2.3em;color:#465044}
.hf-panel{width:84.8%;max-width:1900px;margin:0 auto clamp(36px,6.5vw,110px);background:white;border-radius:clamp(12px,1.7vw,28px);overflow:hidden}
.hellofresh-page .case-video{padding:4.2% 10.1%;box-shadow:0 20px 70px #21431508}
.hf-brief{padding:clamp(26px,5.5vw,100px)}
.hf-eyebrow{font-size:clamp(11px,1vw,16px);letter-spacing:.13em;margin:0 0 15px}
.hf-brief>div>h2{font-size:clamp(26px,3.15vw,54px);font-weight:800;letter-spacing:-.035em;line-height:1.15;color:var(--hf-green);margin:0}
.hf-brief-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,4vw,65px) 12%;margin-top:clamp(30px,5vw,80px)}
.hf-brief h3{font-size:clamp(13px,1.3vw,21px);color:#61a300;font-weight:750;margin:0 0 12px}
.hf-brief p:not(.hf-eyebrow){font-size:clamp(15px,1.25vw,21px);line-height:1.55;margin:0}
.hf-tones{display:flex;align-items:center;flex-wrap:wrap;gap:12px;margin-top:clamp(32px,5vw,80px);font-size:clamp(13px,1.2vw,19px)}
.hf-tones>span:not(:first-child){border:1px solid #18241635;border-radius:99px;padding:8px 16px}
.hf-story{padding:clamp(36px,7vw,125px) 4.8% clamp(32px,7vw,115px)}
.hf-story figure,.hf-production figure{margin:0}
.hf-story img,.hf-production img{width:100%;height:auto;display:block}
.hf-story .hf-logo{width:29%;max-width:410px;margin:0 auto clamp(42px,7vw,120px)}
.hf-scene{display:grid;grid-template-columns:1fr 1fr;gap:4%;align-items:center;margin-bottom:clamp(56px,9vw,150px)}
.hf-copy{font-size:clamp(15px,1.27vw,22px);line-height:1.55;color:#111}
.hf-copy h2{font-size:clamp(20px,1.95vw,33px);font-weight:750;letter-spacing:-.025em;line-height:1.3;margin:0 0 1.3em}
.hf-copy p{margin:0 0 1em}
.hf-copy p:last-child{margin-bottom:0}
.hf-scene .hf-copy{padding-inline:0 6%}
.hf-scene-kitchen .hf-copy{padding-inline:6% 0}
.hf-chapter{margin-top:clamp(80px,11.5vw,210px)}
.hf-chapter>.hf-copy,.hf-production>.hf-copy{max-width:1050px;width:88%;text-align:center;margin:0 auto clamp(28px,4.5vw,80px)}
.hf-pair{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(10px,1.6vw,28px)}
.hf-production{padding:clamp(36px,7.8vw,130px) 2% clamp(35px,6vw,100px)}
.hf-production .hf-motion{width:62%;margin:clamp(30px,6vw,100px) auto 0;border-radius:clamp(10px,1.2vw,22px);overflow:hidden;background:#f5f5f5}
.hf-motion video{display:block;width:100%;height:auto;aspect-ratio:16/9}
.hf-motion-enabled .hf-reveal{opacity:0;transform:translateY(40px) scale(.985);transition:opacity .85s ease,transform 1.1s cubic-bezier(.2,.75,.2,1)}
.hf-motion-enabled .hf-reveal.is-visible{opacity:1;transform:none}
@media(max-width:700px){
.hf-introduction{width:86%;font-size:16px;text-align:left}
.hf-panel{width:90%;border-radius:16px;margin-bottom:36px}
.hf-brief{padding:28px 24px}.hf-brief-grid{grid-template-columns:1fr;gap:26px}.hf-tones{gap:8px}.hf-tones>span:first-child{width:100%}
.hf-story{padding:35px 6%}.hf-story .hf-logo{width:45%;margin-bottom:42px}
.hf-scene{grid-template-columns:1fr;gap:22px;margin-bottom:60px}.hf-scene .hf-copy{padding:0}.hf-scene-kitchen .hf-copy{grid-row:1}
.hf-chapter{margin-top:80px}.hf-chapter>.hf-copy,.hf-production>.hf-copy{width:100%;text-align:left}
.hf-pair{gap:14px}.hf-cast{grid-template-columns:1fr}
.hf-production{padding:32px 6%}.hf-production .hf-motion{width:100%;margin-top:30px}
.hellofresh-page .case-video{padding:6% 4%}
}
@media(prefers-reduced-motion:reduce){.hf-motion-enabled .hf-reveal{opacity:1;transform:none;transition:none}}

/* Quiet chapter rules, centered in the existing chapter spacing. */
.hf-story .hf-chapter{position:relative}
.hf-story .hf-chapter::before{content:"";position:absolute;top:calc(clamp(80px,11.5vw,210px) / -2);left:0;right:0;border-top:1px solid rgb(0 0 0 / 6%)}
@media(max-width:700px){.hf-story .hf-chapter::before{top:-40px}}

/* Brief: full-width dividers between the heading, both rows and deliverables. */
.hf-brief{--hf-brief-pad:clamp(26px,5.5vw,100px);padding:var(--hf-brief-pad)}
.hf-brief-grid{gap:0;margin-inline:calc(-1 * var(--hf-brief-pad));margin-top:clamp(34px,4vw,64px)}
.hf-brief-grid>div{padding:clamp(28px,3vw,48px) var(--hf-brief-pad);border-top:1px solid rgb(0 0 0 / 6%)}
.hf-tones{margin:0 calc(-1 * var(--hf-brief-pad)) 0;padding:clamp(32px,3.8vw,60px) var(--hf-brief-pad) 0;border-top:1px solid rgb(0 0 0 / 6%)}
@media(max-width:700px){.hf-brief{--hf-brief-pad:24px;padding-block:32px}.hf-brief-grid>div{padding-block:28px}.hf-tones{padding-top:30px}}

/* Social extensions: original compositions and uncropped image proportions. */
.hf-social{padding:clamp(48px,8.5vw,150px) 0 clamp(60px,11vw,190px)}
.hf-social>h2{margin:0 7% clamp(48px,9vw,155px);text-align:center;font-size:clamp(24px,2.05vw,36px);font-weight:750;letter-spacing:-.025em}
.hf-social-block>h3{margin:0 0 clamp(28px,4vw,70px);font-size:clamp(18px,1.6vw,28px);font-weight:350;text-align:center}
.hf-social-block+.hf-social-block{margin-top:clamp(70px,13vw,220px)}
.hf-social figure{margin:0;min-width:0}
.hf-social img{display:block;width:100%;height:auto}
.hf-feed-grid{width:86.5%;margin:auto;display:grid;grid-template-columns:repeat(100,minmax(0,1fr));row-gap:clamp(30px,5.5vw,96px);align-items:start}
.hf-feed-1{grid-column:1/49}.hf-feed-2{grid-column:53/101}
.hf-feed-lower{grid-column:1/101;position:relative}
.hf-feed-lower .hf-feed-3{width:54%}
.hf-feed-lower .hf-feed-4{position:absolute;top:0;left:60%;width:32%}
.hf-feed-lower .hf-feed-5{position:absolute;bottom:0;left:68%;width:32%}
.hf-social-track{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1%;padding:0 1.5%;scrollbar-width:none}
.hf-social-track::-webkit-scrollbar{display:none}
.hf-slider-dots{display:none;justify-content:center;gap:0;margin-top:18px}
.hf-slider-dots button{display:grid;place-items:center;flex:0 0 36px;height:40px;padding:0;border:0;background:none;cursor:pointer}
.hf-slider-dots button::before{content:"";width:7px;height:7px;border-radius:50%;background:#ececec;transition:background .25s,transform .25s}
.hf-slider-dots button[aria-current="true"]::before{background:#95dc14;transform:scale(1.15)}
.hf-stories .hf-social-track{grid-template-columns:repeat(3,minmax(0,1fr));gap:3%;padding-inline:6%}
@media(max-width:700px){
.hf-social{padding-block:48px 60px}
.hf-social>h2{margin-bottom:42px}
.hf-social-block+.hf-social-block{margin-top:64px}
.hf-social-block>h3{margin-bottom:24px}
.hf-feed-grid{width:86%;display:flex;flex-direction:column;gap:28px}
.hf-feed-grid figure{width:100%}
.hf-feed-lower{display:flex;flex-direction:column;gap:28px;width:100%}
.hf-feed-lower .hf-feed-3,.hf-feed-lower .hf-feed-4,.hf-feed-lower .hf-feed-5{position:static;width:100%}
.hf-social-track,.hf-stories .hf-social-track{display:flex;gap:12px;overflow-x:auto;padding:6px 8% 18px;scroll-snap-type:x mandatory;scroll-padding-inline:8%;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch}
.hf-social-track>.hf-slide{flex:0 0 92%;scroll-snap-align:center;scroll-snap-stop:always}
.hf-slider-dots:not([hidden]){display:flex}
}
@media(prefers-reduced-motion:reduce){.hf-slider-dots button::before{transition:none}}