.brand-story{background:var(--black);color:var(--cream);overflow:clip}
.story-layout{display:grid;grid-template-columns:27% 45% 24%;gap:2%;align-items:center;min-block-size:clamp(210px,20vw,320px)}
.story-mascot{align-self:end;inline-size:110%;max-inline-size:none;block-size:clamp(215px,21vw,340px);object-fit:cover;object-position:top center;margin-inline-start:-8%;mix-blend-mode:screen}
.story-copy{padding-block:1.5rem}
.story-copy h2{font-size:clamp(1.8rem,3vw,2.9rem);white-space:nowrap}
.story-copy>p{font-size:clamp(.95rem,1.2vw,1.125rem);line-height:1.5;margin-block:.75rem 1rem;max-inline-size:50ch;color:var(--paper)}
.story-copy>.button,.story-details{display:table;margin-inline:auto}
.story-details summary{list-style:none}
.story-details summary::-webkit-details-marker{display:none}
.story-details[open]{display:block}
.story-details[open] p{font-size:1rem;line-height:1.5;margin-block-start:1rem}
.papa-quote{font-family:var(--font-script);font-size:clamp(1.3rem,2.5vw,2.5rem);line-height:1.2;transform:rotate(-10deg);justify-self:center;position:relative;padding-block-end:1rem;white-space:nowrap}
.papa-quote::after{content:'';position:absolute;inset-inline:10% 4%;inset-block-end:0;block-size:6px;background:var(--red);border-radius:100% 40% 90% 30%}
@media(max-width:63.999rem){.story-layout{grid-template-columns:32% 65%;gap:3%}.papa-quote{display:none}.story-copy h2{white-space:normal}.story-mascot{block-size:280px}}
@media(max-width:47.999rem){.story-layout{display:grid;grid-template-columns:1fr;padding-block-start:2rem}.story-copy{grid-row:1;text-align:center;padding-block:0 1rem}.story-copy h2{font-size:2rem}.story-copy>p{font-size:1rem;margin-block:1rem 1.3rem}.story-mascot{grid-row:2;inline-size:280px;block-size:235px;max-inline-size:100%;justify-self:center;margin:0}.papa-quote{display:none}}