:root{
  --cream:#f6f1ea;
  --green:#0d3430;
  --gold:#c69b56;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;width:100%;min-height:100%;background:var(--cream);}
body{overflow-x:hidden;}
.landing{width:100%;margin:0;padding:0;background:var(--cream);}
.visual{position:relative;width:100%;max-width:none;margin:0;padding:0;background:var(--cream);line-height:0;overflow:hidden;}
.visual img{display:block;width:100%;height:auto;margin:0;padding:0;border:0;}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}
.hotspot{position:absolute;display:block;z-index:5;border-radius:2px;line-height:1;}
.hotspot:focus-visible{outline:2px solid var(--gold);outline-offset:4px;}
/* Coordinates follow the visual mockup proportionally. */
.hotspot-bluewater{left:5.7%;top:34.0%;width:25.5%;height:3.0%;}
.hotspot-naora-top{left:5.7%;top:37.7%;width:25.5%;height:3.0%;}
.hotspot-naora-bottom{left:5.5%;top:91.8%;width:20.5%;height:3.0%;}
@media (max-width:760px){
  .visual img{width:180%;max-width:none;transform:translateX(-22%);transform-origin:top left;}
  .hotspot-bluewater{left:7%;top:34.2%;width:48%;height:2.8%;}
  .hotspot-naora-top{left:7%;top:37.8%;width:48%;height:2.8%;}
  .hotspot-naora-bottom{left:7%;top:91.8%;width:42%;height:2.8%;}
}
@media (max-width:420px){
  .visual img{width:220%;transform:translateX(-30%);}
}