/* V285 — content visual balance
   Adds one restrained, relevant visual break to long text-led marketing/resource pages.
   Existing hero, sticky header, navigation, footer, package layouts and mobile behaviour remain unchanged. */

.v285-context-visual-section{
  padding:clamp(10px,1.8vw,24px) 0 clamp(58px,7vw,92px);
  background:#fff;
}
.seo250-section + .v285-context-visual-section{margin-top:calc(clamp(18px,2.2vw,30px) * -1);}
.v285-context-visual{
  display:grid;
  grid-template-columns:minmax(0,1.7fr) minmax(260px,.65fr);
  margin:0;
  overflow:hidden;
  border:1px solid rgba(7,94,188,.14);
  border-radius:24px;
  background:#08243a;
  box-shadow:0 22px 54px rgba(4,31,58,.12);
}
.v285-context-visual__media{
  display:block;
  width:100%;
  height:clamp(300px,31vw,430px);
  object-fit:cover;
  background:#f3f7fb;
}
.v285-context-visual--contain .v285-context-visual__media{
  object-fit:contain;
  padding:clamp(16px,2.3vw,30px);
}
.v285-context-visual figcaption{
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:12px;
  padding:clamp(28px,3.4vw,48px);
  color:#dcebf8;
}
.v285-context-visual figcaption::before{
  content:'DESIGN IN PRACTICE';
  color:#69bcff;
  font-size:12px;
  font-weight:800;
  letter-spacing:.14em;
}
.v285-context-visual figcaption strong{
  color:#fff;
  font-size:clamp(23px,2vw,31px);
  line-height:1.08;
  letter-spacing:-.025em;
}
.v285-context-visual figcaption span{
  color:#c7d9e9;
  font-size:16px;
  line-height:1.65;
}
@media(max-width:760px){
  .v285-context-visual-section{padding:8px 0 54px;}
  .v285-context-visual{grid-template-columns:1fr;border-radius:18px;}
  .v285-context-visual__media{height:260px;}
  .v285-context-visual--contain .v285-context-visual__media{padding:14px;}
  .v285-context-visual figcaption{padding:24px;}
  .v285-context-visual figcaption strong{font-size:23px;}
}