/* V12 — apenas a seção de projetos em cards. Camada adicional à V11. */
/* Sem alterar os demais .block, tipografia, paletas ou interações globais. */
.cases-wrapper {
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  gap:18px !important;
  height:auto !important;
  min-height:0 !important;
  overflow:visible !important;
  border:0 !important;
  background:transparent !important;
  align-items:stretch;
}
.cases-wrapper .case-item {
  display:flex !important;
  flex:initial !important;
  width:100%;
  height:clamp(250px,25vw,330px) !important;
  min-height:250px !important;
  min-width:0;
  position:relative;
  border:6px solid #111 !important;
  background:#fff !important;
  color:#111 !important;
  overflow:hidden;
  text-decoration:none;
  isolation:isolate;
  transform:translate(0,0);
  transition:transform .28s ease,background-color .34s ease,color .34s ease,border-color .34s ease,opacity .34s ease,filter .34s ease !important;
}
/* Primeiro projeto destacado, restante uniforme. */
.cases-wrapper .case-item:first-child:not([hidden]) {
  grid-column:1 / -1;
  height:clamp(300px,30vw,395px) !important;
}
.cases-wrapper .case-item:hover,
.cases-wrapper .case-item:focus-visible {
  flex:initial !important;
  transform:translate(-3px,-3px);
  color:#fff !important;
  background:#111 !important;
  z-index:10;
}
.cases-wrapper .case-item .case-header {
  position:relative;
  z-index:2;
  width:100%;height:100%;
  min-width:0;
  padding:clamp(18px,2.3vw,34px) !important;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:flex-end !important;
  gap:8px;
  isolation:isolate;
  pointer-events:none;
}
.cases-wrapper .case-num {
  margin:0 auto auto 0;
  font-size:clamp(21px,2.2vw,28px);
  line-height:1;
  font-family:var(--font-pixel);
  font-weight:700;
}
.cases-wrapper .case-title,
.cases-wrapper .case-item.active .case-title {
  font-family:var(--font-bold);
  font-weight:900;
  font-size:clamp(25px,3vw,46px) !important;
  line-height:.98;
  letter-spacing:-.055em;
  white-space:normal !important;
  text-wrap:balance;
  align-self:flex-start !important;
  writing-mode:horizontal-tb !important;
  transform:none !important;
  text-shadow:none !important;
  margin:0;
  max-width:100%;
  overflow-wrap:break-word;
}
.cases-wrapper .case-item:first-child .case-title {font-size:clamp(38px,5.5vw,72px) !important;}
.cases-wrapper .case-category {
  display:inline-block !important;
  font-family:var(--font-pixel);
  font-size:clamp(15px,1.7vw,20px);
  line-height:1.1;
  background:#111;
  color:#fff;
  padding:6px 9px;
  margin-top:4px;
  max-width:100%;
  white-space:normal;
  overflow-wrap:anywhere;
}
.cases-wrapper .case-img {
  opacity:0 !important;
  z-index:0;
  filter:grayscale(1) blur(8px) !important;
  transform:scale(1.045) !important;
  transition:opacity .34s ease,filter .48s ease,transform .7s ease,background-position .24s ease-out !important;
  background-position:var(--v10-img-x,50%) var(--v10-img-y,50%);
}
/* Imagem revelada apenas no foco, hover ou primeiro toque. */
.cases-wrapper .case-item:hover .case-img,
.cases-wrapper .case-item:focus-visible .case-img,
.cases-wrapper .case-item.is-expanded .case-img,
body.theme-active .cases-wrapper .case-item.is-theme-focus .case-img {
  opacity:1 !important;
  filter:grayscale(0) blur(0) !important;
  transform:scale(1) !important;
}
.cases-wrapper .case-item:hover .case-header,
.cases-wrapper .case-item:focus-visible .case-header,
.cases-wrapper .case-item.is-expanded .case-header {color:#fff !important;}
.cases-wrapper .case-item:hover .case-header::before,
.cases-wrapper .case-item:focus-visible .case-header::before,
.cases-wrapper .case-item.is-expanded .case-header::before,
body.theme-active .cases-wrapper .case-item.is-theme-focus .case-header::before {
  content:'';position:absolute;z-index:-1;inset:0;
  background:linear-gradient(0deg,rgba(0,0,0,.84),rgba(0,0,0,.10) 75%);
  pointer-events:none;
}
.cases-wrapper .case-item:hover .case-category,
.cases-wrapper .case-item:focus-visible .case-category,
.cases-wrapper .case-item.is-expanded .case-category {background:#fff;color:#111;}
/* Paleta global V4: agora realça um card sem deformar sua largura. */
body.theme-active .cases-wrapper.has-theme-focus {
  border:0 !important;
  background:transparent !important;
  opacity:1 !important;
  filter:none !important;
}
body.theme-active .cases-wrapper .case-item {
  flex:initial !important;
  border-color:var(--scene-border) !important;
  background:var(--scene-panel) !important;
  color:var(--scene-accent) !important;
}
body.theme-active .cases-wrapper.has-theme-focus .case-item.is-theme-focus {
  flex:initial !important;
  border:6px solid var(--scene-accent) !important;
  box-shadow:none !important;
  background:var(--scene-panel) !important;
  color:var(--scene-accent) !important;
  opacity:1 !important;
  filter:none !important;
  z-index:12;
}
body.theme-active .cases-wrapper.has-theme-focus .case-item:not(.is-theme-focus) {
  opacity:.19 !important;
  filter:blur(1.5px) !important;
}
body.theme-active .case-item.is-theme-focus .case-header,
body.theme-active .case-item.is-theme-focus .case-title {color:var(--scene-accent) !important;text-shadow:none !important;}
body.theme-active .case-item.is-theme-focus .case-category {background:var(--scene-accent) !important;color:var(--scene-bg) !important;}
body.theme-active .cases-wrapper .case-item.is-theme-focus .case-header::before {
  background:linear-gradient(0deg,var(--scene-bg) -18%,rgba(0,0,0,.18) 90%) !important;
}
.cases-wrapper .case-item:focus-visible {outline:3px dashed var(--scene-accent,#111);outline-offset:4px}
@media (max-width:768px) {
  .cases-wrapper {grid-template-columns:minmax(0,1fr) !important;gap:13px !important;}
  .cases-wrapper .case-item,
  .cases-wrapper .case-item:first-child:not([hidden]),
  body.theme-active .cases-wrapper.has-theme-focus .case-item.is-theme-focus {
    grid-column:1 / -1;
    height:clamp(230px,68vw,315px) !important;
    min-height:230px !important;
    border-width:5px !important;
  }
  .cases-wrapper .case-item .case-header {padding:18px !important;gap:6px;}
  .cases-wrapper .case-item .case-title,
  .cases-wrapper .case-item:first-child .case-title,
  .cases-wrapper .case-item.active .case-title {font-size:clamp(26px,7.4vw,42px) !important;}
  .cases-wrapper .case-category {font-size:clamp(15px,4.2vw,19px)}
  .cases-wrapper .case-item.is-expanded {background:#111 !important;color:#fff !important}
  body.theme-active .cases-wrapper.has-theme-focus .case-item.is-theme-focus {border-width:5px !important;}
  .cases-wrapper .case-item:hover {transform:none;}
}
@media (prefers-reduced-motion:reduce) {
  .cases-wrapper .case-item, .cases-wrapper .case-img{transition:none !important;transform:none !important;}
}