/* RMI homepage — sky-blue hero and concentric gold/cyan circular halo.
   This stylesheet is intentionally after rmi-home-layout-fix.css so the
   responsive two-column headline fix is retained. */
.hero {
  position:relative;
  display:block;
  overflow:hidden;
  isolation:isolate;
  background:
    radial-gradient(ellipse 57% 90% at 79% 47%, rgba(208,247,255,.30), transparent 72%),
    linear-gradient(125deg,#126894 0%,#277eac 49%,#419fcc 100%);
  color:#FFFFFF;
}
/* Very broad atmospheric ring/arc behind the logo; decorative only. */
.hero::before {
  content:"";
  position:absolute;
  width:min(960px,85vw);
  aspect-ratio:1;
  top:50%;
  left:72%;
  transform:translate(-50%,-50%);
  border:1px solid rgba(216,172,82,.12);
  border-radius:50%;
  background:radial-gradient(circle, rgba(196,238,252,.095) 0%,rgba(196,238,252,.040) 45%, transparent 65%);
  box-shadow:0 0 0 72px rgba(255,255,255,.01),0 0 0 154px rgba(216,246,255,.036);
  z-index:0;
  pointer-events:none;
}
.hero::after {
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  background:linear-gradient(117deg, transparent 0 46%,rgba(213,245,255,.095) 46.1% 46.25%,transparent 46.35%);
  pointer-events:none;
}
.hero > .hero-inner {position:relative;z-index:1;}
.hero .eyebrow.light {color:#E6BF6D;}
.hero .eyebrow-line {background:#46BCEB;}
.hero .hero-copy h1 {color:#FFFFFF;}
.hero .hero-copy h1 em {color:#E6BF6D;}
.hero .hero-intro {color:#E7F5FD;}
.hero .hero-proof {border-top-color:rgba(255,255,255,.22);}
.hero .hero-proof b {color:#E6BF6D;}
.hero .hero-proof small {color:#D7EAF3;}
.hero .hero-side-label {color:rgba(255,255,255,.52);}
.hero .btn-outline-light {
  border:1px solid rgba(255,255,255,.64);
  background:rgba(255,255,255,.055);
  color:#FFFFFF;
}
.hero .btn-outline-light:hover {background:rgba(255,255,255,.14);color:#FFFFFF;}
.hero .hero-visual {position:relative;isolation:isolate;}
.hero .hero-halo {
  position:absolute;
  width:min(530px,105%);
  aspect-ratio:1;
  height:auto;
  inset:50% auto auto 50%;
  transform:translate(-50%,-50%);
  border:1px solid rgba(216,172,82,.27);
  border-radius:50%;
  background:radial-gradient(circle,rgba(198,240,255,.15),rgba(198,240,255,.05) 61%,transparent 75%);
  box-shadow:0 0 0 46px rgba(255,255,255,.018),0 0 0 95px rgba(210,246,255,.025);
  z-index:0;
  pointer-events:none;
}
.hero .hero-logo-panel.hero-logo-panel-dark {
  position:relative;
  z-index:1;
  background:linear-gradient(150deg,#277faa,#155e89);
  border:1px solid rgba(216,172,82,.72);
  box-shadow:0 23px 58px rgba(5,38,70,.24);
}
.hero .hero-logo-panel.hero-logo-panel-dark::after {
  border-color:rgba(214,247,255,.37);
}
.hero .hero-logo-panel-dark .panel-label {color:#FFFFFF;}
.hero .hero-logo-panel-dark .panel-label strong {color:#D8AC52;}
.hero .hero-note {position:relative;z-index:2;}
.hero .hero-cross {color:rgba(216,172,82,.7);}
@media(max-width:1100px) {
  .hero::before {left:50%;top:75%;width:min(800px,130vw);}
}
@media(max-width:680px) {
  .hero::before {left:50%;top:76%;width:125vw;}
  .hero .hero-halo {width:min(470px,125%);box-shadow:0 0 0 34px rgba(255,255,255,.016),0 0 0 68px rgba(216,247,255,.024);}
  .hero .hero-logo-panel.hero-logo-panel-dark {background:linear-gradient(145deg,#277faa,#155e89);}
}