/* Diagramação dos cases: texto em uma coluna, mídia em conjuntos proporcionais. */
:root{--gx:var(--margem-pagina);--vao-texto-foto:clamp(32px,5vmin,64px);--main:min(720px,100% - 2*var(--margem-pagina))}
.chapter h3,.anniv-copy h3,.result h2{font-size:clamp(28px,3.2vw,36px);font-weight:800;line-height:1.14;letter-spacing:-.02em;text-wrap:balance}
.chapter h4{font-size:clamp(25px,2.8vw,32px);line-height:1.18;text-wrap:balance}
.chapter-deck,.sub p,.anniv-copy .chapter-deck,.result-copy{font-size:19px;line-height:1.65;text-align:left;hyphens:none;-webkit-hyphens:none}
.chapter-head .ch-body{display:grid;grid-template-columns:1fr;gap:22px;width:100%;justify-items:stretch}
.chapter-head .chapter-deck,.chapter-head h3{width:100%;margin:0}
.chapter-head,.sub,.result-head{width:var(--main)}
.chapter .chapter-head{margin-bottom:0}
.chapter{padding-top:var(--vao-blocos)}
.chapter-media,#cap-01 .chapter-media{margin-top:var(--vao-texto-foto)}
.sub{margin-top:var(--vao-blocos);padding:0}
.sub p{margin-top:22px}
/* Aberturas com marca, título e texto no mesmo eixo da SKULL. */
#cap-03{padding-top:var(--vao-blocos)}
.anniv-intro,.coala-intro,.expo-intro{
  min-height:0;padding:0 var(--margem-pagina);gap:0;overflow:visible;
}
.anniv-intro:after{display:none}
.anniv-hero,.coala-intro .anniv-hero,.expo-intro .anniv-hero{
  display:grid;grid-template-columns:minmax(0,1fr);justify-items:center;gap:32px;
}
.anniv-brand{align-items:center}
.anniv-logo{width:clamp(220px,22vw,310px)}
.anniv-copy,.coala-intro .anniv-copy,.expo-intro .anniv-copy{
  width:min(720px,100%);max-width:none;margin:0 auto;gap:22px;justify-items:stretch;
}
.anniv-copy .chapter-deck{max-width:none;width:100%;margin:0}
.anniv-copy h3{margin:0}
.chapter-film{width:calc(100% - 2*var(--margem-pagina));max-width:1200px;margin:var(--vao-texto-foto) auto 0}
.chapter-film video{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:contain}
.anniv-break{display:none}
/* Conjuntos de campanha: retirar molduras e manter as proporções dos originais. */
.m18,.festa-films,.festa-photos{max-width:none;padding:0 var(--margem-pagina);margin:var(--vao-texto-foto) auto 0}
.m18+.m18{margin-top:var(--vao-texto-foto)}
.m18-tile,.ff-tile,.fp-tile,.fp-empena{border:0;border-radius:0;box-shadow:none}
.m18-prodrow{margin:0}
.m18-prodrow-imgs,.m18-stories-row,.m18-row1,.ff-grid{gap:var(--vao-fotos)}
/* Os stories dos creators são prova de volume, não peça pra ler: os oito numa fileira (19/09). */
.m18-stories-row{max-width:1120px;margin-inline:auto;width:100%;grid-template-columns:repeat(8,minmax(0,1fr))}
.m18-stories-row .m18-tile{aspect-ratio:560/1020}
.m18-stories-row .m18-tile img{object-fit:contain}
.m18-row1{height:auto;grid-template-columns:repeat(4,minmax(0,1fr));max-width:1120px;margin:auto}
.m18-row1 .m18-tile{aspect-ratio:9/16;width:100%;height:auto}
.m18-row1 .m18-tile>video,.m18-row1 .m18-tile>img{object-fit:contain}
.m18-grid{gap:24px}
.fp-empena{aspect-ratio:auto}
.fp-empena img{height:auto}
.fp-masonry{display:grid;gap:var(--vao-fotos);column-count:auto}
.fp-masonry .gal{align-items:start}
.fp-masonry .fp-tile{margin:0;min-width:0}
.fp-masonry .fp-tile img{height:auto;width:100%}
.collab-fotos{width:100%;max-width:none;margin-top:28px;padding-inline:var(--margem-pagina)}
/* Legendas são parte do fluxo, fora da área clicável dos vídeos. */
.chapter-media.media-row{
  width:min(calc(100% - 2*var(--margem-pagina)),calc(min(56svh,560px)*var(--row-ratio) + var(--vao-fotos)*var(--row-gaps)));
  margin-inline:auto;padding:0;grid-template-columns:var(--media-cols);align-items:start;
}
.chapter-media.media-row .media{aspect-ratio:auto;background:none;min-width:0;overflow:visible}
.chapter-media.media-row .media>img{position:static;width:100%;height:auto;object-fit:contain}
.chapter-media.media-row .media>.tile-poster,.chapter-media.media-row .media>.local-player{position:relative;inset:auto;display:block;width:100%;aspect-ratio:var(--piece-ratio)}
.chapter-media.media-row .tile-poster img{object-fit:contain}
.chapter-media.media-row .media-caption{margin-top:14px}
.chapter-media.media-row .media-caption strong{font-size:14px}
.chapter-media.media-row.single{width:min(720px,100% - 2*var(--margem-pagina))}
.chapter-media.single .media>img{max-height:none}
/* Marcha e números usam a mesma coluna, com as duas evidências juntas abaixo. */
.screen-one{min-height:0;padding-top:var(--vao-blocos)}
.marcha-grid{width:100%;grid-template-columns:repeat(2,minmax(0,270px));justify-content:center;gap:var(--vao-texto-foto) 24px}
.marcha-side{grid-column:1/-1;grid-row:1;width:min(720px,calc(100vw - 2*var(--margem-pagina)));max-width:none;justify-self:center;gap:22px}
.marcha-side h3,.marcha-side .chapter-deck{margin:0}
.m-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:8px}
.m-stat b{font-size:30px}
.m-stat span{font-size:13px}
.m-note{margin:0;padding-top:16px}
/* A ativação segue o capítulo, com título e texto legíveis no mesmo fundo. */
.vm-act{margin:var(--vao-blocos) auto 0;padding:0 var(--margem-pagina);max-width:none;background:none;border-radius:0;color:var(--white)}
.vm-head{width:min(720px,100%);margin:auto;grid-template-columns:1fr;gap:22px}
.vm-title h4{max-width:none;color:var(--white)}
.vm-deck{max-width:none;font-size:19px;line-height:1.65;color:var(--muted)}
.vm-badge{justify-self:center;transform:none;box-shadow:none;background:none;padding:0;color:var(--white);font-size:24px}
.vm-cols{margin-top:var(--vao-texto-foto);gap:var(--vao-fotos);max-width:1200px;margin-inline:auto}
.vm-stats,.capstats{margin-top:40px}
.vm-stat b{color:var(--white)}
.vm-stat span{color:var(--muted)}
.capstats{padding-inline:var(--margem-pagina)}
.capstats-row{max-width:1120px;margin:auto}
@media(max-width:860px){
  :root{--vao-blocos:64px;--vao-texto-foto:32px}
  .chapter h3,.anniv-copy h3,.result h2{font-size:28px;text-align:left}
  .chapter h4{font-size:25px;text-align:left}
  .chapter-deck,.sub p,.anniv-copy .chapter-deck,.result-copy,.vm-deck{font-size:18px}
  .anniv-copy,.coala-intro .anniv-copy,.expo-intro .anniv-copy{width:100%}
  .anniv-hero,.coala-intro .anniv-hero,.expo-intro .anniv-hero{gap:28px}
  .chapter-film{width:calc(100% - 2*var(--margem-pagina))}
  .marcha-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 12px}
  .marcha-grid .iphone{max-width:270px;padding:7px;border-radius:24px}
  .marcha-grid .phone-screen{border-radius:18px}
  .marcha-side{width:100%}
  .m-stats{grid-template-columns:repeat(2,1fr);gap:20px}
  .m18-row1{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .m18-stories-row{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
  .m18-row1 .m18-tile{grid-column:auto;grid-row:auto;height:auto;aspect-ratio:9/16}
  .m18-stories-row .m18-tile{aspect-ratio:560/1020}
  .fp-masonry .gal{flex-wrap:nowrap;gap:10px}
  .fp-masonry .fp-tile img{min-width:0}
  .chapter-media.media-row{width:calc(100% - 2*var(--margem-pagina));grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 12px}
  .chapter-media.media-row.single{max-width:560px;grid-template-columns:1fr}
  .chapter-media.media-row.trio .media:first-child{grid-column:1/-1}
  .chapter-media.media-row .media-caption{margin-top:10px}
  .vm-badge{justify-self:start;text-align:left}
  .vm-cols{gap:28px}
  .capstats-row{gap:24px}
}

/* A sombra antiga dos cards não deve cobrir as legendas no fluxo. */
.chapter-media.media-row .media:after{display:none}
.chapter-media.media-row .is-playing .media-caption{opacity:1;visibility:visible}
.chapter-media.media-row .local-player{object-fit:contain;height:auto}
@media(max-width:860px){
  .ig-duo{grid-template-columns:minmax(0,1fr)}
  .ig-col,.ig-duo .iphone,.ig-duo .ig-screen{min-width:0;max-width:100%}
  .ig-duo .ig-head{gap:10px;padding-inline:10px}
  .ig-duo .ig-avatar{width:54px;height:54px}
  .ig-duo .ig-stats{column-gap:6px;min-width:0}
  .ig-duo .ig-stats b{font-size:13px}
  .ig-duo .ig-actions{padding-inline:10px}
  .ig-duo .ig-actions span{font-size:10px}
}

/* V3: abertura editorial e títulos fora da coluna do relato. */
:root{--case-measure:min(1200px,calc(100% - 2*clamp(24px,5vw,80px)))}
.intro{padding:clamp(64px,7vw,110px) 0}
.intro-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:48px 28px;width:var(--case-measure);align-items:start}
.intro-brand{grid-column:1/5;grid-row:1;align-self:start}
.intro-logo{width:min(100%,330px);margin-top:0}
.intro-copy{display:contents}
.intro-copy p,.intro-copy p+p{margin:0;max-width:none;font-size:18px;line-height:1.6;letter-spacing:0;font-weight:400}
.intro-copy p:first-child{grid-column:5/13;grid-row:1;font-size:clamp(28px,3vw,42px);line-height:1.18;letter-spacing:-.035em;font-weight:600}
.intro-copy p:nth-child(2){grid-column:1/5;grid-row:2}
.intro-copy .intro-out{grid-column:5/9;grid-row:2;font-size:26px;font-weight:600;line-height:1.25;letter-spacing:-.025em;color:var(--red)}
.intro-copy p:last-child{grid-column:9/13;grid-row:2}
.chapter-head,.sub,.result-head{width:var(--case-measure);padding:0;margin-inline:auto}
.chapter-head .ch-body,#cap-01 .ch-body,.sub,.result-head{display:grid;grid-template-columns:minmax(0,.78fr) minmax(0,1.22fr);grid-template-areas:none;gap:24px clamp(36px,6vw,100px);align-items:start}
.chapter h3,.chapter h4,.result h2{font-size:clamp(34px,3.6vw,52px);font-weight:700;line-height:1.04;letter-spacing:-.035em;text-align:left;max-width:none;margin:0;text-wrap:balance}
.chapter-head .chapter-deck,.sub p,.result-copy{margin:0;max-width:none;font-size:19px;line-height:1.6}
.chapter-head .ch-body>h3,#cap-01 .ch-body>h3{grid-column:1;grid-row:1;max-width:none}
.chapter-head .ch-body>.chapter-deck,#cap-01 .ch-body>.chapter-deck{grid-column:2;grid-row:1;max-width:none}
.anniv-intro,.coala-intro,.expo-intro{padding:0}
.anniv-hero,.coala-intro .anniv-hero,.expo-intro .anniv-hero{width:var(--case-measure);margin-inline:auto;grid-template-columns:minmax(0,.78fr) minmax(0,1.22fr);gap:clamp(36px,6vw,100px);align-items:start;justify-items:stretch}
.anniv-brand{align-items:flex-start;justify-content:flex-start}
.anniv-logo{width:min(100%,340px)}
.anniv-copy,.coala-intro .anniv-copy,.expo-intro .anniv-copy{width:100%;margin:0;gap:24px}
.anniv-copy h3{font-size:clamp(36px,3.8vw,54px);line-height:1.04;text-align:left}
.coala-intro .cobrand-logo,.expo-intro .cobrand-logo{max-width:40%;height:auto;max-height:90px;object-fit:contain}
.cobrand{justify-content:flex-start;width:100%;gap:20px}
.result-head{align-items:start}
@media(max-width:860px){
  :root{--case-measure:calc(100% - 2*var(--margem-pagina))}
  .intro-grid{grid-template-columns:1fr;gap:28px}
  .intro-brand,.intro-copy p:first-child,.intro-copy p:nth-child(2),.intro-copy .intro-out,.intro-copy p:last-child{grid-column:1;grid-row:auto}
  .intro-logo{width:210px}
  .intro-copy p:first-child{font-size:30px}
  .intro-copy .intro-out{font-size:25px;max-width:26ch}
  .chapter-head .ch-body,#cap-01 .ch-body,.sub,.result-head,.anniv-hero,.coala-intro .anniv-hero,.expo-intro .anniv-hero{grid-template-columns:1fr;gap:24px}
  .chapter-head .ch-body>h3,.chapter-head .ch-body>.chapter-deck,#cap-01 .ch-body>h3,#cap-01 .ch-body>.chapter-deck{grid-column:1;grid-row:auto}
  .chapter h3,.chapter h4,.result h2,.anniv-copy h3{font-size:34px;max-width:20ch;text-align:left}
  .chapter-head .chapter-deck,.sub p,.result-copy{font-size:18px}
  .anniv-logo{width:min(280px,80%)}
  .cobrand{max-width:330px}
}

