/* EPICORE ANIMATED CONNECTED-BUSINESS CIRCLE - FULL VISIBILITY FIX R1
   Purpose:
   - Keep the complete animated circle, labels and lower caption visible.
   - Preserve the approved left-aligned text and Home-style header.
   - Desktop only. Existing tablet/mobile layout remains unchanged.
*/

@media (min-width:1080px){

  /* HOME
     The current Home hero has enough height after the CTA visibility fix.
     Centre the map and keep a safe vertical margin inside the hero. */
  body.next-site .next-home-hero{
    position:relative !important;
    overflow:hidden !important;
  }

  body.next-site .next-home-hero .epv3-map,
  body.next-site .next-home-hero .epv3-map.epv3-map-standard,
  body.next-site .next-home-hero .epv3-map.epv3-map-compact,
  body.next-site .next-home-hero .epv3-map.epv3-map-mini{
    position:absolute !important;
    left:auto !important;
    right:clamp(46px,4vw,82px) !important;
    top:50% !important;
    bottom:auto !important;
    width:min(560px,42vw) !important;
    max-width:none !important;
    min-width:0 !important;
    height:auto !important;
    min-height:0 !important;
    aspect-ratio:1.2/1 !important;
    margin:0 !important;
    transform:translateY(-50%) !important;
    transform-origin:center center !important;
  }

  /* NORMAL INNER PAGES
     Their approved hero is 440px high. 455px map width gives the circle
     and its top/bottom labels enough breathing room without changing text. */
  body.next-site .next-inner-hero{
    position:relative !important;
    overflow:hidden !important;
  }

  body.next-site .next-inner-hero .epv3-map,
  body.next-site .next-inner-hero .epv3-map.epv3-map-standard,
  body.next-site .next-inner-hero .epv3-map.epv3-map-compact,
  body.next-site .next-inner-hero .epv3-map.epv3-map-mini{
    position:absolute !important;
    left:auto !important;
    right:clamp(50px,4.2vw,88px) !important;
    top:50% !important;
    bottom:auto !important;
    width:min(455px,34vw) !important;
    max-width:none !important;
    min-width:0 !important;
    height:auto !important;
    min-height:0 !important;
    aspect-ratio:1.2/1 !important;
    margin:0 !important;
    transform:translateY(-50%) !important;
    transform-origin:center center !important;
  }

  /* EXPLORE has its own hero class. */
  body.next-site .explore-hero{
    position:relative !important;
    overflow:hidden !important;
  }

  body.next-site .explore-hero .epv3-map,
  body.next-site .explore-hero .epv3-map.epv3-map-standard,
  body.next-site .explore-hero .epv3-map.epv3-map-compact,
  body.next-site .explore-hero .epv3-map.epv3-map-mini{
    position:absolute !important;
    left:auto !important;
    right:clamp(50px,4.2vw,88px) !important;
    top:50% !important;
    bottom:auto !important;
    width:min(455px,34vw) !important;
    max-width:none !important;
    min-width:0 !important;
    height:auto !important;
    min-height:0 !important;
    aspect-ratio:1.2/1 !important;
    margin:0 !important;
    transform:translateY(-50%) !important;
    transform-origin:center center !important;
  }

  /* Keep the animated SVG itself fully drawable inside the safe map box. */
  body.next-site .next-home-hero .epv3-map svg,
  body.next-site .next-inner-hero .epv3-map svg,
  body.next-site .explore-hero .epv3-map svg{
    width:100% !important;
    height:100% !important;
    overflow:visible !important;
  }

  /* Caption must remain inside the map rather than hanging under the hero. */
  body.next-site .next-home-hero .epv3-caption,
  body.next-site .next-inner-hero .epv3-caption,
  body.next-site .explore-hero .epv3-caption{
    bottom:2% !important;
  }
}
