/* ============ TWO-COLUMN LAYOUT + IMAGE FRAMES ============ */
.cols2{display:grid;grid-template-columns:1.15fr .85fr;gap:56px;align-items:stretch}
.cols2.rev .imgph,.cols2.rev .imgframe{order:-1}

.imgph{border:2px dashed rgba(70,65,60,.35);border-radius:18px;min-height:440px;
  display:grid;place-items:center;background:rgba(255,255,255,.5);
  font-family:"DM Sans";font-weight:700;font-size:13px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--ink-soft)}
.road .imgph{border-color:rgba(255,255,255,.5);background:rgba(255,255,255,.08);color:#E4F4FC}

.imgframe{position:relative;border-radius:18px;overflow:hidden;
  box-shadow:0 14px 44px rgba(70,65,60,.16);
  background:linear-gradient(150deg,#0E5E8E,#008CCC);min-height:440px}
.imgframe img{width:100%;height:100%;object-fit:cover;display:block}
.imgtag{position:absolute;bottom:12px;left:12px;background:rgba(10,45,66,.82);color:#fff;
  font-family:"DM Sans";font-weight:600;font-size:12px;letter-spacing:.02em;
  padding:7px 12px;border-radius:8px;z-index:2}
.road .imgframe{box-shadow:0 14px 44px rgba(10,45,66,.35)}

@media (max-width:900px){
  .cols2,.cols2.rev{grid-template-columns:1fr;gap:28px}
  .cols2.rev .imgph,.cols2.rev .imgframe{order:0}
  .imgph{min-height:240px}
}