/* Briefing claro; a narrativa seguinte retoma o fundo preto do case. */
.intro{background:#fff;color:#151515;border:0;padding-bottom:clamp(48px,5vw,72px)}
#briefing .intro-logo{filter:brightness(0)}
.intro-copy p{color:#3d3d3d}
.intro-copy p:first-child{color:#151515}
.intro-copy .intro-out{color:var(--red)}
.intro-copy p::selection{background:var(--red);color:#fff}
.hero:before{content:"";position:absolute;inset:auto 0 0;height:160px;background:linear-gradient(transparent,var(--black));z-index:2;pointer-events:none}
#cap-01{background:var(--black);padding-top:clamp(48px,5vw,72px)}
#briefing,.chapter{scroll-margin-top:76px}
@media(max-width:860px){
  :root{--margem-pagina:clamp(20px,5.5vw,28px)}
  .intro{padding-top:40px;padding-bottom:48px}
  .intro-grid{gap:24px}
  .intro-logo{width:176px;max-width:55vw}
  .intro-copy p:first-child{font-size:clamp(24px,6.8vw,28px);line-height:1.22;letter-spacing:-.025em}
  .intro-copy p{font-size:17px;line-height:1.6}
  .intro-copy .intro-out{font-size:23px;line-height:1.3;max-width:none}
  .chapter h3,.chapter h4,.result h2,.anniv-copy h3{font-size:clamp(28px,7.7vw,34px);line-height:1.12}
  .top{height:calc(54px + env(safe-area-inset-top));padding-top:env(safe-area-inset-top)}
  .top .left,.top .right,.top .center>a{display:flex;align-items:center;min-height:44px}
  .top .right{justify-content:flex-end}
  .filme-play{bottom:max(24px,env(safe-area-inset-bottom))}
}

.hero .filme-play.behind-nav{visibility:hidden;pointer-events:none}

/* Marcha: relato, números e as duas evidências no mesmo quadro. */
#cap-02 .marcha-grid{width:var(--case-measure);padding:0;gap:28px;align-items:start;grid-template-columns:minmax(0,1.15fr) repeat(2,minmax(0,1fr))}
#cap-02 .marcha-side{width:100%;max-width:none;gap:20px;justify-self:stretch}
#cap-02 .marcha-side h3{font-size:clamp(30px,2.8vw,40px);line-height:1.08;max-width:22ch}
#cap-02 .chapter-deck{font-size:18px;line-height:1.55}
#cap-02 .m-stats{gap:16px;margin:0}
#cap-02 .m-stat b{font-size:30px}
#cap-02 .m-stat span{font-size:12px;line-height:1.4;margin-top:7px}
#cap-02 .m-note{font-size:12px;line-height:1.5;margin:0;padding-top:14px}
#cap-02 .iphone{box-shadow:none;max-width:260px;justify-self:center}
#cap-02 .ticker{margin-top:32px}
@media(min-width:1200px){
  #cap-02 .marcha-side{grid-column:1;grid-row:1;padding-right:12px}
  #cap-02 .iphone{grid-row:1}
  #cap-02 .m-stats{grid-template-columns:repeat(4,minmax(0,1fr))}
}
@media(max-width:1199px){
  #cap-02 .marcha-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 12px}
  #cap-02 .marcha-side{grid-column:1/-1;grid-row:1;gap:18px}
  #cap-02 .marcha-side h3{font-size:clamp(28px,6.8vw,36px);max-width:24ch}
  #cap-02 .chapter-deck{font-size:17px}
  #cap-02 .m-stats{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
  #cap-02 .iphone{grid-row:2;padding:7px;border-radius:24px}
  #cap-02 .post-screen,#cap-02 .phone-screen{border-radius:18px}
  #cap-02 .post-head{gap:5px;padding-inline:7px;font-size:10px}
  #cap-02 .post-head img{width:20px;height:20px}
}

/* A prévia abre o filme completo em HD e com áudio no player do case. */
#aftermovie-18{position:relative;scroll-margin-top:76px}
.chapter-play{position:absolute;right:24px;bottom:24px;z-index:3;display:flex;align-items:center;justify-content:center;gap:12px;min-height:48px;padding:12px 18px;border:1px solid rgba(255,255,255,.6);border-radius:999px;background:rgba(0,0,0,.78);color:#fff;font:600 14px/1.3 var(--sans);text-transform:none;cursor:pointer}
.chapter-play:before{content:"";width:0;height:0;border-top:6px solid transparent;border-bottom:6px solid transparent;border-left:10px solid currentColor;flex:none}
.chapter-play:hover{background:#fff;color:#000}
.chapter-play:focus-visible{outline:3px solid #fff;outline-offset:4px}
@media(max-width:860px){.chapter-play{right:12px;bottom:12px;min-height:44px;padding:10px 14px;font-size:12px;gap:10px}}

/* Manifesto e landing: um conjunto de campanha com o mesmo peso visual. */
.digital-showcase{width:var(--case-measure);max-width:1120px;margin:clamp(48px,6vw,80px) auto 0;display:grid;grid-template-columns:minmax(0,.94fr) minmax(0,2fr);gap:clamp(24px,3vw,40px);align-items:start;scroll-margin-top:100px;font-family:var(--sans);text-transform:none}
.digital-showcase figure{margin:0}
.digital-showcase h4{font:600 20px/1.25 var(--sans);letter-spacing:-.02em;margin:0;color:var(--white)}
.manifesto-preview,.landing-preview{min-width:0}
.manifesto-play{position:relative;display:block;width:100%;aspect-ratio:9/16;padding:0;border:0;overflow:hidden;background:var(--black);color:#fff;cursor:pointer}
.digital-showcase .manifesto-play{border-radius:0}
.digital-showcase .digital-caption{margin:18px 0 0;display:block}
.digital-caption p{margin:8px 0 0;font:400 13px/1.6 var(--sans);letter-spacing:0;text-transform:none;color:var(--muted)}
.manifesto-results span{white-space:nowrap}
.landing-mosaic{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;align-items:start}
.landing-screen-main{grid-column:1/-1}
.landing-screen button{position:relative;display:block;width:100%;padding:0;border:0;background:none;cursor:zoom-in}
.landing-screen img{display:block;width:100%;height:auto}
.landing-screen .photo-expand{opacity:0;transition:opacity .2s}
.landing-screen button:hover .photo-expand,.landing-screen button:focus-visible .photo-expand{opacity:1}
.digital-showcase button:focus-visible{outline:2px solid var(--white);outline-offset:4px}
@media(max-width:700px){
  .digital-showcase{grid-template-columns:1fr;gap:36px;margin-top:40px}
  .manifesto-preview{width:100%;max-width:none;justify-self:stretch}
  .manifesto-play{width:100%;margin:0}
  .digital-showcase .digital-caption{margin-top:14px}
  .digital-showcase h4{font-size:20px}
  .landing-mosaic{gap:8px}
}
/* Os filmes têm prévias leves; os originais só entram ao apertar play. */
.film-selection{scroll-margin-top:80px}
.film-selection-head{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:20px}
.film-selection h4{font:600 22px/1.2 var(--sans);letter-spacing:-.025em;text-transform:none;max-width:none;margin:0}
.feed-toggle{flex:none;min-height:44px;padding:10px 0;border:0;border-bottom:1px solid #555;background:transparent;color:var(--muted);font:400 13px/1.3 var(--sans);cursor:pointer}
.feed-toggle:hover{color:var(--white)}
.film-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(20px,3vw,44px)}
.film-card{margin:0;min-width:0}
.film-watch{position:relative;display:block;width:100%;aspect-ratio:16/9;overflow:hidden;padding:0;border:0;border-radius:4px;background:#111;color:#fff;cursor:pointer}
.film-watch video{display:block;width:100%;height:100%;object-fit:cover;pointer-events:none}
.film-watch:after{content:"";position:absolute;inset:40% 0 0;background:linear-gradient(transparent,rgba(0,0,0,.7));pointer-events:none}
.hero .filme-play,.chapter-play,.film-watch-action{text-transform:none;letter-spacing:0}
.film-watch-action{position:absolute;inset:auto 24px 24px;z-index:1;display:flex;align-items:center;justify-content:flex-end;gap:14px;font:600 15px/1.3 var(--sans);text-align:left;text-transform:none;letter-spacing:0;text-shadow:0 1px 6px #000}
.film-play-icon{display:grid;place-items:center;flex:none;width:58px;height:58px;padding-left:3px;border:1px solid rgba(255,255,255,.85);border-radius:50%;background:#fff;color:#000;font-size:19px;text-shadow:none;transition:transform .2s ease}
.film-watch:hover .film-play-icon{transform:scale(1.08)}
.film-selection button:focus-visible{outline:3px solid var(--white);outline-offset:5px}
.film-caption{display:flex;justify-content:space-between;align-items:start;gap:16px;margin-top:18px;font-family:var(--sans);text-transform:none}
.film-caption p{margin:8px 0 0;font:400 14px/1.5 var(--sans);color:var(--muted)}
.film-duration{flex:none;text-align:right;font:400 13px/1.3 var(--sans);color:var(--white);padding-top:3px}
.film-duration span{display:block;margin-top:7px;font-size:11px;color:var(--muted)}
@media(max-width:860px){
  .film-grid{grid-template-columns:1fr;gap:32px}
  .film-selection-head{gap:12px;margin-bottom:18px}
  .film-selection h4{font-size:20px}
  .film-selection-head h4{font-size:18px}
  .feed-toggle{font-size:11px}
  .film-watch-action{inset:auto 16px 16px;gap:12px;font-size:13px}
  .film-play-icon{width:46px;height:46px;font-size:16px}
  .film-caption{gap:12px;margin-top:14px}
  .film-caption p{font-size:13px;max-width:28ch}
}
@media(prefers-reduced-motion:reduce){.film-play-icon{transition:none}}

/* A projeção participa da galeria, junto da festa, em vez de ocupar uma tela. */
.festa-photos.party-gallery{width:100%;max-width:1520px;margin:28px auto 0;scroll-margin-top:80px}
.party-photo-grid{display:grid;gap:12px}
.party-photo-row{display:flex;align-items:start;gap:12px}
.party-photo{flex:var(--photo-ratio) 1 0%;min-width:0;margin:0}
.party-photo button{position:relative;display:block;width:100%;padding:0;border:0;border-radius:0;background:transparent;color:#fff;cursor:zoom-in}
.party-photo img{display:block;width:100%;height:auto}
.photo-expand{position:absolute;right:8px;bottom:8px;display:grid;place-items:center;width:32px;height:32px;background:rgba(0,0,0,.65);border-radius:50%;font:400 20px/1 var(--sans);opacity:0;transition:opacity .2s}
.party-photo button:hover .photo-expand,.party-photo button:focus-visible .photo-expand{opacity:1}
/* a seta é desenho, não letra: o iPhone trocava o ↗ por emoji (22/09/2026). Mesmo traço da orelha do /caiote */
.photo-expand svg{display:block;width:1em;height:1em}
.party-photo button:focus-visible{outline:2px solid var(--white);outline-offset:4px}
.party-photo-note{margin:8px 0 4px;color:var(--muted);font:400 13px/1.5 var(--sans);text-transform:none}
@media(max-width:860px){
 .party-photo-grid{display:block;columns:2;column-gap:10px}
 .party-photo-row{display:contents}
 .party-photo{display:block;break-inside:avoid;margin-bottom:10px}
 .party-projection{column-span:all;width:100%;margin:0 0 16px}
 .party-photo-note{margin:8px 0 0;font-size:12px;max-width:38ch}
 .photo-expand{opacity:1;width:28px;height:28px;font-size:17px;right:6px;bottom:6px}
}

/* Consistência do restante do case: canal sem monitor e Expo compacta no celular. */
#cap-08 .crt{width:100%;padding:0;border:0;border-radius:4px;background:none;box-shadow:none}
#cap-08 .crt-screen{border:1px solid #292929;border-radius:4px;box-shadow:none}
#cap-08 .crt-screen:before,#cap-08 .crt-screen:after,#cap-08 .crt-chin,#cap-08 .crt-foot,#cap-08 .crt-base{display:none}
@media(max-width:860px){
 #cap-05 .collab-fotos .gal{display:block;columns:2;column-gap:10px}
 #cap-05 .collab-fotos .gal img{width:100%;height:auto;break-inside:avoid;margin-bottom:10px}
}

/* Coala: filme da marca, ativação, resultados e fotos na mesma sequência. */
.coala-showcase{width:var(--case-measure);max-width:1120px;margin:0 auto;display:grid;grid-template-columns:minmax(0,340px) minmax(0,640px);justify-content:center;gap:clamp(32px,5vw,72px);align-items:center;scroll-margin-top:96px}
.coala-film{grid-column:1;grid-row:1;margin:0;min-width:0}
.coala-story{grid-column:2;grid-row:1;min-width:0}
.coala-cobrand{width:min(100%,300px);gap:20px;margin:0 0 28px;justify-content:flex-start}
.coala-cobrand .cobrand-logo{width:auto;max-width:42%;height:52px;object-fit:contain}
.coala-cobrand .cobrand-x{font-size:20px}
.coala-cobrand .cobrand-coala{height:44px}
.coala-film .film-watch{aspect-ratio:9/16}
.coala-film .film-watch-action{inset:auto 16px 20px;justify-content:center;font-size:13px;gap:12px}
.coala-film .film-play-icon{width:48px;height:48px;font-size:17px}
.coala-film-caption{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:4px 14px;margin-top:10px;font:400 12px/1.5 var(--sans);color:var(--muted);text-transform:none}
.coala-story h3{font-size:clamp(30px,3.1vw,42px);line-height:1.12;max-width:22ch;margin:0;text-wrap:balance}
.coala-story>p{margin:22px 0 0;font:400 18px/1.6 var(--sans);color:var(--muted);text-transform:none;max-width:none}
.coala-numbers,.result-numbers{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px;margin:28px 0 0;font-family:var(--sans);text-transform:none}
.coala-numbers>div,.result-numbers>div{display:flex;flex-direction:column;gap:10px;border-top:1px solid #333;padding-top:18px;min-width:0}
.coala-numbers dt,.result-numbers dt{order:2;font-size:14px;line-height:1.45;color:var(--muted);max-width:28ch}
.coala-numbers dd{margin:0;font-size:40px;font-weight:600;line-height:1.1;letter-spacing:-.035em}
.coala-story .coala-engagement{font-size:12px;line-height:1.65;margin-top:20px}
.coala-photos{width:var(--case-measure);max-width:1052px;margin:28px auto 0;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px;scroll-margin-top:80px}
.coala-photos .vm-shot:nth-child(-n+3){grid-column:span 2}
.coala-photos .vm-shot{aspect-ratio:2/3;border-radius:0;cursor:zoom-in}
.coala-photos .vm-shot img{height:auto;object-fit:contain;transform:none}
.coala-photos .vm-shot:focus-visible{outline:2px solid var(--white);outline-offset:4px}
/* Resultados dos capítulos e do case: números legíveis, rótulos no fluxo. */
#cap-05 .capstats{width:var(--case-measure);padding:0;margin:32px auto 0}
#cap-05 .capstats-row{max-width:none;gap:24px}
#cap-05 .capstat{padding-top:20px;gap:12px}
#cap-05 .capstat b{font-size:40px;line-height:1.1}
#cap-05 .capstat span{font:400 14px/1.5 var(--sans);text-transform:none;letter-spacing:0;color:var(--muted)}
.case-results .result-head{display:block;margin-bottom:28px}
.case-results .result-numbers{width:var(--case-measure);margin:0 auto;grid-template-columns:repeat(3,minmax(0,1fr));gap:36px 32px}
.result-numbers dd{margin:0;font-size:clamp(30px,3.2vw,46px);font-weight:600;line-height:1.15;letter-spacing:-.035em}
.result-numbers dd small{display:block;margin-bottom:5px;font-size:18px;font-weight:400;letter-spacing:0;color:var(--muted)}
@media(max-width:860px){
 .coala-showcase{grid-template-columns:1fr;gap:28px;margin-top:0}
 .coala-story{grid-column:1;grid-row:1}
 .coala-film{grid-column:1;grid-row:2;width:100%;max-width:420px;justify-self:center}
 .coala-cobrand{margin-bottom:22px;width:260px}
 .coala-story h3{max-width:22ch;font-size:30px}
 .coala-story>p{font-size:17px;margin-top:18px}
 .coala-numbers{gap:22px 16px;margin-top:24px}
 .coala-numbers dd{font-size:34px}
 .coala-numbers dt{font-size:13px}
 .coala-photos{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
 .coala-photos .vm-shot:nth-child(-n+3){grid-column:auto}
 #cap-05 .capstats-row{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 16px}
 #cap-05 .capstat b{font-size:34px}
 #cap-05 .capstat span{font-size:13px}
 .case-results .result-numbers{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 18px}
 .result-numbers dd{font-size:clamp(26px,7vw,34px)}
 .result-numbers dt{font-size:13px}
}

/* Plataforma: captura real da loja dentro de um monitor de mesa. */
#cap-07{width:var(--case-measure);margin-inline:auto;display:grid;grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);gap:clamp(28px,4vw,64px);align-items:center}
#cap-07 .chapter-head{width:100%;min-width:0}
#cap-07 .ch-body{grid-template-columns:1fr;gap:24px}
#cap-07 .ch-body>h3,#cap-07 .ch-body>.chapter-deck{grid-column:1;grid-row:auto}
.commerce-preview{width:100%;min-width:0;margin:0}
.monitor-shell{padding:7px 7px 0;border:1px solid #77777b;border-radius:12px 12px 5px 5px;background:#171719;box-shadow:0 12px 35px #0008;overflow:hidden}
.monitor-screen{position:relative;display:block;width:100%;aspect-ratio:16/10;padding:0;border:0;background:#f4f0ea;overflow:hidden;cursor:zoom-in;text-align:left}
.monitor-screen img{display:block;width:100%;height:auto;max-width:none;animation:commerce-scroll 12s ease-in-out infinite alternate;animation-play-state:paused;will-change:transform}
.commerce-preview.in .monitor-screen img{animation-play-state:running}
.commerce-preview.in .monitor-screen:focus-visible img{animation-play-state:paused}
.monitor-screen:focus-visible{outline:3px solid #fff;outline-offset:-3px}
.monitor-screen .photo-expand{opacity:1;background:#000a;color:#fff;z-index:1}
.monitor-chin{height:clamp(14px,1.5vw,22px);margin:0 -7px;background:linear-gradient(105deg,#adadb0,#d4d4d6 50%,#929297)}
.monitor-support:before{content:"";display:block;width:18%;height:clamp(24px,3vw,40px);margin:0 auto;background:linear-gradient(#69696d,#b7b7bb);clip-path:polygon(14% 0,86% 0,100% 100%,0 100%)}
.monitor-support:after{content:"";display:block;width:38%;height:6px;margin:0 auto;background:linear-gradient(#d4d4d6,#78787d);border-radius:50% 50% 3px 3px}
.commerce-preview figcaption{margin:20px 0 0;text-align:center;font:400 13px/1.5 var(--sans);letter-spacing:0;text-transform:none;color:var(--muted)}
@keyframes commerce-scroll{from{transform:translateY(0)}to{transform:translateY(-17%)}}
@media(prefers-reduced-motion:reduce){.monitor-screen img{animation:none;will-change:auto}}
@media(max-width:860px){
 #cap-06 .chapter-media.media-row{grid-template-columns:1fr;gap:28px}
 #cap-07{grid-template-columns:1fr;gap:32px}
 .monitor-shell{padding:5px 5px 0;border-radius:8px 8px 3px 3px}
 .monitor-chin{margin-inline:-5px}
 .commerce-preview figcaption{margin-top:14px}
}

/* Expo: motion vertical ao lado do relato, em uma única abertura. */
.expo-overview{width:var(--case-measure);margin-inline:auto;display:grid;grid-template-columns:minmax(0,300px) minmax(0,640px);justify-content:center;gap:clamp(36px,6vw,96px);align-items:center;scroll-margin-top:80px}
.expo-motion{width:100%;margin:0;aspect-ratio:9/16;background:transparent}
.expo-motion video{display:block;width:100%;height:100%;object-fit:contain}
.expo-story{display:grid;gap:24px;min-width:0}
.expo-story .expo-cobrand{display:flex;justify-content:flex-start;align-items:center;gap:20px;width:300px;max-width:100%;margin:0}
.expo-story .cobrand-logo{width:auto;max-width:44%;height:auto;max-height:72px;object-fit:contain}
.expo-story .expo-cobrand-logo{max-width:28%;max-height:78px}
.expo-story h3{font-size:clamp(32px,3.1vw,44px);line-height:1.1;margin:0;max-width:22ch}
.expo-story .chapter-deck{font-size:18px;line-height:1.6;margin:0;max-width:none}
@media(max-width:860px){
 .expo-overview{grid-template-columns:1fr;gap:22px;grid-template-areas:"logos" "title" "motion" "copy"}
 .expo-story{display:contents}
 .expo-story .expo-cobrand{grid-area:logos;width:240px;gap:16px}
 .expo-story .cobrand-logo{max-height:54px}
 .expo-story .expo-cobrand-logo{max-height:60px}
 .expo-story h3{grid-area:title;font-size:30px;max-width:20ch}
 .expo-motion{grid-area:motion;width:min(220px,100%);justify-self:center}
 .expo-story .chapter-deck{grid-area:copy;font-size:17px;line-height:1.6}
}

/* Um componente para os filmes: mesma prévia, ação, legenda e abertura. */
.case-films{width:var(--case-measure);margin:32px auto 0;scroll-margin-top:80px}
.case-films .film-selection-head{margin-bottom:16px}
.film-collection-label{font:400 13px/1.4 var(--sans);color:var(--muted);text-transform:none}
.case-films .film-grid{gap:28px}
.case-films .film-grid-trio{grid-template-columns:repeat(3,minmax(0,1fr))}
.case-films .film-grid-single{grid-template-columns:1fr;max-width:800px;margin-inline:auto}
.case-films .ponta-eps{max-width:800px;margin:28px auto 0}
.case-films .film-caption{text-align:left}
.case-films .film-caption h4{font:600 21px/1.2 var(--sans);letter-spacing:-.025em;max-width:none;text-align:left;margin:0}
.case-films .film-caption p{max-width:42ch}
.case-films .film-watch{aspect-ratio:16/9}
.case-films .film-grid-trio .film-watch-action{inset:auto 16px 16px;gap:10px;font-size:13px}
.case-films .film-grid-trio .film-play-icon{width:46px;height:46px;font-size:16px}
@media(max-width:860px){
 .case-films .film-grid,.case-films .film-grid-trio{grid-template-columns:1fr;gap:30px}
 .case-films .film-caption h4{font-size:20px}
}

/* Final case audit: social proof, motion and film actions share the same rhythm. */
.social-comparison{width:var(--case-measure);margin:32px auto 0}
.social-toolbar{display:flex;align-items:center;justify-content:flex-end;margin-bottom:16px}
.social-tabs{display:none}
#cap-01 .ig-duo{width:100%;padding:0;margin:0;gap:24px;max-width:none}
.ig-col{max-width:none;justify-items:stretch;gap:12px}
.ig-tag{font:500 13px/1.4 var(--sans);letter-spacing:0;text-transform:none}
.social-panel{width:100%;min-width:0;background:#111;border:0;border-radius:4px;overflow:hidden}
.social-panel .ig-screen{border-radius:0;aspect-ratio:3/5}
.social-panel .ig-screen:before{display:none}
.social-panel .ig-user{padding-top:16px}
.feeds-paused .feed-loop{animation-play-state:paused!important}
.ig-col[hidden]{display:none!important}
#cap-02 .social-panel{width:100%;max-width:none;justify-self:stretch;grid-row:1;align-self:stretch}
#cap-02 .post-screen{border-radius:0;aspect-ratio:auto;height:100%}
#cap-02 .post-head{padding:12px;gap:8px;font-size:14px}
#cap-02 .post-cap{font-size:12px;line-height:1.45;padding:12px}
/* O filme e o post fecham na mesma altura: o vídeo manda e a legenda do post estica. */
#cap-02 .marcha-film{width:100%;max-width:none;grid-row:1;align-self:stretch;margin:0;display:flex}
#cap-02 .marcha-film .film-watch{height:100%;min-height:0}
/* Barra de ações do post refeita em código, no lugar do print com a barra queimada na imagem. */
.post-actions{display:flex;align-items:center;gap:18px;padding:11px 12px 0;color:#fff}
.post-actions .pa{display:flex;align-items:center;gap:7px}
.post-actions .pa-save{margin-left:auto}
.post-actions b{font:600 13px/1 var(--sans);letter-spacing:0}
.post-actions .pa-icon{display:block;width:22px;height:22px}
.post-actions .pa-icon svg{display:block;width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.post-actions .pa-like .pa-icon svg{fill:#ff3040;stroke:none}
.post-actions .pa-save .pa-icon svg{fill:currentColor;stroke:none}
.marcha-film .film-watch{aspect-ratio:9/16}
.marcha-film .film-watch-action,.manifesto-play .film-watch-action{inset:auto 14px 18px;justify-content:center;flex-direction:column;gap:10px}
.marcha-film .film-play-icon,.manifesto-play .film-play-icon{width:48px;height:48px}
.manifesto-play.film-watch{aspect-ratio:9/16}
.festa-films.case-films{width:var(--case-measure);max-width:1200px;padding:0;margin:32px auto 0}
.film-selection-head .film-collection-label{font:500 13px/1.4 var(--sans);color:var(--muted);letter-spacing:0;text-transform:none}
[data-filme]:focus-visible,.social-tabs button:focus-visible,.feed-toggle:focus-visible{outline:2px solid #fff;outline-offset:5px}
@media(max-width:860px){
 .social-toolbar{justify-content:space-between;gap:12px}
 .social-tabs{display:flex;gap:4px}
 .social-tabs button{border:0;background:none;color:#999;padding:10px 12px;font:600 14px/1.2 var(--sans);border-bottom:2px solid transparent}
 .social-tabs button[aria-selected=true]{color:#fff;border-bottom-color:var(--red)}
 #cap-01 .ig-duo{grid-template-columns:1fr}
 .ig-col>.ig-tag{display:none}
 .social-panel .ig-screen{aspect-ratio:3/5;max-height:650px}
 #cap-02 .marcha-film .film-watch-action{inset:auto 8px 12px;font-size:11px}
 #cap-02 .marcha-film .film-play-icon{width:40px;height:40px}
 .m18-row1 .film-watch-action{font-size:11px}
}
@media(max-width:360px){
 .social-tabs button{padding-inline:8px;font-size:13px}
 .social-toolbar .feed-toggle{font-size:11px}
}

.social-panel .post-screen:before{display:none}
.hero .filme-play,.chapter-play{width:auto;height:auto;aspect-ratio:auto;display:flex;align-items:center;gap:14px;border:0;border-radius:0;padding:0;background:transparent;color:#fff;font:600 15px/1.3 var(--sans);text-shadow:0 1px 6px #000;backdrop-filter:none}
.hero .filme-play:before,.chapter-play:before{display:none}
.hero .filme-play:hover,.chapter-play:hover{background:transparent;color:#fff;transform:none}
/* centrado no pé da capa em toda largura: no canto direito batia na seta pra baixo (18/09/2026) */
.hero .filme-play{left:50%;right:auto;bottom:clamp(18px,2.8vw,44px);transform:translateX(-50%)}
.hero .filme-play:hover{transform:translateX(-50%)}
.hero .filme-play:hover .film-play-icon,.chapter-play:hover .film-play-icon{transform:scale(1.08)}
@media(max-width:860px){.hero .filme-play,.chapter-play{font-size:13px;gap:12px}}
button.m18-tile{padding:0;cursor:zoom-in}
button.m18-tile:focus-visible{outline:2px solid #fff;outline-offset:4px}

.m18-tile:not(.m18-conv):after{display:none}
/* Plataformas no mesmo monitor, com base e legenda separadas. */
.commerce-preview,.youtube-preview{padding-bottom:clamp(32px,4vw,56px)}
.commerce-preview figcaption,.youtube-preview>figcaption{margin:28px 0 0;text-align:center;font:400 13px/1.5 var(--sans);color:var(--muted);letter-spacing:0;text-transform:none}
#acervo-youtube{width:var(--case-measure);max-width:1120px;margin:44px auto 0}
.youtube-screen{container-type:inline-size;aspect-ratio:16/10;background:#0f0f0f;color:#f1f1f1;overflow:auto;scrollbar-width:thin;scrollbar-color:#555 #0f0f0f;text-align:left;border-radius:4px 4px 0 0}
.youtube-screen:focus-visible{outline:2px solid #fff;outline-offset:-3px}
.youtube-toolbar{text-transform:none;display:flex;align-items:center;justify-content:space-between;gap:4cqw;padding:1.3cqw 2cqw;font:500 1.25cqw/1.2 Arial,sans-serif}
.youtube-wordmark{display:flex;align-items:center;gap:.45cqw;font-size:2cqw;font-weight:700;letter-spacing:-.1cqw}
.youtube-wordmark svg{width:2.7cqw;height:2cqw}
.youtube-wordmark sup{align-self:start;font-size:.65cqw;font-weight:400;letter-spacing:0}
.youtube-search{display:flex;justify-content:space-between;width:48%;padding:.8cqw 1.5cqw;border:1px solid #303030;border-radius:4cqw;color:#aaa}
.youtube-menu{font-size:2cqw}
#acervo-youtube .yt{display:flex;flex-direction:column;padding:0 3cqw 3cqw;gap:1.7cqw;background:#0f0f0f;font-family:Arial,sans-serif}
#acervo-youtube .youtube-banner{display:block;width:100%;height:auto;aspect-ratio:1707/283;object-fit:cover;border-radius:1cqw}
#acervo-youtube .yt-head{display:flex;align-items:center;gap:1.8cqw;padding:0;border:0;color:inherit;text-decoration:none}
#acervo-youtube .yt-ava{display:block;flex:none;width:8cqw;height:8cqw;border-radius:50%;object-fit:cover}
#acervo-youtube .yt-head b{display:block;font:700 2.7cqw/1.2 Arial,sans-serif;letter-spacing:-.08cqw}
#acervo-youtube .yt-head small{display:block;margin:.65cqw 0;color:#aaa;font:400 1.1cqw/1.4 Arial,sans-serif}
.youtube-description,.youtube-channel-link{display:block;margin-top:.4cqw;font:400 1.1cqw/1.4 Arial,sans-serif;color:#aaa}
.youtube-channel-link{color:#70b5ff}
.youtube-tabs{display:flex;gap:2.5cqw;border-bottom:1px solid #333;color:#aaa;font:600 1.25cqw/1.4 Arial,sans-serif}
.youtube-tabs span{padding:0 0 1cqw}
.youtube-tabs span:first-child{color:#fff;border-bottom:2px solid #fff}
#acervo-youtube .yt-row{display:flex;flex-direction:column;gap:1cqw}
#acervo-youtube .yt-row-h{display:flex;gap:1cqw;align-items:baseline;font:700 1.65cqw/1.4 Arial,sans-serif}
#acervo-youtube .yt-row-h span{font:400 .85cqw/1.4 Arial,sans-serif;letter-spacing:.08cqw;color:#aaa}
#acervo-youtube .yt-cards{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:1.2cqw;overflow:visible}
#acervo-youtube .yt-card{min-width:0;margin:0}
#acervo-youtube .yt-card img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;border-radius:.7cqw}
#acervo-youtube .yt-card figcaption{margin:.5cqw 0 0;font:500 1.08cqw/1.35 Arial,sans-serif;letter-spacing:0;text-transform:none;color:#f1f1f1}
#acervo-youtube .yt-card small{display:block;margin-top:.4cqw;font:400 .9cqw/1.3 Arial,sans-serif;color:#aaa}
@media(max-width:860px){
 #acervo-youtube{margin-top:28px}
 .commerce-preview figcaption,.youtube-preview>figcaption{margin-top:24px}
}


/* A real link remains usable before JavaScript loads or if it is blocked. */
a[data-filme]{text-decoration:none}
.film-player-help{position:absolute;bottom:max(12px,env(safe-area-inset-bottom));left:20px;right:20px;display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:10px 20px;color:#fff;font:13px/1.4 var(--sans);text-transform:none;letter-spacing:0}
.film-player-help a,.film-player-help button{color:#fff;background:none;border:0;padding:8px 0;font:inherit;text-decoration:underline;text-underline-offset:4px;cursor:pointer}
.film-player-help [hidden]{display:none}
.film-player-help :focus-visible{outline:2px solid #fff;outline-offset:3px}
.filme-lb{padding-bottom:90px}
@media(max-width:600px){.film-player-help{font-size:12px;gap:4px 14px}.film-player-help [role=status]{flex-basis:100%;text-align:center}}
.filme-lb video{width:auto;height:auto;max-width:100%;max-height:calc(100dvh - 160px);aspect-ratio:auto;object-fit:contain}

/* Os detalhes do kit funcionam como imagens em movimento, sem chamada de filme. */
.kit-motion{width:100%;height:100%;aspect-ratio:9/16;overflow:hidden;border-radius:4px;background:#111}
.kit-motion video{display:block;width:100%;height:100%;object-fit:cover}

/* Os dois virais usam a escala da galeria, sem limite herdado de aparelho. */
@media(max-width:1199px){
 #cap-02 .social-panel,#cap-02 .marcha-film{grid-row:2}
}
@media(max-width:600px){
 #cap-02 .marcha-grid{grid-template-columns:minmax(0,1fr);gap:28px}
 #cap-02 .social-panel,#cap-02 .marcha-film{grid-column:1;grid-row:auto}
 #cap-02 .post-head{gap:10px;padding:14px;font-size:14px}
 #cap-02 .post-head img{width:32px;height:32px}
 #cap-02 .post-cap{font-size:13px;line-height:1.5;padding:14px}
 #cap-02 .marcha-film .film-watch-action{inset:auto 16px 20px;font-size:14px}
 #cap-02 .marcha-film .film-play-icon{width:48px;height:48px}
}

/* Expo: mesma largura, altura e espaçamento para os dois anos. */
.expo-gallery-label{margin:0;color:var(--muted);font:400 14px/1.4 var(--sans)}
#expo-fotos-2024,#expo-fotos-2025{width:var(--case-measure);max-width:1200px;padding:0;gap:16px;scroll-margin-top:80px}
#cap-05 .collab-fotos .party-photo-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px 16px;columns:auto}
#cap-05 .collab-fotos .party-photo-row{display:contents}
#cap-05 .collab-fotos .party-photo{margin:0;min-width:0}
#cap-05 .collab-fotos .party-photo button{height:clamp(210px,23vw,280px);overflow:hidden}
#cap-05 .collab-fotos .party-photo img{width:100%;height:100%;object-fit:cover}

/* Expo 2024: totem alto à esquerda nas duas primeiras fileiras; embaixo, fileira mais alta com Magic Pack, Original Case e Magic Machine. */
#cap-05 #expo-fotos-2024 .expo-totem{grid-row:span 2}
#cap-05 #expo-fotos-2024 .expo-totem,#cap-05 #expo-fotos-2024 .expo-magic{display:flex;flex-direction:column}
#cap-05 #expo-fotos-2024 .expo-totem button{flex:1 1 auto;height:auto;min-height:0;aspect-ratio:auto}
#cap-05 #expo-fotos-2024 .expo-totem img,#cap-05 #expo-fotos-2024 .expo-magic img{position:absolute;inset:0}
#cap-05 #expo-fotos-2024 .expo-produto button{height:clamp(300px,42vw,600px)}
#cap-05 #expo-fotos-2024 .expo-magic img{object-position:50% 25%}
#expo-fotos-2024 .party-photo-note{font-size:13px;line-height:1.5;margin:10px 0 0;max-width:34ch}
#expo-fotos-2024 .party-photo-note strong{display:block;color:var(--white);font-size:15px;font-weight:600;margin-bottom:4px}
@media(max-width:860px){
 #cap-05 .collab-fotos .party-photo-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 10px}
 #cap-05 .collab-fotos .party-photo button{height:auto;aspect-ratio:4/5}

 #expo-fotos-2024 .party-photo-note strong{font-size:14px}
 #cap-05 #expo-fotos-2024 .expo-totem{grid-column:1;grid-row:1/span 2}
 #cap-05 #expo-fotos-2024 .expo-magic{grid-column:2;grid-row:3/span 2}
 #cap-05 #expo-fotos-2024 .expo-produto button{height:auto;aspect-ratio:4/5}
 #cap-05 #expo-fotos-2024 .expo-magic button{flex:1 1 auto;aspect-ratio:auto;min-height:0}
}

/* Legendas do convite e dos creators seguem as legendas de fotos do case. */
.m18-kit,.m18-stories{margin:0;min-width:0}
.m18-stories{gap:0}
.m18-caption{display:block;width:100%;max-width:1120px;margin:8px auto 4px;text-align:left;letter-spacing:0;text-transform:none}
@media(max-width:860px){.m18-caption{max-width:1120px;margin:8px auto 0}}

/* Mobile: abertura compacta e resultados depois das peças. */
#cap-02 .marcha-results{min-width:0;grid-column:1;grid-row:2}
@media(min-width:1200px){
 #cap-02 .social-panel,#cap-02 .marcha-film{grid-row:1 / span 2}
 #cap-02 .marcha-side{align-self:end}
}
.coala-results{width:var(--case-measure);max-width:1120px;margin:28px auto 0}
@media(max-width:860px){
 .hero{min-height:100svh;padding:88px var(--margem-pagina) 36px;display:flex;flex-direction:column;justify-content:center;gap:32px}
 .hero-inner{padding:0;width:100%}
 .hero-block{width:100%;max-width:440px;gap:24px}
 .hero-lockup img{width:clamp(168px,48vw,230px)}
 .hero-role{border:0;padding:0;margin:0;width:100%;max-width:none;font-size:28px;letter-spacing:0;text-transform:none}
 .hero-role b{font-size:13px;letter-spacing:.1em;margin-bottom:12px}
 .hero-role small{font-size:16px;line-height:1.5;margin-top:12px;max-width:35ch}
 .hero .filme-play{position:relative;inset:auto;transform:none;z-index:3;width:100%;max-width:440px;font-size:14px}
 .hero .filme-play .film-play-icon{width:44px;height:44px}
 .social-toolbar{justify-content:center}
 #cap-02 .marcha-results{grid-column:1/-1;grid-row:3}
 #fotos-18 .party-photo-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;columns:auto}
 #fotos-18 .party-photo{margin:0}
 #fotos-18 .party-projection{grid-column:1/-1}
 #fotos-18 .party-photo:not(.party-projection) img{aspect-ratio:1;object-fit:cover}
}
@media(max-width:600px){#cap-02 .marcha-results{grid-row:4}}

@media(min-width:601px) and (max-width:1199px){#cap-02 .marcha-results{grid-column:1/-1;grid-row:3}}
.expo-film-2024{background:linear-gradient(#0009,#0009),url('/aleda/assets/img/aleda-testeira-circular-iluminada-da-aleda-na-02.jpg') center/cover}
.expo-film-2024 video{object-fit:contain;object-position:center}

@media(max-width:860px){.case-films .expo-film-2024{aspect-ratio:4/5}}

/* Mobile: resultados encerram o projeto antes da divisória. */
@media(max-width:860px){
 #cap-03 .capstats-row,#cap-05 .capstats-row,.coala-numbers>div,#cap-02 .m-note{border-top:0}
 #cap-02::after,#cap-03::after,#cap-04::after,#cap-05::after{content:"";display:block;width:var(--case-measure);height:1px;background:var(--line);margin:32px auto 0}
 #cap-03,#cap-04,#cap-05,#cap-06{padding-top:32px}
}

#cap-02 .m-stats{grid-template-columns:repeat(2,minmax(0,1fr))}

/* Abertura mobile: logo e assinatura compõem a primeira tela. */
@media(max-width:860px){
 .hero{height:100svh;min-height:520px;padding:76px var(--margem-pagina) 100px;gap:0}
 .hero-inner{max-width:none}
 .hero-block{width:min(100%,340px);max-width:none;margin:0 auto;gap:22px}
 .hero-lockup{justify-content:center}
 .hero-lockup img{width:clamp(136px,38vw,176px)}
 .hero .hero-role{display:block;text-align:center;font-size:28px}
 .hero .hero-role b{font-size:11px;letter-spacing:.12em;margin-bottom:8px}
 .hero .hero-role small{font-size:14px;line-height:1.5;max-width:32ch;margin:12px auto 0}
 .hero .filme-play{position:absolute;left:50%;bottom:max(24px,env(safe-area-inset-bottom));top:auto;right:auto;transform:translateX(-50%);width:max-content;max-width:calc(100% - 48px)}
 .hero .filme-play:hover{transform:translateX(-50%)}
}

/* Título, mídia e legenda são elementos distintos; mesma ordem no mobile. */
.film-card{display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:16px;align-content:start}
.film-card>.film-watch{grid-column:1/-1;grid-row:1}
.case-films .film-card>.media-title{grid-column:1;grid-row:2;margin:18px 0 0;font:600 21px/1.2 var(--sans);letter-spacing:-.025em;text-transform:none;text-align:left;max-width:none}
.film-card>.film-caption,.film-card>.film-caption>div{display:contents}
.film-card .film-caption p{grid-column:1;grid-row:3;margin:8px 0 0}
.film-card .film-duration{grid-column:2;grid-row:2;margin-top:18px}
.manifesto-preview,.landing-preview{display:flex;flex-direction:column}
.manifesto-preview>.manifesto-play,.landing-preview>.landing-mosaic{order:0}
.digital-showcase .media-title{order:1;margin-top:18px}
.digital-showcase .digital-caption{order:2;margin-top:0}
@media(max-width:860px){
 .chapter h3,.anniv-copy h3,.coala-story h3,.expo-story h3,.result h2,.sub>h4{font:700 30px/1.15 var(--sans);letter-spacing:-.025em;text-transform:none}
 .film-card{row-gap:10px;column-gap:12px}
 .case-films .film-card>.media-title{grid-column:1/-1;grid-row:1;margin:0 0 2px;font:600 20px/1.25 var(--sans);letter-spacing:-.02em}
 .film-card>.film-watch{grid-row:2}
 .film-card .film-caption p{grid-row:3;margin:0;max-width:none}
 .film-card .film-duration{grid-row:3;margin:0;padding:0;color:var(--muted);font:400 13px/1.5 var(--sans)}
 .digital-showcase .media-title{order:-1;margin:0 0 12px;font:600 20px/1.25 var(--sans);letter-spacing:-.02em}
 .digital-showcase .digital-caption{margin:10px 0 0}
 .digital-caption p,.film-caption p,.coala-film-caption,.party-photo-note,.m18-caption,.commerce-preview>figcaption,.youtube-preview>figcaption{font:400 13px/1.5 var(--sans);letter-spacing:0;text-transform:none;text-align:left;color:var(--muted)}
 .digital-caption p{margin:0}
 .manifesto-results{display:block;max-width:none;text-wrap:pretty}
 .party-photo-note,.m18-caption{margin:10px 0 0}
 .commerce-preview>figcaption,.youtube-preview>figcaption{margin-top:24px}
 .expo-gallery-label,.film-collection-label{font:600 20px/1.25 var(--sans);letter-spacing:-.02em;text-transform:none;color:var(--white)}
 .case-films .film-watch-portrait{aspect-ratio:9/16}
 .film-watch-portrait video{object-fit:contain;object-position:center}
 #cap-03 .capstat span,#cap-05 .capstat span,.coala-numbers dt,.result-numbers dt{font:400 13px/1.5 var(--sans);letter-spacing:0;text-transform:none}
}

/* Capa mobile: período, marca sem tagline e atribuições. */
.hero-period{display:none}
.hero-logo-mark{display:contents}
@media(max-width:860px){
 .hero-block{gap:20px}
 .hero-period{display:block;text-align:center;font:600 11px/1.4 var(--sans);letter-spacing:.12em;color:#fff}
 .hero .hero-role b{display:none}
 /* sem overflow:hidden: ele cortava a sombra do logo e deixava um retângulo escuro em volta */
 .hero-logo-mark{display:block;width:clamp(136px,38vw,176px);aspect-ratio:2092/1120;overflow:visible}
 .hero-lockup .hero-logo-mark img{display:block;width:100%;height:auto!important;max-width:none}
}

/* Marcha: métricas com ícones e nota sem divisória. */
#cap-02 .m-stat .metric-icon{display:block;width:22px;height:22px;margin-top:9px;color:var(--muted)}
.metric-icon svg{display:block;width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
#cap-02 .m-note{border-top:0;margin-top:16px;padding-top:0}

/* ---- 18/09/2026: revisão do Caiote ---- */
/* sem Space Mono nos textos */
.ticker-track,.m18-quote-blk,.cobrand-x,.coala-engagement{font-family:var(--sans)}
.coala-results .coala-engagement{font:400 13px/1.6 var(--sans);letter-spacing:0;text-transform:none;color:var(--muted);margin:0}
/* números: uma linha só, sem as linhas retas */
#cap-02 .m-stats,.m-stats{grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}
.capstats-row{border-top:0}
#cap-05 .capstat,.capstat{padding-top:0}
.coala-numbers>div,.result-numbers>div{border-top:0;padding-top:0}
.coala-numbers,.result-numbers{grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}
.coala-results{display:grid;grid-template-columns:1fr;gap:16px}
@media(max-width:860px){#cap-02 .m-stats,.m-stats{grid-template-columns:repeat(3,minmax(0,1fr))}.coala-numbers,.result-numbers{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* KV da Expocannabis recortado pra proporção de feed e um pouco maior */
#expo-abertura .expo-motion{width:min(100%,520px);aspect-ratio:4/5;overflow:hidden;margin:0}
#expo-abertura .expo-motion video{display:block;width:100%;height:100%;object-fit:cover}
#expo-abertura.expo-overview{grid-template-columns:minmax(0,420px) minmax(0,640px)}
/* os cinco números da Marcha numa linha só, embaixo do texto e dos vídeos, em toda largura */
@media(min-width:1200px){#cap-02 .marcha-results{grid-column:1/-1;grid-row:3;margin-top:8px}}
#cap-02 .m-stat b,.m-stat b{white-space:nowrap}
/* Marcha: os números embaixo do vídeo, como a barra do Instagram (ícone e número na linha) */
@media(min-width:1200px){#cap-02 .marcha-results{grid-column:2;grid-row:3;margin-top:0}}
#cap-02 .m-stats,.m-stats{display:flex;flex-wrap:wrap;gap:8px 18px;margin:0}
.m-stat{display:flex;flex-direction:row-reverse;align-items:center;gap:6px}
#cap-02 .m-stat b,.m-stat b{font-size:15px;font-weight:600;line-height:1;letter-spacing:0;white-space:nowrap}
.m-stat .metric-icon{display:block;width:18px;height:18px}
.m-stat .metric-icon svg{width:18px;height:18px}
#cap-02 .m-stat span,.m-stat span{margin:0}
#cap-02 .m-note,.m-note{font-size:12px;color:var(--muted);margin:8px 0 0;padding:0}
/* Resultados: o "antes →" flutua acima do número, sem empurrar; os seis números alinham na mesma linha */
.result-numbers dd{position:relative}
.result-numbers dd small{position:absolute;left:0;bottom:100%;margin:0 0 4px;white-space:nowrap}
.coala-numbers>div,.result-numbers>div{border-top:0!important;padding-top:0!important}
.case-results .result-numbers{row-gap:56px}
/* os cinco números numa linha só, na largura do vídeo */
#cap-02 .m-stats,.m-stats{flex-wrap:nowrap!important;justify-content:space-between;gap:0 10px}
#cap-02 .m-stat b,.m-stat b{font-size:14px}
.m-stat{gap:5px;flex:none}
.m-stat .metric-icon,.m-stat .metric-icon svg{width:16px;height:16px}
/* Resultados: título e colunas centrados na régua, pra o bloco não pesar pra esquerda */
.case-results .result-numbers{text-align:center}
.case-results .result-numbers>div{align-items:center}
.case-results .result-numbers dt{max-width:30ch;margin:0 auto}
.result-numbers dd small{left:50%;transform:translateX(-50%)}
.case-results h2,.case-results .result-title{text-align:center}
.case-results .result-head,.case-results .result-head h2{text-align:center;margin-inline:auto}

/* Carrossel de post (21/09/2026): mesma ordem do cartão de filme, mídia em cima, título e legenda embaixo. */
.carrossel{position:relative;aspect-ratio:var(--proporcao,4/5);overflow:hidden;border-radius:4px;background:#111}
.film-card>.carrossel{grid-column:1/-1;grid-row:1}
.carrossel-trilho{display:flex;height:100%;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scrollbar-width:none}
.carrossel-trilho::-webkit-scrollbar{display:none}
.carrossel-trilho img{flex:0 0 100%;width:100%;height:100%;object-fit:cover;scroll-snap-align:start}
.carrossel-seta{position:absolute;top:50%;translate:0 -50%;z-index:2;display:grid;place-items:center;width:32px;height:32px;padding:0 0 3px;border:0;border-radius:50%;background:rgba(255,255,255,.88);color:#111;font:500 24px/1 var(--sans);cursor:pointer;transition:opacity .2s}
.carrossel-seta.ant{left:10px}.carrossel-seta.prox{right:10px}
.carrossel-seta:disabled{opacity:0;pointer-events:none}
.carrossel-conta{position:absolute;top:10px;right:10px;z-index:2;padding:3px 9px;border-radius:12px;background:rgba(0,0,0,.62);color:#fff;font:600 12px/1.4 var(--sans)}
.carrossel-pontos{position:absolute;left:0;right:0;bottom:12px;z-index:2;display:flex;justify-content:center;gap:5px;pointer-events:none}
.carrossel-pontos i{width:6px;height:6px;border-radius:50%;background:rgba(255,255,255,.45)}
.carrossel-pontos i.on{background:#fff}
.carrossel-trilho:focus-visible,.carrossel-seta:focus-visible{outline:2px solid #fff;outline-offset:3px}
/* fileira com filmes 16:9 e carrossel: a largura segue a proporção, então as mídias fecham na mesma altura */
.case-films .midia-com-carrossel{display:flex;align-items:flex-start;gap:28px;max-width:1200px;margin:28px auto 0}
.midia-com-carrossel>.film-card{flex:1.7778 1 0;min-width:0}
.midia-com-carrossel>.carrossel-card{flex:.834 1 0}
.film-watch>img{display:block;width:100%;height:100%;object-fit:cover}
.yt-lite-frame{border:0;cursor:auto}
#finha-filmes{width:var(--case-measure);padding:0}
@media(max-width:860px){
 .case-films .midia-com-carrossel{flex-direction:column;gap:32px}
 .midia-com-carrossel>.film-card{flex:none;width:100%}
 .film-card>.carrossel{grid-row:2}
}

/* De Ponta a Ponta: as oito fotos de bastidor numa tira só, depois dos episódios (pedido do Caiote, 21/09/2026) */
.ponta-tira{max-width:800px;margin:28px auto 0}
.ponta-tira-fotos{display:flex;gap:8px}
.ponta-tira-fotos>button{flex:1 1 0;min-width:0;padding:0;border:0;background:#111;cursor:zoom-in;border-radius:2px;overflow:hidden}
.ponta-tira-fotos img{display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover}
.ponta-tira-fotos>button:focus-visible{outline:2px solid #fff;outline-offset:3px}
.ponta-tira figcaption{margin-top:10px;color:var(--muted);font:400 13px/1.5 var(--sans);letter-spacing:0;text-transform:none;text-align:left}
@media(max-width:600px){
 .ponta-tira-fotos{overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}
 .ponta-tira-fotos::-webkit-scrollbar{display:none}
 .ponta-tira-fotos>button{flex:0 0 28%;scroll-snap-align:start}
}
/* De Ponta a Ponta na largura dos outros blocos de filme (1200 px), com menos margem preta (21/09/2026) */
#ponta-filmes .film-grid-single,#ponta-filmes .ponta-eps,#ponta-filmes .ponta-tira{max-width:1200px}