/* ===== páginas de cases (complementa assets/site.css) ===== */
.crumb{display:inline-flex;align-items:center;gap:8px;align-self:flex-start;min-height:44px;margin:0 0 4px;color:var(--text-2);font:600 14px/1 var(--font-h);text-decoration:none;transition:color .2s}
.crumb svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:transform .25s var(--fx-ease)}
@media (hover:hover){.crumb:hover{color:var(--green-2)}.crumb:hover svg{transform:translateX(-4px)}}
h2.pill,h1.pill{margin:0}
.chero .wrap{display:flex;flex-direction:column;align-items:center;gap:20px}
.chero .h1{max-width:16ch}
.chero .lead{max-width:34ch}
.clogo{display:grid;place-items:center;width:min(100%,312px);min-height:125px;padding:26px 34px;border-radius:8px;border:1px solid rgba(255,255,255,.1);background:rgba(10,10,10,.42);
  -webkit-backdrop-filter:blur(28px) saturate(180%);backdrop-filter:blur(28px) saturate(180%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.1),inset 0 -1px 0 rgba(0,0,0,.32),0 1px 2px rgba(0,0,0,.55),0 14px 38px rgba(0,0,0,.45)}
.clogo img{max-width:100%;max-height:67px;width:auto;height:auto;object-fit:contain}
.chips--center{justify-content:center;margin-top:0}
.chero .chips{max-width:420px}
html.js #topo .clogo,html.js #topo .chero-h,html.js #topo .chips li{animation:rv .7s var(--fx-ease) backwards;--ry:-16px}
html.js #topo .clogo{animation-delay:.12s}html.js #topo .chips li{animation-delay:.36s}
/* etiquetas do hero: vidro desfocado e caixa 50% mais escura para contrastar com o fundo animado (a animação fica nas próprias etiquetas, não na lista, para não bloquear o desfoque) */
.chero .chips li{background:rgba(0,166,81,.35);border-color:rgba(23,221,119,.5);color:#fff;opacity:1}
.sec-wrap{max-width:640px;margin-inline:auto}
.prose{display:grid;gap:16px;font-size:clamp(16px,4.3vw,18px);line-height:1.65;color:var(--text-2);text-wrap:pretty}
.prose p{margin:0}
.prose strong{color:var(--text)}
.head--left{align-items:flex-start;text-align:left;margin-bottom:26px}
.kpibox{display:grid;gap:0}
.kpibox .metric{padding-block:16px}
.kpibox .metric:first-child{border-top:0;padding-top:4px}
.kpibox .metric:last-child{padding-bottom:4px}
.metric__n small{font:700 .38em/1 var(--font-h);letter-spacing:0;margin-left:.3em;color:var(--green-2)}
.kpibox .metric__l{font-size:16px}
.metric--stack{flex-direction:column;align-items:flex-start;gap:8px}
.hls{display:grid;gap:12px;margin-top:14px}
.hl{position:relative;display:grid;grid-template-columns:auto 1fr;column-gap:14px;row-gap:4px;padding:20px 20px;border-radius:8px;border:1px solid var(--line);background:rgba(10,10,10,.42);
  -webkit-backdrop-filter:blur(28px) saturate(180%);backdrop-filter:blur(28px) saturate(180%);box-shadow:inset 0 1px 0 rgba(255,255,255,.1),inset 0 -1px 0 rgba(0,0,0,.32),0 14px 38px rgba(0,0,0,.35)}
.hl::before{content:"";grid-row:1 / span 2;align-self:start;margin-top:7px;width:9px;height:9px;border-radius:50%;background:var(--green-2);box-shadow:0 0 0 4px rgba(23,221,119,.22)}
.hl__t{margin:0;font:700 18px/1.3 var(--font-h);letter-spacing:-.02em;color:#fff;transition:color .3s}
.hl__d{margin:0;grid-column:2;color:var(--text-2);font-size:15px}
.hl:hover .hl__t{color:var(--green-2)}
.closing{margin-top:22px}
.pv-wrap{display:grid;gap:34px;max-width:780px}
.pv__t{margin:0 0 10px;font:700 clamp(21px,5.4vw,26px)/1.25 var(--font-h);letter-spacing:-.025em}
.pv .prose ul{margin:0;padding-left:20px;display:grid;gap:8px;list-style:disc}
.pv .prose li::marker{color:var(--green-2)}
.pv .prose a{color:var(--green-2);text-underline-offset:3px}
.privacy-date{color:var(--text-3)}
.ba{margin-top:14px;display:grid;gap:22px}
.ba__t{margin:0;font:700 20px/1.2 var(--font-h);letter-spacing:-.02em}
.ba__s{margin:-14px 0 0;font-size:13.5px;line-height:1.45;color:var(--text-3)}
.ba__row{display:grid;gap:8px}
.ba__l{margin:0;font:600 15px/1.35 var(--font-h);color:var(--text-2)}
.ba__l b{color:var(--green-2);font-weight:700}
.ba__bar{display:grid;grid-template-columns:56px minmax(0,1fr) auto;align-items:center;gap:10px}
.ba__bar span{font:600 12px/1 var(--font-b);letter-spacing:.04em;text-transform:uppercase;color:var(--text-3)}
.ba__bar i{display:block;height:14px;width:100%;border-radius:4px;background:linear-gradient(90deg,rgba(255,255,255,.1),rgba(255,255,255,.28));transform-origin:left;transform:scaleX(0);transition:transform 1.1s var(--fx-ease)}
.ba__bar--d i{background:linear-gradient(90deg,#0bb25a,#2ff08a);box-shadow:0 0 14px rgba(39,210,101,.4)}
.ba__bar em{font:700 14px/1 var(--font-n);font-style:normal;min-width:3.6ch;text-align:right;color:#fff;font-variant-numeric:tabular-nums}
.ba__bar--d em{color:var(--green-2)}
.ba.rv-in .ba__bar i{transform:scaleX(calc(var(--w) / 100))}
.ba.rv-in .ba__row:nth-of-type(2) .ba__bar i{transition-delay:.12s}
.ba.rv-in .ba__row:nth-of-type(3) .ba__bar i{transition-delay:.24s}
.ba.rv-in .ba__bar--d i{transition-delay:.4s}
@media (prefers-reduced-motion:reduce){.ba__bar i{transform:scaleX(calc(var(--w) / 100));transition:none}}
.strat-intro{margin-bottom:22px}
.related{display:grid;gap:12px}
.related-h{margin:0 0 4px}
.mini-case{display:flex;align-items:center;gap:16px;padding:14px 16px;border-radius:8px;border:1px solid var(--line);background:rgba(10,10,10,.42);text-decoration:none;color:#fff;
  -webkit-backdrop-filter:blur(28px) saturate(180%);backdrop-filter:blur(28px) saturate(180%);transition:border-color .25s,transform .25s var(--fx-ease)}
.mini-case img{flex:none;width:92px;height:44px;object-fit:contain}
.mini-case b{display:block;font:700 16px/1.25 var(--font-h);letter-spacing:-.01em}
.mini-case span{display:block;margin-top:2px;font-size:13px;line-height:1.35;color:var(--text-3)}
.mini-case svg{flex:none;margin-left:auto;width:18px;height:18px;fill:none;stroke:var(--green-2);stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:transform .25s var(--fx-ease)}
@media (hover:hover){.mini-case:hover{border-color:rgba(23,221,119,.5);transform:translateY(-2px)}.mini-case:hover svg{transform:translateX(4px)}}

/* listagem */
.cases-filter{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-bottom:12px}
.fchip{min-height:44px;padding:0 16px;border-radius:8px;border:1px solid var(--line-2);background:rgba(10,10,10,.42);color:var(--text-2);font:600 14px/1 var(--font-h);cursor:pointer;
  transition:color .2s,border-color .25s,background-color .25s,transform .25s var(--fx-ease)}
@media (hover:hover){.fchip:hover{color:#fff;border-color:rgba(23,221,119,.5);transform:translateY(-1px)}}
.fchip[aria-pressed="true"]{color:var(--on-green);background:linear-gradient(180deg,var(--green-2),var(--green));border-color:transparent}
.fchip:focus-visible{outline:2px solid var(--green-2);outline-offset:2px}
.cases-count{margin:0 0 22px;text-align:center;color:var(--text-3);font:600 13px/1 var(--font-h);letter-spacing:.04em}
.cases-list{display:grid;gap:16px;max-width:640px;margin-inline:auto}
.case-card[hidden]{display:none}
.case-card.refilter{animation:rv .6s var(--fx-ease) var(--rd2,0s) backwards}
.case-card{position:relative;display:flex;flex-direction:column;gap:14px;padding:22px 20px 20px;border-radius:8px;border:1px solid var(--line);text-decoration:none;color:var(--text);
  background:rgba(10,10,10,.42);-webkit-backdrop-filter:blur(28px) saturate(180%);backdrop-filter:blur(28px) saturate(180%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.1),inset 0 -1px 0 rgba(0,0,0,.32),0 1px 2px rgba(0,0,0,.55),0 14px 38px rgba(0,0,0,.45);transition:transform .3s var(--fx-ease)}
.case-card__top{display:flex;align-items:center;justify-content:space-between;gap:12px}
.case-card__logo{display:grid;place-items:center;width:128px;height:52px}
.case-card__logo img{max-width:100%;max-height:44px;width:auto;height:auto;object-fit:contain}
.case-card__cat{padding:5px 11px;border-radius:6px;background:rgba(255,255,255,.06);border:1px solid var(--line);font:600 12px/1.3 var(--font-b);color:var(--green-2);text-align:right}
.case-card__name{margin:0;font:700 24px/1.15 var(--font-h);letter-spacing:-.03em;color:#fff;transition:color .3s}
.case-card__tag{margin:-8px 0 0;color:var(--text-2);font-size:15px;line-height:1.45}
.case-card__kpis{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding-top:14px;border-top:1px solid var(--line)}
.case-card__kpis .mini{display:flex;flex-direction:column;gap:6px;min-width:0}
.mini__n{display:inline-block;font:700 clamp(28px,8vw,34px)/1 var(--font-n);letter-spacing:-.04em;color:var(--green-2);font-variant-numeric:tabular-nums}
.mini__n small{font:700 .42em/1 var(--font-h);margin-left:.25em}
.mini__l{font:600 13px/1.35 var(--font-h);color:var(--text-2)}
.mini--text .mini__n{font:700 17px/1.25 var(--font-h);letter-spacing:-.02em;color:var(--green-2)}
.case-card__more{display:inline-flex;align-items:center;gap:8px;font:700 15px/1 var(--font-h);color:#fff}
.case-card__more svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:transform .25s var(--fx-ease)}
@media (hover:hover){.case-card:hover{transform:translateY(-2px)}.case-card:hover .case-card__name{color:var(--green-2)}.case-card:hover .case-card__more svg{transform:translateX(5px)}
  .case-card:hover .glow-ring{opacity:1}.case-card:hover .glow-ring rect{animation-play-state:running}
  .hl:hover .glow-ring{opacity:1}.hl:hover .glow-ring rect{animation-play-state:running}}
.case-card:focus-visible{outline:2px solid var(--green-2);outline-offset:3px}
.case-card:focus-visible .glow-ring{opacity:1}.case-card:focus-visible .glow-ring rect{animation-play-state:running}
@media (prefers-reduced-motion:reduce){.case-card:hover,.hl:hover{border-color:rgba(23,221,119,.5)}}
.case-card .glow-ring,.hl .glow-ring{z-index:3}

/* ===== páginas de cases: desktop (≥1024px) ===== */
@media (min-width:1024px){
.chero{padding-top:190px}
.chero .wrap{gap:26px}
.chero .h1{max-width:20ch}
.chero .lead{max-width:50ch;font-size:22px}
.clogo{width:min(100%,380px);min-height:150px;padding:32px 44px}
.clogo img{max-height:82px}
.chero .chips{max-width:680px}
.crumb{align-self:flex-start}
.sec-wrap{max-width:var(--maxw)}
/* seções editoriais: título à esquerda, conteúdo à direita */
#sobre .sec-wrap,#desafio .sec-wrap,#estrategia .sec-wrap,#outros .sec-wrap{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:0 80px;align-items:start}
#sobre .head--left,#desafio .head--left,#estrategia .head--left,#outros .head--left{grid-column:1;grid-row:1 / span 6;margin-bottom:0;position:sticky;top:120px}
#sobre .sec-wrap>:not(.head),#desafio .sec-wrap>:not(.head),#estrategia .sec-wrap>:not(.head),#outros .sec-wrap>:not(.head){grid-column:2}
.prose{font-size:19px;max-width:70ch}
.steps3{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.related{gap:14px}
/* resultados: números lado a lado */
.kpibox{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));padding:44px 40px}
.kpibox .metric{flex-direction:column;align-items:flex-start;gap:10px;padding:0 28px;border-top:0;border-left:1px solid var(--line)}
.kpibox .metric:first-child{border-left:0;padding-left:0}
.kpibox .metric__n{font-size:clamp(44px,4vw,60px);min-width:0;white-space:nowrap}
.kpibox .metric__n small{display:block;margin:8px 0 0;font-size:.34em;letter-spacing:.02em}
.kpibox .metric__l{font-size:18px;max-width:22ch}
.hls{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:16px}
.closing{max-width:780px}
/* listagem */
.cases-list{grid-template-columns:repeat(3,minmax(0,1fr));max-width:none;gap:24px}
.case-card{padding:28px 26px 24px}
.case-card__name{font-size:28px}
.cases-filter{margin-bottom:20px}
}

/* ===== páginas de cases: tablet (700px a 1023px) ===== */
@media (min-width:700px) and (max-width:1023px){
.chero{padding-top:170px}
.chero .h1{max-width:20ch}
.clogo{width:min(100%,340px);min-height:136px}
.clogo img{max-height:74px}
.sec-wrap{max-width:var(--maxw)}
.prose{font-size:18px}
.steps3{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.kpibox{grid-template-columns:repeat(auto-fit,minmax(180px,1fr));padding:36px 30px}
.kpibox .metric{flex-direction:column;align-items:flex-start;gap:8px;padding:0 20px;border-top:0;border-left:1px solid var(--line)}
.kpibox .metric:first-child{border-left:0;padding-left:0}
.kpibox .metric__n{font-size:clamp(40px,5.4vw,52px);min-width:0;white-space:nowrap}
.kpibox .metric__n small{display:block;margin:6px 0 0;font-size:.34em}
.hls{grid-template-columns:repeat(2,minmax(0,1fr))}
.cases-list{grid-template-columns:repeat(2,minmax(0,1fr));max-width:none}
.case-card__name{font-size:26px}
}