*{box-sizing:border-box}
html,body{margin:0;width:100%;min-width:320px;min-height:100%;background:#fff}
body{overflow-x:hidden;font-family:Arial,Helvetica,sans-serif}
.gateway-page{min-height:100svh;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;background:#fff}
.gateway-stage{position:relative;width:min(100vw,150svh);aspect-ratio:3/2;margin:0 auto;overflow:hidden;background:#fff}
.gateway-art{display:block;width:100%;height:100%;object-fit:contain;user-select:none;-webkit-user-drag:none}
.gateway-hotspot{position:absolute;z-index:3;display:block;border-radius:12px;outline:0;transition:background .18s ease,box-shadow .18s ease,transform .18s ease}
.gateway-hotspot:hover,.gateway-hotspot:focus-visible{background:rgba(255,255,255,.08);box-shadow:0 0 0 3px rgba(255,255,255,.72),0 8px 24px rgba(0,0,0,.16);transform:translateY(-1px)}
/* Percentage coordinates align with the two CTA buttons in the approved 1536x1024 artwork. */
.hotspot-star{left:17.55%;top:57.35%;width:24.15%;height:8.85%}
.hotspot-petro{left:58.45%;top:57.35%;width:25.10%;height:8.85%}
.gateway-mobile-actions{display:none}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

@media(max-width:700px){
  .gateway-page{min-height:100svh;background:linear-gradient(180deg,#fff 0%,#f5faff 100%)}
  .gateway-stage{width:100vw;aspect-ratio:3/2}
  .gateway-hotspot{border-radius:7px}
  .gateway-mobile-actions{display:grid;width:min(100% - 24px,520px);gap:10px;margin:12px auto 22px}
  .mobile-company{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:64px;padding:13px 15px;border-radius:12px;color:#fff;text-decoration:none;box-shadow:0 8px 20px rgba(4,32,70,.12)}
  .mobile-company span{font-size:12px;font-weight:700;line-height:1.35}
  .mobile-company strong{font-size:11px;white-space:nowrap;letter-spacing:.03em}
  .mobile-star{background:linear-gradient(135deg,#0873c7,#0c3979)}
  .mobile-petro{background:linear-gradient(135deg,#c20b36,#811124)}
}

@media(max-width:420px){
  .gateway-mobile-actions{width:calc(100% - 16px);margin-top:9px}
  .mobile-company{min-height:60px;padding:11px 12px}
  .mobile-company span{max-width:56%;font-size:11px}
  .mobile-company strong{font-size:10px}
}