/* FTIR.fun Visual Upgrade v2.1
   Layered on top of ftirfun-redesign-v2.css.
   Purpose: replace repeated SVG/wireframe focal art with distinct raster product visuals.
   No route, copy, billing, entitlement, JS hook, or backend behavior changes. */

img[src*="redesign-v2-1/"]{
  display:block;
  width:100%;
  height:auto;
  image-rendering:auto;
}

/* Hero: product scene, not a flat illustration. */
.ft2-hero__visual img[src*="redesign-v2-1/"],
.ft2-page-hero__visual img[src*="redesign-v2-1/"],
.ft2-request-hero__visual img[src*="redesign-v2-1/"]{
  border-radius:22px;
  border:1px solid rgba(199,215,205,.86);
  box-shadow:0 28px 70px rgba(17,48,37,.12),0 5px 18px rgba(17,48,37,.05);
  object-fit:cover;
  aspect-ratio:8/5;
}
.ft2-hero__visual img[src*="redesign-v2-1/"]{transform:rotate(.15deg)}

/* Core platform: a wide analytical view. */
.ft2-core__feature{min-height:620px}
.ft2-core__visual{padding:8px 22px 22px;align-items:stretch}
.ft2-core__visual img[src*="redesign-v2-1/"]{
  max-height:none;
  aspect-ratio:8/5;
  object-fit:cover;
  border-radius:18px;
  border:1px solid var(--ft2-line);
}

/* The two right-rail visuals must read as different products at a glance. */
.ft2-rail-item{grid-template-columns:minmax(0,1fr) 218px;overflow:hidden}
.ft2-rail-item img[src*="redesign-v2-1/"]{
  width:218px;
  height:150px;
  object-fit:cover;
  border-radius:15px;
  border:1px solid var(--ft2-line);
  box-shadow:var(--ft2-shadow-xs);
}

/* Image → CSV is deliberately storyboard-like and wide. */
.ft2-tool-main__visual img[src*="redesign-v2-1/"]{
  aspect-ratio:8/5;
  object-fit:cover;
  border-radius:18px;
  border:1px solid var(--ft2-line);
}

/* Professional services uses an output/deliverable visual rather than another app window. */
.ft2-service-cta__visual img[src*="redesign-v2-1/"],
.ft2-manual-panel img[src*="redesign-v2-1/"]{
  border-radius:18px;
  border:1px solid var(--ft2-line);
  box-shadow:var(--ft2-shadow-sm);
  object-fit:cover;
}

/* Research / QC / Formulation each use a different analytical visual grammar. */
.ft2-workbench-card__visual{padding:0;aspect-ratio:1.55/1;background:#f3f7f4}
.ft2-workbench-card__visual img[src*="redesign-v2-1/"]{
  width:100%;height:100%;object-fit:cover;
}

/* Result is report-like; remove the old nested-card feeling. */
.ft2-evidence__visual{padding:0;overflow:hidden;background:#eef3ef}
.ft2-evidence__visual img[src*="redesign-v2-1/"]{
  aspect-ratio:8/5;object-fit:cover;
}

/* Editorial pages: let each visual stand on its own, with less frame-on-frame chrome. */
.ft2-split__visual,
.ftx-split__visual{
  padding:0;overflow:hidden;background:#eef3ef;box-shadow:var(--ft2-shadow-xs)
}
.ft2-split__visual img[src*="redesign-v2-1/"],
.ftx-split__visual img[src*="redesign-v2-1/"]{
  aspect-ratio:8/5;object-fit:cover;
}

/* Page hero raster images should never look like small icons. */
.ft2-page-hero__visual,.ft2-request-hero__visual{min-width:0}

@media(max-width:1024px){
  .ft2-rail-item{grid-template-columns:minmax(0,1fr) 185px}
  .ft2-rail-item img[src*="redesign-v2-1/"]{width:185px;height:132px}
}
@media(max-width:767px){
  .ft2-hero__visual img[src*="redesign-v2-1/"],
  .ft2-page-hero__visual img[src*="redesign-v2-1/"],
  .ft2-request-hero__visual img[src*="redesign-v2-1/"]{border-radius:16px;aspect-ratio:8/5}
  .ft2-core__feature{min-height:0}
  .ft2-core__visual{padding:4px 14px 14px}
  .ft2-rail-item{grid-template-columns:1fr;padding:22px}
  .ft2-rail-item img[src*="redesign-v2-1/"]{width:100%;height:auto;aspect-ratio:8/5;order:-1}
  .ft2-workbench-card__visual{aspect-ratio:8/5}
}
