.brand-story { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(35px, 5vw, 80px); align-items: center; padding-block: 95px; }
.brand-story-copy .eyebrow { color: var(--orange); }
.brand-story-copy h2 { font-size: clamp(36px, 3.7vw, 51px); margin-block: 19px 28px; line-height: 1.1; }
.brand-story-copy > p:not(.eyebrow) { font-size: 15px; line-height: 1.8; color: var(--muted); }
.brand-story-copy > p + p { margin-top: 17px; }
.brand-story-copy strong { color: var(--wine); font-weight: 600; }
.brand-story-copy .brand-story-signature { margin-top: 27px; font-size: 12px; }
.brand-story-signature span { display: block; font-family: var(--serif); font-size: 27px; font-style: italic; color: var(--wine); }
.brand-story-art { width: 100%; min-width: 0; }
.brand-comic-window { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px; width: 100%; }
.brand-comic-window:focus-visible { outline: 2px solid var(--orange); outline-offset: 6px; }
/* Cada quadro é uma janela sobre a arte inteira, preservada no projeto. */
.brand-comic-panel { position: relative; width: 100%; aspect-ratio: 510 / 452; overflow: hidden; border-radius: 3px; }
.brand-comic-panel img { position: absolute; width: 211.76471%; max-width: none; height: auto; }
.comic-panel-1 img { left: -3.92157%; top: -47.56637%; }
.comic-panel-2 img { left: -107.2549%; top: -47.56637%; }
.comic-panel-3 img { left: -4.11765%; top: -153.76106%; }
.comic-panel-4 img { left: -107.64706%; top: -153.76106%; }
.brand-comic-hint { display: none; }
.brand-story-art figcaption { font-size: 11px; line-height: 1.6; color: var(--muted); margin-top: 16px; text-align: center; }
@media (max-width: 999px) {
 .brand-story { grid-template-columns: 1fr; max-width: 680px; gap: 35px; padding-block: 65px; }
 .brand-story-copy h2 { font-size: clamp(35px, 5.5vw, 47px); }
 .brand-story-art { max-width: 550px; margin-inline: auto; }
}
@media (max-width: 480px) {
 .brand-story { padding-block: 50px; gap: 27px; }
 .brand-story-copy h2 { font-size: 37px; }
 .brand-story-copy > p:not(.eyebrow) { font-size: 15px; }
 .brand-story-art figcaption { font-size: 10px; }
}
@media (max-width: 600px) {
 .brand-comic-window { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: 92%; overflow-x: auto; scroll-snap-type: x mandatory; overscroll-behavior-x: contain; padding-bottom: 12px; scrollbar-width: thin; scrollbar-color: #c5a38b transparent; }
 .brand-comic-panel { scroll-snap-align: start; }
 .brand-comic-hint { display: block; margin-top: 8px; font-size: 11px; color: var(--muted); }
 .brand-comic-hint span { padding-left: 7px; color: var(--orange); }
}