/* Visual storytelling for the English applications, case studies, distribution and company pages. */
.app-grid-visual .app-card-visual{
  min-height:0;
  padding:0;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  border-color:#d4e2e9;
  box-shadow:0 12px 34px rgba(8,43,71,.06);
  transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease
}
.app-grid-visual .app-card-visual:hover{
  transform:translateY(-5px);
  border-color:#9bcdbd;
  box-shadow:0 22px 48px rgba(8,43,71,.12)
}
.app-card-media{
  position:relative;
  height:190px;
  overflow:hidden;
  background:#dfe8ed
}
.app-card-media:after{
  position:absolute;
  inset:35% 0 0;
  background:linear-gradient(180deg,transparent,rgba(4,27,46,.64));
  content:"";
  pointer-events:none
}
.app-card-media img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform .35s ease
}
.app-card-visual:hover .app-card-media img{transform:scale(1.03)}
.app-card-media .icon{
  position:absolute;
  z-index:2;
  left:17px;
  bottom:16px;
  width:auto;
  height:34px;
  padding:0 11px;
  border:1px solid rgba(255,255,255,.6);
  border-radius:9px;
  background:rgba(255,255,255,.9);
  color:#075a47;
  font-size:10px;
  letter-spacing:.08em;
  backdrop-filter:blur(8px)
}
.app-card-copy{flex:1;padding:22px 24px 25px}
.app-card-copy h3{margin:0 0 8px}
.app-card-copy p{margin:0}

.client-portfolio-section{overflow:hidden}
.client-poster-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:18px
}
.client-poster{
  position:relative;
  display:flex;
  min-height:285px;
  align-items:flex-end;
  overflow:hidden;
  border-radius:20px;
  background:#0a304e;
  box-shadow:0 18px 46px rgba(7,38,62,.12)
}
.client-poster:after{
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,rgba(3,20,34,.03) 28%,rgba(3,23,39,.88) 100%);
  content:"";
  pointer-events:none
}
.client-poster img{
  position:absolute;
  inset:0;
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform .4s ease
}
.client-poster:hover img{transform:scale(1.03)}
.client-poster-copy{
  position:relative;
  z-index:1;
  width:100%;
  padding:27px 28px
}
.client-poster-copy .client-index{
  display:block;
  margin-bottom:8px;
  color:#53dfb2;
  font-size:10px;
  font-weight:900;
  letter-spacing:.14em
}
.client-poster-copy b{
  display:block;
  color:#fff;
  font-size:26px;
  line-height:1.15
}
.client-poster-copy small{
  display:block;
  margin-top:7px;
  color:rgba(255,255,255,.72);
  font-size:12px
}
.client-secondary-wall{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:13px;
  margin-top:18px
}
.client-secondary{
  display:grid;
  min-height:105px;
  align-content:center;
  padding:19px;
  border:1px solid #d9e5eb;
  border-radius:15px;
  background:#fff
}
.client-secondary b{color:#153f5a;font-size:16px}
.client-secondary small{margin-top:6px;color:#78909f}

.partner-support-layout{
  display:grid;
  grid-template-columns:.82fr 1.18fr;
  gap:24px;
  align-items:stretch
}
.partner-support-media{
  position:relative;
  min-height:430px;
  margin:0;
  overflow:hidden;
  border-radius:20px;
  background:#0a304e;
  box-shadow:0 18px 48px rgba(7,38,62,.12)
}
.partner-support-media:after{
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,rgba(3,24,40,.04) 25%,rgba(3,24,40,.9) 100%);
  content:""
}
.partner-support-media img{
  display:block;
  width:100%;
  height:100%;
  min-height:430px;
  object-fit:cover;
  transition:transform .4s ease
}
.partner-support-media:hover img{transform:scale(1.03)}
.partner-support-media figcaption{
  position:absolute;
  z-index:1;
  right:0;
  bottom:0;
  left:0;
  padding:29px
}
.partner-support-media figcaption span{
  display:block;
  color:#4cddb0;
  font-size:10px;
  font-weight:900;
  letter-spacing:.14em
}
.partner-support-media figcaption b{
  display:block;
  max-width:380px;
  margin-top:8px;
  color:#fff;
  font-size:24px;
  line-height:1.25
}
.partner-support-layout .value-grid{align-content:stretch}
.partner-support-layout .value-card{
  display:flex;
  min-height:0;
  flex-direction:column;
  justify-content:center
}

.company-intro-layout{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:48px;
  align-items:center
}
.company-collage{
  display:grid;
  grid-template-columns:1.15fr .85fr;
  grid-template-rows:repeat(2,174px);
  gap:12px
}
.company-image-card{
  position:relative;
  min-width:0;
  margin:0;
  overflow:hidden;
  border-radius:17px;
  background:#dfe8ed
}
.company-image-card:first-child{grid-row:1/3}
.company-image-card:after{
  position:absolute;
  inset:40% 0 0;
  background:linear-gradient(180deg,transparent,rgba(4,27,46,.75));
  content:""
}
.company-image-card img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform .4s ease
}
.company-image-card:hover img{transform:scale(1.03)}
.company-image-card figcaption{
  position:absolute;
  z-index:1;
  right:15px;
  bottom:14px;
  left:15px;
  color:#fff;
  font-size:11px;
  font-weight:800;
  line-height:1.35
}
.company-supply-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:13px;
  margin-top:36px
}
.company-supply-grid .timeline-item{
  display:block;
  min-height:150px;
  padding:22px;
  border-left:3px solid #18a77a;
  border-radius:0 14px 14px 0
}
.company-supply-grid .timeline-item b{display:block;margin-bottom:10px}
.company-supply-grid .timeline-item p{font-size:12px;line-height:1.7}

