:root{
  /* Homepage hero. The desktop file is a 16:9 studio shot of Ryan and Paul
     with the wall between them left empty for the headline; the mobile file is
     the portrait crop of the same shot. */
  --hero-photo:url('/media/banners/home-desktop.jpg');
  --hero-photo-mobile:url('/media/banners/home-mobile.jpg');

  --ryan-photo:url('/media/team/ryan.jpg');
  --paul-photo:url('/media/team/paul.jpg');
  --video-thumb:url('/media/video-thumb.jpg');

  /* Buy and sell page banners. Desktop files are 3500x983 and built for very
     wide screens; mobile files are 703x1536 portrait crops of the same scene.
     Which one loads is decided by orientation, not width, in the V18 block of
     styles.css — a tablet held upright gets the portrait crop, the same tablet
     turned sideways gets the wide one. */
  --buy-banner:url('/media/banners/buy-desktop.jpg');
  --buy-banner-mobile:url('/media/banners/buy-mobile.jpg');
  --sell-banner:url('/media/banners/sell-desktop.jpg');
  --sell-banner-mobile:url('/media/banners/sell-mobile.jpg');

  /* Sold gallery. Same pair as the others, switched on orientation in the V18
     block of styles.css. These two live in media/ rather than media/banners/
     because that is where they were supplied; nothing depends on the folder. */
  --sold-banner:url('/media/sold-bg.jpg');
  --sold-banner-mobile:url('/media/sold-bg-mobile.jpg');

  /* Contact. The desktop frame sits Ryan and Paul hard left with the room
     open to the right, so this one anchors left rather than centre — see
     .hero-banner-contact in the V18 block. */
  --contact-banner:url('/media/banners/contact-desktop.jpg');
  --contact-banner-mobile:url('/media/banners/contact-mobile.jpg');

  /* Backdrops for the two paid-traffic funnel pages. These are placeholders
     borrowed from the hero set — drop the real photos in media/ and change
     the two lines below, nothing else. */
  --funnel-eval-photo:url('/media/heroes/selling.jpg');
  --funnel-search-photo:url('/media/heroes/homes-for-sale.jpg');

}