/* Shared portfolio brand cards — same visual system as /projeler */
.mars-portfolio-cards{color:#111211}
.mars-portfolio-cards-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:28px 32px;
}
.mars-portfolio-cards .portfolio-card{
  height:100%;
  display:flex;
  flex-direction:column;
  color:inherit;
  text-decoration:none;
}
.mars-portfolio-cards .portfolio-cover{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  isolation:isolate;
  overflow:hidden;
  aspect-ratio:1.5;
  min-height:0;
  border-radius:16px;
  background:#f2eee7;
  color:#181918;
  padding:65px 30px;
  flex-shrink:0;
}
.mars-portfolio-cards .portfolio-cover:before,
.mars-portfolio-cards .portfolio-cover:after{content:none}
.mars-portfolio-cards .cover-index,
.mars-portfolio-cards .cover-bottom{
  position:absolute;
  left:24px;
  right:24px;
  font-size:10px;
  letter-spacing:.12em;
  font-weight:700;
}
.mars-portfolio-cards .cover-index{top:24px}
.mars-portfolio-cards .cover-bottom{
  bottom:22px;
  display:flex;
  justify-content:space-between;
  align-items:center;
}
.mars-portfolio-cards .cover-bottom>span{
  display:grid;
  place-items:center;
  width:35px;
  height:35px;
  border-radius:50%;
  background:#dfff46;
  color:#111211;
  font-size:16px;
  font-weight:400;
  transition:transform .25s;
}
.mars-portfolio-cards .portfolio-logo-stage{
  position:relative;
  width:85%;
  max-width:420px;
  aspect-ratio:2.3;
  overflow:hidden;
  flex:none;
  transform:scale(1);
  transform-origin:center;
  transition:transform .25s ease;
}
.mars-portfolio-cards .portfolio-cover .portfolio-logo-stage img{
  position:absolute;
  left:50%;
  top:50%;
  width:100%;
  height:auto;
  max-width:none;
  max-height:none;
  transform:translate(-50%,-50%);
  object-fit:initial;
  display:block;
  transition:none;
}
.mars-portfolio-cards .card-caption{
  padding:20px 0 12px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  border-bottom:1px solid #d3d4ca;
  flex:1;
  min-height:114px;
}
.mars-portfolio-cards .card-caption h2{
  font-size:24px;
  letter-spacing:-.04em;
  margin:0 0 7px;
  font-weight:700;
  color:#111211;
  font-family:Manrope,sans-serif;
}
.mars-portfolio-cards .card-caption p{
  font-size:13px;
  color:#535650;
  margin:0;
}
.mars-portfolio-cards .view-project{
  font-size:12px;
  font-weight:600;
  white-space:normal;
  max-width:120px;
  text-align:right;
  color:#111211;
  border:0;
  padding:0;
}

/* Brand themes */
.mars-portfolio-cards .carwax .portfolio-cover{background:#fff}
.mars-portfolio-cards .otomotto .portfolio-cover{background:#083238;color:#b9ffff}
.mars-portfolio-cards .jungheinrich .portfolio-cover{background:#fff;color:#191919}
.mars-portfolio-cards .ieee-gtu .portfolio-cover{background:#151b27;color:#fff}
.mars-portfolio-cards .isg-airport-hotel .portfolio-cover{background:#e4eff2;color:#0b2632}
.mars-portfolio-cards .ton .portfolio-cover{background:#fff;color:#0b2632}
.mars-portfolio-cards .lime-sanat .portfolio-cover{background:#292b23;color:#edffb1}
.mars-portfolio-cards .jungheinrich .portfolio-logo-stage img{width:112%}
.mars-portfolio-cards .ton .portfolio-logo-stage img{width:142%}
.mars-portfolio-cards .otomotto .portfolio-logo-stage img{width:100%}
.mars-portfolio-cards .ieee-gtu .portfolio-logo-stage img{width:100%}
.mars-portfolio-cards .isg-airport-hotel .portfolio-logo-stage{aspect-ratio:2.6}
.mars-portfolio-cards .isg-airport-hotel .portfolio-logo-stage img{width:62%}
.mars-portfolio-cards .lime-sanat .portfolio-logo-stage img{width:108%}

@media(hover:hover){
  .mars-portfolio-cards .portfolio-card:hover .cover-bottom>span{transform:rotate(45deg)}
  .mars-portfolio-cards .portfolio-card:hover .view-project{text-decoration:underline;text-underline-offset:5px}
}
@media(hover:hover) and (prefers-reduced-motion:no-preference){
  .mars-portfolio-cards a.portfolio-card:hover .portfolio-logo-stage{transform:scale(1.035)}
}
@media(max-width:767.98px){
  .mars-portfolio-cards-grid{grid-template-columns:1fr;gap:22px}
  .mars-portfolio-cards .portfolio-cover{aspect-ratio:1.3;padding:60px 25px}
  .mars-portfolio-cards .card-caption{min-height:105px;align-items:flex-start}
  .mars-portfolio-cards .card-caption h2{font-size:22px}
}
@media(prefers-reduced-motion:reduce){
  .mars-portfolio-cards .cover-bottom>span,
  .mars-portfolio-cards .portfolio-logo-stage{transition:none}
}