.field-hint{
  display:block;
  color:#78909f;
  font-size:10px;
  font-weight:500;
  line-height:1.45
}

@media(max-width:820px){
  .app-card-media{height:210px}
  .client-poster{min-height:255px}
  .client-secondary-wall{grid-template-columns:repeat(2,1fr)}
  .partner-support-layout,.company-intro-layout{grid-template-columns:1fr}
  .partner-support-media,.partner-support-media img{min-height:340px}
  .company-supply-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:560px){
  .app-card-media{height:205px}
  .client-poster-grid{grid-template-columns:1fr}
  .client-poster{min-height:240px}
  .client-poster-copy{padding:22px}
  .client-poster-copy b{font-size:22px}
  .client-secondary{min-height:92px;padding:15px}
  .partner-support-media,.partner-support-media img{min-height:280px}
  .partner-support-media figcaption{padding:22px}
  .partner-support-media figcaption b{font-size:21px}
  .company-collage{
    grid-template-columns:1fr 1fr;
    grid-template-rows:230px 145px
  }
  .company-image-card:first-child{grid-column:1/3;grid-row:auto}
  .company-supply-grid{grid-template-columns:1fr}
  .company-supply-grid .timeline-item{min-height:0}
}

/* Visual selection logic and values layouts */
.selection-logic-layout{display:grid;grid-template-columns:.9fr 1.1fr;gap:42px;align-items:start}
.selection-scene-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.selection-scene-card{display:flex;min-width:0;min-height:285px;overflow:hidden;flex-direction:column;border:1px solid #d7e3e9;border-radius:17px;background:#fff;color:inherit;text-decoration:none;transition:transform .25s,box-shadow .25s}
.selection-scene-card:hover{transform:translateY(-4px);box-shadow:0 18px 42px rgba(8,43,71,.1)}
.selection-scene-card img{display:block;width:100%;height:128px;object-fit:cover;transition:transform .35s}
.selection-scene-card:hover img{transform:scale(1.03)}
.selection-scene-card>div{display:flex;flex:1;flex-direction:column;padding:18px 20px}
.selection-scene-card b{color:#123f5b;font-size:15px}
.selection-scene-card p{margin:8px 0;color:#6b8292;font-size:12px;line-height:1.65}
.selection-scene-card span{display:flex;min-height:44px;align-items:flex-end;margin-top:auto;color:#0a8260;font-size:11px;font-weight:850}
.values-visual-layout{display:grid;grid-template-columns:.9fr 1.1fr;gap:20px;align-items:stretch}
.values-photo-panel{position:relative;min-height:430px;margin:0;overflow:hidden;border-radius:20px;background:#0a304e;box-shadow:0 18px 48px rgba(7,38,62,.12)}
.values-photo-panel:after{position:absolute;inset:24% 0 0;background:linear-gradient(180deg,transparent,rgba(3,23,39,.92));content:""}
.values-photo-panel img{display:block;width:100%;height:100%;min-height:430px;object-fit:cover;transition:transform .4s}
.values-photo-panel:hover img{transform:scale(1.03)}
.values-photo-panel figcaption{position:absolute;z-index:1;right:0;bottom:0;left:0;padding:28px}
.values-photo-panel figcaption span{display:block;color:#50dbaf;font-size:10px;font-weight:900;letter-spacing:.12em}
.values-photo-panel figcaption b{display:block;margin-top:9px;color:#fff;font-size:21px;line-height:1.45}
.values-card-grid{grid-template-columns:repeat(2,1fr)!important;align-content:stretch}
.values-card-grid .value-card{display:flex;min-height:0;flex-direction:column;justify-content:center}
@media(max-width:820px){.selection-logic-layout,.values-visual-layout{grid-template-columns:1fr}.values-photo-panel,.values-photo-panel img{min-height:340px}}
@media(max-width:560px){.selection-scene-grid,.values-card-grid{grid-template-columns:1fr!important}.selection-scene-card{min-height:0}.selection-scene-card img{height:180px}.values-photo-panel,.values-photo-panel img{min-height:290px}.values-photo-panel figcaption{padding:22px}.values-photo-panel figcaption b{font-size:18px}}